/* Wise brand tokens, from unfairly.ai/brand-guidelines/wise (checked 2026-10-29).
   Sizes, spacing and components were measured on https://wise.com/ (Playwright at 1440x900 and 390x844 (Chrome 130 Mac UA), page at rest at scroll 0, computed styles and bounding boxes, page coordinates, 2026-10-29).
   Fonts: --font-* use the open stand-ins (load them from Google Fonts); --font-*-original name Wise's own faces, which you may only use if you have a licence. */
:root {
  --color-paper: #FFFFFF;
  --color-ink: #0E0F0C;
  --color-accent: #9FE870;
  --color-ink-soft: #454745;
  --color-bright-green: #9FE870;
  --color-forest-green: #163300;
  --color-bright-orange: #FFC091;
  --color-bright-yellow: #FFEB69;
  --color-bright-blue: #A0E1E1;
  --color-bright-pink: #FFD7EF;
  --color-dark-purple: #260A2F;
  --color-dark-gold: #3A341C;
  --color-dark-charcoal: #21231D;
  --color-dark-maroon: #320707;
  --color-content-primary: #0E0F0C;
  --color-content-secondary: #454745;
  --color-content-tertiary: #6A6C6A;
  --color-interactive-secondary: #868685;
  --color-background-neutral-forest-green-at-8: #EDEFEB;
  --color-border-neutral-use-at-12-alpha-rgba-14-15-12-0-12: #0E0F0C;
  --color-sentiment-negative: #A8200D;
  --color-sentiment-positive: #2F5711;
  --color-sentiment-warning: #EDC843;
  --color-base-dark: #121511;
  --color-white: #FFFFFF;
  --color-flag-palette-white: #FFFFFF;
  --color-flag-sky-blue: #78C9FF;
  --color-flag-yellow: #FFD400;
  --color-flag-orange: #FF7700;
  --color-flag-red: #F0263C;
  --color-flag-black: #000000;
  --color-flag-navy: #231D9A;
  --color-flag-green: #005B13;
  --color-flag-gold: #CC9500;
  --color-flag-maroon: #960A3C;
  --color-neutral-as-rendered-on-white: #EDEFEB;
  --color-chip-select-fill-use-at-7-alpha-rgba-62-59-7-0-07: #3E3B07;
  --color-chip-fill-as-rendered: #F1F1ED;
  --color-pale-green: #E2F6D5;
  --color-pale-blue-info: #E0F7F7;
  --color-fee-red: #CF2929;
  --color-savings-green: #054D28;
  --color-forest-green-pressed: #0D1F00;
  --color-disabled-arrow-fill: #EAEAEA;
  --color-disabled-arrow-glyph: #9E9E9E;
  --color-nav-hairline-on-green-phone: #8ED162;
  --color-muted-grey-text: #E8EBE6;
  --color-button-primary-forest-fill: #163300;
  --color-button-primary-forest-text: #9FE870;
  --color-button-accent-fill: #9FE870;
  --color-button-accent-text: #163300;
  --color-button-secondary-text: #163300;
  --color-button-secondary-ring: #163300;
  --color-button-nav-signup-fill: #163300;
  --color-button-nav-signup-text: #9FE870;
  --color-button-link-text: #163300;
  --color-card-neutral-fill: #EDEFEB;
  --color-card-forest-fill: #163300;
  --color-panel-white-fill: #FFFFFF;
  --font-display: "Plus Jakarta Sans", Inter, sans-serif;
  --font-display-original: "Wise Sans", "Plus Jakarta Sans", Inter, sans-serif;
  --font-body: Inter, Inter, Helvetica, Arial, sans-serif;
  --page-margin: 100px;
  --section-padding: 56px;
  --container-max: 1240px;
  --hero-text-max: 605px;
  --card-gap: 28px;
  --nav-height: 76px;
  --grid-gutter: 32px;
  --grid-columns: 12;
  --text-display-xl-size: 79.9px;
  --text-display-xl-line: 0.9415;
  --text-display-xl-weight: 800;
  --text-display-xl-tracking: -7.59px;
  --text-display-l-size: 52.4px;
  --text-display-l-line: 0.9408;
  --text-display-l-weight: 800;
  --text-display-l-tracking: -4.98px;
  --text-amount-size: 47px;
  --text-amount-line: 1.66;
  --text-amount-weight: 800;
  --text-amount-tracking: -5.83px;
  --text-amount-s-size: 36.1px;
  --text-amount-s-line: 0.942;
  --text-amount-s-weight: 800;
  --text-amount-s-tracking: -3.61px;
  --text-h2-inter-size: 44.75px;
  --text-h2-inter-line: 1.27;
  --text-h2-inter-weight: 600;
  --text-h2-inter-tracking: -1.34px;
  --text-lead-size: 20px;
  --text-lead-line: 1.4;
  --text-lead-weight: 400;
  --text-lead-tracking: 0.1px;
  --text-hero-sub-size: 20px;
  --text-hero-sub-line: 1.4;
  --text-hero-sub-weight: 600;
  --text-hero-sub-tracking: 0.1px;
  --text-card-title-size: 24.5px;
  --text-card-title-line: 1.3;
  --text-card-title-weight: 600;
  --text-card-title-tracking: -0.37px;
  --text-item-title-size: 20px;
  --text-item-title-line: 1.4;
  --text-item-title-weight: 600;
  --text-item-title-tracking: 0.1px;
  --text-body-l-size: 18px;
  --text-body-l-line: 1.44;
  --text-body-l-weight: 400;
  --text-body-l-tracking: 0.18px;
  --text-body-size: 16px;
  --text-body-line: 1.5;
  --text-body-weight: 400;
  --text-body-tracking: 0.08px;
  --text-label-size: 16px;
  --text-label-line: 1.5;
  --text-label-weight: 600;
  --text-label-tracking: -0.176px;
  --text-small-size: 14px;
  --text-small-line: 1.55;
  --text-small-weight: 400;
  --text-small-tracking: -0.08px;
  --text-footer-head-size: 18px;
  --text-footer-head-line: 1.44;
  --text-footer-head-weight: 600;
  --text-footer-head-tracking: 0.18px;
  --radius-button-primary-forest: 999px;
  --radius-button-accent: 999px;
  --radius-button-secondary: 999px;
  --radius-button-nav-signup: 999px;
  --radius-button-link: 999px;
  --radius-nav-link: 999px;
  --radius-chip: 16px;
  --radius-currency-select: 999px;
  --radius-card-neutral: 28px;
  --radius-card-forest: 28px;
  --radius-panel-white: 38px;
  --radius-carousel-arrow: 999px;
  --ease-button-colour: ease-in-out;
  --duration-button-colour: 150ms;
  --ease-nav-hover: cubic-bezier(0.8, 0.05, 0.2, 0.95);
  --duration-nav-hover: 350ms;
  --icon-product-16: 16px;
  --icon-product-24: 24px;
  --icon-product-32: 32px;
  --icon-editorial-48: 48px;
  --icon-editorial-64: 64px;
  --icon-editorial-96: 96px;
}
/* Phone values measured at 390px; Wise's CSS switches at 767px. */
@media (max-width: 767px) {
  :root {
    --page-margin: 16px;
    --section-padding: 48px;
    --text-display-xl-size: 40.6px;
    --text-display-l-size: 36.9px;
    --text-amount-size: 30.7px;
    --text-amount-s-size: 21.7px;
    --text-h2-inter-size: 34.45px;
    --text-lead-size: 17.27px;
    --text-hero-sub-size: 17.27px;
    --text-card-title-size: 19.27px;
    --text-item-title-size: 17.27px;
    --text-body-l-size: 15.27px;
    --text-body-size: 14px;
    --text-footer-head-size: 15.27px;
  }
}
.button-primary-forest {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 48px; padding: 0 24px; border-radius: 999px;
  background: #163300; color: #9FE870;
  font: 600 16px/1 var(--font-body);
}
.button-primary-forest:hover { background: #0D1F00; } /* observed */
.button-accent {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 48px; padding: 0 24px; border-radius: 999px;
  background: #9FE870; color: #163300;
  font: 600 16px/1 var(--font-body);
}
.button-secondary {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 48px; padding: 0 24px; border-radius: 999px;
  background: transparent; color: #163300;
  box-shadow: inset 0 0 0 1px #163300;
  font: 600 16px/1 var(--font-body);
}
.button-nav-signup {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 32px; padding: 0 12px; border-radius: 999px;
  background: #163300; color: #9FE870;
  font: 600 16px/1 var(--font-body);
}
.button-link {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 48px; padding: 0 24px; border-radius: 999px;
  background: transparent; color: #163300;
  font: 600 16px/1 var(--font-body);
}
