@font-face {
  font-family: 'HSBC Icons';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/font-icon/HSBCIcon-Font.eot?#iefix") format("embedded-opentype"), url("../fonts/font-icon/HSBCIcon-Font.woff") format("woff"), url("../fonts/font-icon/HSBCIcon-Font.ttf") format("truetype"), url("../fonts/font-icon/HSBCIcon-Font.svg#HSBC Icons") format("svg"); }
[class^='icon-'],
[class*=' icon-'] {
  font-family: 'HSBC Icons' !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

i.lnk__icon {
  display: inline-block;
  position: relative; }

.icon {
  color: #333;
  font-size: 2rem; }

.icon--centered {
  vertical-align: -0.3rem; }

.icon--centered.icon__big {
  vertical-align: -0.7rem; }

.icon--small {
  font-size: 1.8rem;
  margin-right: 0.2rem; }

.icon--big {
  font-size: 2.6rem; }

.icon__link--centered {
  vertical-align: -17%; }

.icon-accounts:before {
  content: '\f021'; }

.icon-agree:before {
  content: '\f00a'; }

.icon-alert:before {
  content: '\f017'; }

.icon-anchor-down:before {
  content: '\f075'; }

.icon-anchor-up:before {
  content: '\f07b'; }

.icon-articles:before {
  content: '\f01d'; }

.icon-assets:before {
  content: '\f042'; }

.icon-attachment:before {
  content: '\e060'; }

.icon-back:before {
  content: '\f062'; }

.icon-banking:before {
  content: '\f008'; }

.icon-barcode:before {
  content: '\f061'; }

.icon-bin:before {
  content: '\f065'; }

.icon-borrowing:before {
  content: '\f084'; }

.icon-calendar:before {
  content: '\f028'; }

.icon-chat:before {
  content: '\f016'; }

.icon-chevron-double-left:before {
  content: '\e000'; }

.icon-chevron-double-right:before {
  content: '\e002'; }

.icon-chevron-down-small:before {
  content: '\e003'; }

.icon-chevron-down:before {
  content: '\f055'; }

.icon-chevron-left-small:before {
  content: '\e004'; }

.icon-chevron-left:before {
  content: '\f058'; }

.icon-chevron-right-small:before {
  content: '\e005'; }

.icon-chevron-right:before {
  content: '\f057'; }

.icon-chevron-up-small:before {
  content: '\e006'; }

.icon-chevron-up:before {
  content: '\f056'; }

.icon-circle-confirmation-solid:before {
  content: '\e008'; }

.icon-circle-confirmation:before {
  content: '\f054'; }

.icon-circle-delete-solid:before {
  content: '\e007'; }

.icon-circle-delete:before {
  content: '\f067'; }

.icon-circle-error-solid:before {
  content: '\e009'; }

.icon-circle-error:before {
  content: '\f052'; }

.icon-circle-fill-information:before {
  content: '\f073'; }

.icon-circle-help-solid:before {
  content: '\e010'; }

.icon-circle-help:before {
  content: '\f060'; }

.icon-circle-info:before {
  content: '\f053'; }

.icon-client-download:before {
  content: '\f04e'; }

.icon-clock:before {
  content: '\f029'; }

.icon-collapse:before {
  content: '\e011'; }

.icon-column-view:before {
  content: '\e012'; }

.icon-complaints:before {
  content: '\e013'; }

.icon-compose:before {
  content: '\e061'; }

.icon-confidential:before {
  content: '\f050'; }

.icon-contactless-payments-outline:before {
  content: '\e015'; }

.icon-contactless-payments:before {
  content: '\e014'; }

.icon-copy:before {
  content: '\e016'; }

.icon-corporate:before {
  content: '\f083'; }

.icon-dashboard:before {
  content: '\f044'; }

.icon-delete-small:before {
  content: '\e017'; }

.icon-desktop-computer:before {
  content: '\e018'; }

.icon-devices:before {
  content: '\f033'; }

.icon-dial:before {
  content: '\e019'; }

.icon-do-not-view:before {
  content: '\e020'; }

.icon-document:before {
  content: '\e021'; }

.icon-dollar-bill:before {
  content: '\e022'; }

.icon-download:before {
  content: '\f000'; }

.icon-edit:before {
  content: '\f001'; }

.icon-education:before {
  content: '\f03e'; }

.icon-error:before {
  content: '\f01a'; }

.icon-expand:before {
  content: '\f025'; }

.icon-export:before {
  content: '\e024'; }

.icon-facebook-solid:before {
  content: '\e025'; }

.icon-facebook:before {
  content: '\e026'; }

.icon-fast-track:before {
  content: '\f018'; }

.icon-favourite:before {
  content: '\f013'; }

.icon-filter:before {
  content: '\e027'; }

.icon-food-dining:before {
  content: '\f081'; }

.icon-global:before {
  content: '\f037'; }

.icon-googleplus-solid:before {
  content: '\e028'; }

.icon-googleplus:before {
  content: '\e029'; }

.icon-grid-view:before {
  content: '\e030'; }

.icon-health:before {
  content: '\f079'; }

.icon-help:before {
  content: '\f012'; }

.icon-home:before {
  content: '\f011'; }

.icon-in-branch:before {
  content: '\f03a'; }

.icon-insight:before {
  content: '\f038'; }

.icon-insurance:before {
  content: '\f02b'; }

.icon-intranet:before {
  content: '\e031'; }

.icon-investment:before {
  content: '\f024'; }

.icon-link:before {
  content: '\e032'; }

.icon-linkedin-solid:before {
  content: '\e033'; }

.icon-linkedin:before {
  content: '\e034'; }

.icon-list:before {
  content: '\f030'; }

.icon-location:before {
  content: '\f019'; }

.icon-market:before {
  content: '\f02e'; }

.icon-memo:before {
  content: '\e035'; }

.icon-menu:before {
  content: '\f00b'; }

.icon-message:before {
  content: '\f006'; }

.icon-microphone:before {
  content: '\e036'; }

.icon-minimize:before {
  content: '\f07c'; }

.icon-mobile:before {
  content: '\f032'; }

.icon-more-vertical:before {
  content: '\e037'; }

.icon-more:before {
  content: '\f070'; }

.icon-multiple-accounts:before {
  content: '\e038'; }

.icon-multiple-users:before {
  content: '\f043'; }

.icon-newspaper:before {
  content: '\f051'; }

.icon-pay:before {
  content: '\f009'; }

.icon-pdf:before {
  content: '\e062'; }

.icon-phone:before {
  content: '\f005'; }

.icon-pie-chart:before {
  content: '\f039'; }

.icon-pin:before {
  content: '\f045'; }

.icon-play:before {
  content: '\e040'; }

.icon-pop-up-window:before {
  content: '\e041'; }

.icon-portfolio:before {
  content: '\f03c'; }

.icon-presentation:before {
  content: '\f03b'; }

.icon-print:before {
  content: '\f004'; }

.icon-products-services:before {
  content: '\f027'; }

.icon-quote-close:before {
  content: '\e042'; }

.icon-quote-open:before {
  content: '\e043'; }

.icon-rates:before {
  content: '\f02f'; }

.icon-refresh:before {
  content: '\f010'; }

.icon-renew:before {
  content: '\e044'; }

.icon-reply:before {
  content: '\f034'; }

.icon-report:before {
  content: '\f041'; }

.icon-rewards:before {
  content: '\f026'; }

.icon-save:before {
  content: '\f04b'; }

.icon-savings-goals:before {
  content: '\e045'; }

.icon-savings:before {
  content: '\e046'; }

.icon-script:before {
  content: '\e047'; }

.icon-secure-key-passcode:before {
  content: '\e048'; }

.icon-security-lock:before {
  content: '\f02a'; }

.icon-settings:before {
  content: '\f02d'; }

.icon-share:before {
  content: '\f022'; }

.icon-shopping-cart:before {
  content: '\f082'; }

.icon-shortcuts:before {
  content: '\e049'; }

.icon-signature:before {
  content: '\e050'; }

.icon-sound:before {
  content: '\e051'; }

.icon-stock-down:before {
  content: '\f072'; }

.icon-stock-up:before {
  content: '\f071'; }

.icon-survey:before {
  content: '\f04c'; }

.icon-switch:before {
  content: '\f00e'; }

.icon-tablet:before {
  content: '\f064'; }

.icon-tasks:before {
  content: '\f047'; }

.icon-tools:before {
  content: '\f01e'; }

.icon-transfers:before {
  content: '\f00d'; }

.icon-travel:before {
  content: '\f078'; }

.icon-twitter-solid:before {
  content: '\e052'; }

.icon-twitter:before {
  content: '\e053'; }

.icon-user:before {
  content: '\f01c'; }

.icon-video:before {
  content: '\f015'; }

.icon-view-all:before {
  content: '\f00c'; }

.icon-view:before {
  content: '\e063'; }

.icon-vimeo-solid:before {
  content: '\e054'; }

.icon-vimeo:before {
  content: '\e055'; }

.icon-weibo-solid:before {
  content: '\e056'; }

.icon-weibo:before {
  content: '\e057'; }

.icon-youtube-solid:before {
  content: '\e058'; }

.icon-youtube:before {
  content: '\e059'; }

@font-face {
  font-family: "UniversNextforHSBC";
  src: url("../fonts/UniversNextforHSBC-Regular.eot");
  src: url("../fonts/UniversNextforHSBC-Regular.eot#iefix") format("embedded-opentype"), url("../fonts/UniversNextforHSBC-Regular.ttf") format("truetype"), url("../fonts/UniversNextforHSBC-Regular.woff") format("woff"), url("../fonts/UniversNextforHSBC-Regular.svg") format("svg");
  font-weight: normal; }
@font-face {
  font-family: "UniversNextforHSBC";
  src: url("../fonts/UniversNextforHSBC-Bold.eot");
  src: url("../fonts/UniversNextforHSBC-Bold.eot#iefix") format("embedded-opentype"), url("../fonts/UniversNextforHSBC-Bold.ttf") format("truetype"), url("../fonts/UniversNextforHSBC-Bold.woff") format("woff"), url("../fonts/UniversNextforHSBC-Bold.svg") format("svg");
  font-weight: 600; }
@font-face {
  font-family: "UniversNextforHSBC";
  src: url("../fonts/UniversNextforHSBC-Light.eot");
  src: url("../fonts/UniversNextforHSBC-Light.eot#iefix") format("embedded-opentype"), url("../fonts/UniversNextforHSBC-Light.ttf") format("truetype"), url("../fonts/UniversNextforHSBC-Light.woff") format("woff"), url("../fonts/UniversNextforHSBC-Light.svg") format("svg");
  font-weight: 200; }
@font-face {
  font-family: "UniversNextforHSBC";
  src: url("../fonts/UniversNextforHSBC-Medium.eot");
  src: url("../fonts/UniversNextforHSBC-Medium.eot#iefix") format("embedded-opentype"), url("../fonts/UniversNextforHSBC-Medium.ttf") format("truetype"), url("../fonts/UniversNextforHSBC-Medium.woff") format("woff"), url("../fonts/UniversNextforHSBC-Medium.svg") format("svg");
  font-weight: 500; }
@font-face {
  font-family: "UniversNextforHSBC";
  src: url("../fonts/UniversNextforHSBC-Thin.eot");
  src: url("../fonts/UniversNextforHSBC-Thin.eot#iefix") format("embedded-opentype"), url("../fonts/UniversNextforHSBC-Thin.ttf") format("truetype"), url("../fonts/UniversNextforHSBC-Thin.woff") format("woff"), url("../fonts/UniversNextforHSBC-Thin.svg") format("svg");
  font-weight: 100; }
@media screen and (max-width: 479px) {
  .hide--xs {
    display: none; } }

@media screen and (max-width: 991px) {
  .hide--md {
    display: none; } }

@media screen and (max-width: 767px) {
  .hide--sm {
    display: none; } }

.show--sm {
  display: none; }
  @media screen and (max-width: 767px) {
    .show--sm {
      display: block; } }

.btn {
  border-radius: 0;
  text-decoration: none !important;
  padding: 16px 20px;
  font-size: inherit;
  line-height: 1;
  border: 0;
  width: 100%;
  min-width: 190px;
  white-space: normal; }
  @media screen and (min-width: 480px) {
    .btn {
      width: auto; } }
  .btn.btn-primary {
    background-color: #db0011;
    color: #fff; }
    .btn.btn-primary:hover, .btn.btn-primary:focus {
      background-color: #af000d; }
  .btn.btn-secondary {
    background-color: #fff;
    border: 1px solid #333;
    color: #333; }
    .btn.btn-secondary:hover, .btn.btn-secondary:focus {
      background-color: #d9d9d9; }
  .btn.btn-float {
    border: 2px solid #db0011;
    border-radius: 30px;
    min-width: auto;
    max-width: 110px; }

.link {
  color: #333333; }
  .link:hover, .link:focus {
    color: #333333; }
  .link--underline {
    text-decoration: underline; }

.heading-bar {
  display: flex;
  gap: 16px; }
  @media screen and (min-width: 768px) {
    .heading-bar {
      gap: 25px; } }
  .heading-bar::before {
    content: '';
    display: block;
    width: 5px;
    background-color: #db0011; }

ul {
  list-style-type: none;
  margin: 0; }
  ul.ul--dots {
    margin-left: 20px;
    list-style-type: disc; }
    ul.ul--dots li {
      margin-top: 10px; }
    ul.ul--dots li:nth-child(1) {
      margin-top: 0; }
  ul.ul--icons {
    display: flex;
    flex-direction: column;
    gap: 10px; }
  ul.ul--ticks {
    display: flex;
    flex-direction: column;
    gap: 5px; }

.icon-with-text {
  display: flex;
  justify-content: flex-start;
  align-items: center; }
  .icon-with-text.align-top {
    align-items: flex-start; }
  .icon-with-text .icon--pictogram {
    width: 48px;
    height: 48px;
    margin-right: 20px;
    transform: translateY(-5px); }
  .icon-with-text .icon--tick {
    width: 22px;
    height: 16px;
    margin-right: 16px; }
  .icon-with-text p {
    flex-grow: 1;
    margin: 0; }

* {
  border: 0;
  padding: 0;
  margin: 0;
  font-family: "UniversNextforHSBC", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  line-height: normal;
  scroll-behavior: smooth; }

body {
  font-size: 16px;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-variant-ligatures: none;
  font-variant-ligatures: none;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased; }

main {
  padding-top: 76px; }

h1, h2, h3 {
  margin: 0; }

.page-width {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto; }

.bg--gray {
  background-color: #f3f3f3; }

/* HEADER */
.header {
  background-color: #fff;
  font-size: 16px;
  width: 100%;
  position: fixed;
  top: 0;
  transition: top 0.3s ease-in-out;
  z-index: 9999; }
  .header__outer {
    position: relative;
    z-index: 999;
    box-shadow: 0px 10px 10px -10px #000;
    top: 0; }
  .header__wrapper {
    margin: 0 auto;
    padding: 22px 0;
    height: 75px; }
  .header__logo {
    float: left; }
  .header__logo img {
    height: 30px; }

/* FOOTER */
.footer-container {
  background: #000; }

.footer-primary {
  font-size: 1.4rem;
  color: #FFFFFF;
  max-width: 1280px;
  margin: 0 auto;
  padding: 15px 15px; }
  @media (min-width: 768px) {
    .footer-primary {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: flex-start;
      gap: 15px; } }
  .footer-primary a {
    color: #FFFFFF; }
    .footer-primary a:hover {
      text-decoration: underline; }
  .footer-primary p {
    margin-bottom: 10px; }
  .footer-primary ul.footer-links {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    list-style-type: none;
    margin-left: 0; }
    @media (min-width: 768px) {
      .footer-primary ul.footer-links {
        justify-content: flex-start; } }
  .footer-primary ul.footer-links li {
    margin-right: 15px;
    margin-bottom: 10px; }
  .footer-primary .footer-copyright {
    margin-top: 10px;
    text-align: center; }
    @media (min-width: 768px) {
      .footer-primary .footer-copyright {
        margin-top: 0;
        text-align: right; } }

/* BANNER */
.banner--bg {
  background-color: #f3f3f3; }
.banner--wrapper {
  display: flex;
  flex-direction: column-reverse;
  justify-items: flex-start;
  align-items: stretch; }
  @media screen and (min-width: 768px) {
    .banner--wrapper {
      flex-direction: row; } }
@media screen and (min-width: 768px) {
  .banner--left, .banner--right {
    width: 50%; } }
.banner--left {
  padding: 0 15px; }
  @media screen and (min-width: 768px) {
    .banner--left {
      padding: 0;
      display: flex;
      align-items: center; } }
@media screen and (min-width: 768px) {
  .banner--box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-color: #f3f3f3;
    height: 100%;
    flex-grow: 1; } }
@media screen and (min-width: 768px) {
  .banner--text {
    margin: 0 30px;
    max-width: 485px;
    padding: 0 15px; } }
.banner--text h1 {
  margin-top: 30px;
  font-size: 3rem;
  font-weight: 200; }
.banner--text p {
  margin-top: 20px;
  line-height: 1.3;
  font-size: 1.8rem; }
.banner--text button {
  margin: 20px 0 30px; }
@media screen and (min-width: 768px) {
  .banner--image {
    height: 100%; } }
.banner--image img {
  width: 100%; }
  @media screen and (min-width: 768px) {
    .banner--image img {
      object-fit: cover;
      height: 100%; } }

/* OFFERS */
.offers {
  padding: 50px 0; }
  @media screen and (min-width: 768px) {
    .offers {
      padding: 70px 0; } }
  .offers-heading {
    margin-bottom: 25px; }
  .offers .offers-slider {
    position: relative; }
    .offers .offers-slider:hover .slick-prev, .offers .offers-slider:focus .slick-prev, .offers .offers-slider:hover .slick-next, .offers .offers-slider:focus .slick-next {
      opacity: 1; }
    .offers .offers-slider .slick-prev,
    .offers .offers-slider .slick-next {
      position: absolute;
      top: 30%;
      transform: translate(0, -50%);
      z-index: 99;
      background-color: rgba(0, 0, 0, 0.8);
      padding: 50px 10px;
      opacity: 0; }
      @media screen and (min-width: 768px) {
        .offers .offers-slider .slick-prev,
        .offers .offers-slider .slick-next {
          top: 50%;
          background-color: #000000; } }
      @media screen and (min-width: 1340px) {
        .offers .offers-slider .slick-prev,
        .offers .offers-slider .slick-next {
          opacity: 1; } }
      .offers .offers-slider .slick-prev .icon,
      .offers .offers-slider .slick-next .icon {
        color: #ffffff; }
    .offers .offers-slider .slick-prev {
      left: 1px; }
      @media screen and (min-width: 1340px) {
        .offers .offers-slider .slick-prev {
          transform: translate(-100%, -50%); } }
    .offers .offers-slider .slick-next {
      right: 0; }
      @media screen and (min-width: 1340px) {
        .offers .offers-slider .slick-next {
          transform: translate(100%, -50%); } }
    .offers .offers-slider .slick-dots {
      list-style-type: none;
      display: flex;
      justify-content: center;
      gap: 10px;
      margin-top: 5px; }
      .offers .offers-slider .slick-dots li button {
        font-size: 0;
        line-height: 0;
        color: transparent;
        background: transparent; }
      .offers .offers-slider .slick-dots li button::before {
        display: block;
        content: '';
        width: 40px;
        height: 4px;
        background-color: #000000; }
      .offers .offers-slider .slick-dots li.slick-active button::before {
        background-color: #db0011; }
      .offers .offers-slider .slick-dots li button:hover::before {
        cursor: pointer; }
  .offers .offer-box {
    border: 2px solid #f3f3f3; }
    @media screen and (min-width: 768px) {
      .offers .offer-box {
        display: flex;
        justify-content: flex-start; } }
  .offers .offer-image {
    padding: 16px; }
    @media screen and (min-width: 768px) {
      .offers .offer-image {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        width: 100%;
        max-width: 50%;
        text-align: center;
        padding: 25px 0; } }
    @media screen and (min-width: 992px) {
      .offers .offer-image {
        max-width: 50%; } }
    .offers .offer-image .card--horizontal {
      width: 100%;
      max-width: 310px; }
      @media screen and (min-width: 768px) {
        .offers .offer-image .card--horizontal {
          max-width: 287px; } }
      @media screen and (min-width: 992px) {
        .offers .offer-image .card--horizontal {
          max-width: 400px; } }
    .offers .offer-image .card--vertical {
      width: 100%;
      max-width: 195px; }
      @media screen and (min-width: 768px) {
        .offers .offer-image .card--vertical {
          max-width: 181px; } }
      @media screen and (min-width: 992px) {
        .offers .offer-image .card--vertical {
          max-width: 252px; } }
  .offers .offer-body {
    padding: 16px 16px 16px; }
    @media screen and (min-width: 768px) {
      .offers .offer-body {
        padding: 25px 16px;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        align-items: stretch; } }
  @media screen and (min-width: 768px) {
    .offers .offer-text-wrapper {
      flex-grow: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }
  .offers .offer-heading {
    font-weight: 700;
    font-size: 2.8rem; }
  .offers .offer-heading,
  .offers .offer-description,
  .offers .offer-period,
  .offers .offer-tnc {
    margin-bottom: 20px; }
  .offers ul.list {
    margin: 0;
    list-style-type: none;
    display: flex;
    flex-direction: column;
    gap: 15px; }
  .offers ul.list li {
    display: flex; }
    .offers ul.list li p {
      flex-grow: 1;
      margin: 0; }
    .offers ul.list li .icon--feature {
      width: 48px;
      height: 48px;
      margin-right: 20px; }
    .offers ul.list li .icon--tick {
      width: 22px;
      height: 16px;
      margin-right: 15px; }
  .offers-feature-list {
    margin-top: 40px; }
    @media screen and (min-width: 768px) {
      .offers-feature-list {
        margin-top: 0; } }
  .offers li.feature-item {
    justify-content: flex-start;
    align-items: flex-start; }
    @media screen and (min-width: 768px) {
      .offers li.feature-item {
        align-items: center; } }
    .offers li.feature-item p {
      font-size: 2rem;
      font-weight: 200; }
      @media screen and (min-width: 768px) {
        .offers li.feature-item p {
          font-size: 2rem; } }
  .offers-requirement-list {
    background-color: #e8e8e8;
    margin-top: 20px;
    padding: 15px; }
    .offers-requirement-list ul {
      gap: 5px; }
  .offers .offer-tnc {
    display: flex;
    justify-content: flex-start;
    gap: 5px;
    align-items: flex-end; }
    .offers .offer-tnc .icon {
      color: #db0011; }
  .offers .offer-cta {
    margin-top: 30px;
    text-align: right; }

/* INFO */
.info {
  padding: 50px 0; }
  @media screen and (min-width: 768px) {
    .info {
      padding: 70px 0; } }
  .info p, .info li {
    font-size: 1.4rem; }
  .info ol {
    margin: 0;
    margin-left: 16px; }
  .info p, .info li {
    margin-top: 16px; }