/* Two tapered ribbons echo the New World emblem; color follows each surface. */
.nw-arrow {
  --nw-arrow-width: 28px;
  display: inline-block;
  width: var(--nw-arrow-width);
  height: calc(var(--nw-arrow-width) * .9);
  flex: 0 0 auto;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: url('/assets/new-world-arrow.svg') center / contain no-repeat;
  mask: url('/assets/new-world-arrow.svg') center / contain no-repeat;
}
.nw-arrow--down { transform: rotate(135deg); }
.nw-exchange { display:inline-block; position:relative; width:28px; height:28px; flex:0 0 auto; vertical-align:middle; }
.nw-exchange::before,.nw-exchange::after {
  content:''; position:absolute; width:22px; height:20px; background:currentColor;
  -webkit-mask:url('/assets/new-world-arrow.svg') center / contain no-repeat;
  mask:url('/assets/new-world-arrow.svg') center / contain no-repeat;
}
.nw-exchange::before { left:1px; top:-1px; transform:rotate(45deg); }
.nw-exchange::after { right:1px; bottom:-1px; transform:rotate(225deg); }
.button .nw-arrow { --nw-arrow-width:28px; }
.button.small .nw-arrow { --nw-arrow-width:24px; }
.text-link .nw-arrow { --nw-arrow-width:26px; }
.mini-icon .nw-arrow { --nw-arrow-width:19px; }
.currency .nw-arrow { --nw-arrow-width:42px; }
.portal-top .nw-arrow { --nw-arrow-width:32px; }
.portal .button .nw-arrow { --nw-arrow-width:26px; }
.banking-portal .portal-decoration { width:265px; height:239px; right:-26px; top:151px; font-size:0; opacity:.075; transform:rotate(-8deg); }
.banking-portal .portal-decoration .nw-arrow { --nw-arrow-width:265px; }
.benefit-strip .nw-exchange { width:24px; height:24px; color:#746482; }
.benefit-strip .nw-exchange::before,.benefit-strip .nw-exchange::after { width:19px; height:17px; }
.sync-icon .nw-exchange { width:30px; height:28px; }
.bank-nav nav a,.bank-sidebar>a { display:inline-flex; align-items:center; gap:7px; }
.bank-nav .nw-arrow { --nw-arrow-width:21px; }
.bank-sidebar>a { display:flex; }
.bank-sidebar .nw-arrow { --nw-arrow-width:25px; }
@media(max-width:540px) {
  .button .nw-arrow,.text-link .nw-arrow { --nw-arrow-width:24px; }
  .button.small .nw-arrow { --nw-arrow-width:18px; }
  .header .small { padding-inline:10px; }
  .header .sign-in { white-space:nowrap; }
  .mini-icon .nw-arrow { --nw-arrow-width:14px; }
  .currency .nw-arrow { --nw-arrow-width:32px; }
  .portal-top .nw-arrow { --nw-arrow-width:30px; }
  .bank-nav .nw-arrow { --nw-arrow-width:17px; }
}
