body {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  line-height: 1;
}

main {
  /* CSS Reset */
}
  main html, main body, main div, main span, main applet, main object, main iframe,
  main h1, main h2, main h3, main h4, main h5, main h6, main p, main blockquote, main pre,
  main a, main abbr, main acronym, main address, main big, main cite, main code,
  main del, main dfn, main em, main img, main ins, main kbd, main q, main s, main samp,
  main small, main strike, main strong, main sub, main sup, main tt, main var,
  main b, main u, main i, main center,
  main dl, main dt, main dd, main ol, main ul, main li,
  main fieldset, main form, main label, main legend,
  main table, main caption, main tbody, main tfoot, main thead, main tr, main th, main td,
  main article, main aside, main canvas, main details, main embed,
  main figure, main figcaption, main footer, main header, main hgroup,
  main menu, main nav, main output, main ruby, main section, main summary,
  main time, main mark, main audio, main video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
  }
  main article, main aside, main details, main figcaption, main figure,
  main footer, main header, main hgroup, main menu, main nav, main section {
    display: block;
  }
  main body { line-height: 1; }
  main ol, main ul { list-style: none; }
  main blockquote, main q { quotes: none; }
  main blockquote:before, main blockquote:after,
  main q:before, main q:after { content: ''; content: none; }
  main table { border-collapse: collapse; border-spacing: 0; }
  main * { box-sizing: border-box; }

/* FONTS */
@font-face {
  font-family: "IBMPlexSans";
  src: url("fonts/IBMPlexSans-Regular-V01.1.woff2") format("woff2"),
       url("fonts/IBMPlexSans-Regular-V01.1.woff") format("woff");
}
@font-face {
  font-family: "IBMPlexSans-Medium";
  src: url("fonts/IBMPlexSans-Medium-V01.1.woff2") format("woff2"),
       url("fonts/IBMPlexSans-Medium-V01.1.woff") format("woff");
}
@font-face {
  font-family: "IBMPlexSans-Bold";
  src: url("fonts/IBMPlexSans-Bold-V01.1.woff2") format("woff2"),
       url("fonts/IBMPlexSans-Bold-V01.1.woff") format("woff");
}

strong { font-weight: bold; }

#ibm-content-wrapper > header { display: none; }
#ibm-content-body { padding-top: 0; }

/* HEADER NAV & SECTION SHARED PADDING */
#hsm--header-links,
.hsm--section {
  padding-left: 36px;
  padding-right: 36px;
}
  #hsm--header-links ul li + li,
  .hsm--section ul li + li { padding-top: 0; }
  #hsm--header-links ul > li,
  .hsm--section ul > li { padding-left: 0; }
  #hsm--header-links ul > li::before,
  .hsm--section ul > li::before {
    content: '';
    margin-left: 0;
    position: static;
    display: none;
  }

/* APP STORE LINKS */
.hsm--app-links {
  display: flex;
  overflow: hidden;
  min-height: 40px;
  max-width: 320px;
  flex-wrap: wrap;
}
  .hsm--app-links:hover { cursor: pointer; }
  .hsm--app-links a {
    width: 135px !important;
    height: 40px !important;
    background-size: auto !important;
    margin: 0 10px 25px 0 !important;
  }
    .hsm--app-links a img {
      margin: -10px 0 0 -9px !important;
      height: 60px !important;
    }

/* ANIMATIONS */
@keyframes slideFadeLeft {
  0%   { left: 50px; opacity: 0; }
  25%  { left: 50px; opacity: 0; }
  100% { left: 0;    opacity: 1; }
}
@keyframes slideFadeRight {
  0%   { right: 50px; opacity: 0; }
  25%  { right: 50px; opacity: 0; }
  100% { right: 0;    opacity: 1; }
}
@keyframes slideFadeUp {
  0%   { top: 50px; opacity: 0; }
  25%  { top: 50px; opacity: 0; }
  100% { top: 0;    opacity: 1; }
}
@keyframes fadeIn {
  0%   { opacity: 0; }
  25%  { opacity: 0; }
  100% { opacity: 1; }
}

/* HEADER NAV */
#hsm--header-links {
  font-family: "IBMPlexSans";
  font-size: 14px;
  position: absolute;
  width: 100%;
  margin-top: 30px;
  z-index: 1;
}
  #hsm--header-links ul {
    display: flex;
    justify-content: flex-end;
  }
  #hsm--header-links li {
    letter-spacing: 1.05px;
    line-height: 18px;
  }
    #hsm--header-links li:first-child {
      margin-right: auto;
      letter-spacing: .9px;
      font-family: "IBMPlexSans-Bold";
    }
      #hsm--header-links li:first-child span {
        font-family: "IBMPlexSans";
      }
    #hsm--header-links li:nth-child(2) { margin-right: 36px; }
    #hsm--header-links li:nth-child(3) { margin-right: 36px; }
    #hsm--header-links li:nth-child(4) { margin-right: 36px; }
  #hsm--header-links a {
    color: #FFFFFF;
    text-decoration: none;
  }
  @media (min-width: 600px) {
    #hsm--header-links {
      padding: 0 60px;
      font-size: 18px;
    }
      #hsm--header-links li {
        letter-spacing: 1.16px;
        line-height: 23px;
      }
  }

/* SECTIONS BASE */
.hsm--section {
  font-family: "IBMPlexSans";
  font-size: 18px;
  letter-spacing: .9px;
  line-height: 26px;
  color: #4A4A4A;
  text-align: center;
  padding-top: 78px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
  .hsm--section h1 {
    font-family: "IBMPlexSans-Medium";
    font-size: 30px;
    letter-spacing: .75px;
    line-height: 39px;
    margin-bottom: 24px;
  }
  .hsm--section p + p { margin-top: 26px; }
  .hsm--section img { margin-top: 60px; }
  .hsm--section a { text-decoration: none; }

/* HERO / WELCOME SECTION */
#hsm--section-welcome {
  background-image: linear-gradient(80deg, #001ABB 0%, #0043FF 99%);
  color: #FFFFFF;
  text-align: left;
  padding: 102px 40px 80px;
  position: relative;
  min-height: 420px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 40px;
}
  #hsm--section-welcome > div { flex: 0 0 auto; }
  #hsm--section-welcome > img#hsm--img-welcome {
    height: auto;
    max-height: 280px;
    width: auto;
    margin-top: 0;
    flex: 0 0 auto;
    z-index: 2;
    position: relative;
    opacity: 0;
  }
  #hsm--section-welcome > img#hsm--img-welcome.in-view {
    animation: slideFadeLeft 1.5s ease-in-out 1;
    opacity: 1;
  }
  #hsm--section-welcome::after {
    content: '';
    display: block;
    width: 150%;
    background: #ffffff;
    height: 400px;
    position: absolute;
    left: 0;
    bottom: -186px;
    transform: skewY(-15deg);
    z-index: 1;
  }
  #hsm--section-welcome > div { max-width: 540px; flex: 0 1 540px; }
  #hsm--section-welcome h1 {
    font-size: 36px;
    letter-spacing: .9px;
    line-height: 47px;
    margin-bottom: 20px;
  }
  #hsm--section-welcome p {
    letter-spacing: .75px;
    line-height: 24px;
    margin-bottom: 30px;
  }
  #hsm--section-welcome .hsm--app-links { margin-bottom: 38px; }
  @media (min-width: 1025px) {
    #hsm--section-welcome {
      padding-top: 170px;
    }
      #hsm--section-welcome > img#hsm--img-welcome {
        max-height: 380px;
      }
      #hsm--section-welcome::after {
        bottom: -252px;
        transform: skewY(-9deg);
      }
      #hsm--section-welcome h1 {
        font-size: 42px;
        letter-spacing: 1px;
        line-height: 55px;
        margin-bottom: 30px;
      }
      #hsm--section-welcome p {
        font-size: 20px;
        letter-spacing: .9px;
        line-height: 30px;
      }
  }
  @media (min-width: 1240px) { #hsm--section-welcome::after { transform: skewY(-7deg); } }

/* SELLING POINTS */
#hsm--section-selling-points p {
  font-size: 24px;
  letter-spacing: .6px;
  line-height: 32px;
  margin-bottom: 60px;
}
#hsm--section-selling-points ul {
  display: flex;
  flex-direction: column;
}
#hsm--section-selling-points li + li { margin-top: 54px; }
#hsm--section-selling-points li h1 {
  margin: 0 0 18px;
  font-size: 18px;
  letter-spacing: .9px;
  line-height: 23px;
}
  #hsm--section-selling-points li h1::before {
    content: '';
    background-color: #0043FF;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 36px;
    border-radius: 50%;
    width: 64px;
    height: 64px;
    display: block;
    margin: 0 auto 18px;
  }
  #hsm--section-selling-points li:nth-child(1) h1::before {
    background-image: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E %3Cdefs%3E %3Cstyle%3E .cls-1 { fill: none; } %3C/style%3E %3C/defs%3E %3Cpath d='M24,10h4c1.1046,0,2-.8954,2-2V4c0-1.1046-.8954-2-2-2h-4c-1.1046,0-2,.8954-2,2v1h-3c-1.1046,0-2,.8954-2,2V15h-3V5c0-1.1046-.8954-2-2-2H4c-1.1046,0-2,.8954-2,2V27c0,1.1046,.8954,2,2,2H12c1.1046,0,2-.8954,2-2v-10h3v8c0,1.1046,.8954,2,2,2h3v1c0,1.1046,.8954,2,2,2h4c1.1046,0,2-.8954,2-2v-4c0-1.1046-.8954-2-2-2h-4c-1.1046,0-2,.8954-2,2v1h-3v-8h3v1c0,1.1046,.8954,2,2,2h4c1.1046,0,2-.8954,2-2v-4c0-1.1046-.8954-2-2-2h-4c-1.1046,0-2,.8954-2,2v1h-3V7h3v1c0,1.1046,.8954,2,2,2Zm0-6h4v4s-4,0-4,0V4ZM11.3992,12l-7.3992,5.9194V6.0806l7.3992,5.9194Zm.6013,2.0801l.0007,11.8403-7.4004-5.9204,7.3997-5.9199Zm-.0002-4.1606L5.8508,5h6.1492l.0002,4.9194ZM4,22.0806l6.1492,4.9194H4v-4.9194Zm20,1.9194h4v4h-4v-4Zm0-10h4v4h-4v-4Z'/%3E %3Crect id='_Transparent_Rectangle_' data-name='%26amp%3Blt%3BTransparent Rectangle%26amp%3Bgt%3B' class='cls-1' width='32' height='32'/%3E %3C/svg%3E");
  }
  #hsm--section-selling-points li:nth-child(2) h1::before {
    background-image: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E %3Cdefs%3E %3Cstyle%3E .cls-1 { fill: none; } %3C/style%3E %3C/defs%3E %3Cpolygon points='14 16.59 11.41 14 10 15.41 14 19.41 22 11.41 20.59 10 14 16.59'/%3E %3Cpath d='M16,30,9.8242,26.7071A10.9818,10.9818,0,0,1,4,17V4A2.0021,2.0021,0,0,1,6,2H26a2.0021,2.0021,0,0,1,2,2V17a10.9818,10.9818,0,0,1-5.8242,9.7071ZM6,4V17a8.9852,8.9852,0,0,0,4.7656,7.9423L16,27.7333l5.2344-2.791A8.9852,8.9852,0,0,0,26,17V4Z'/%3E %3Crect id='_Transparent_Rectangle_' data-name='<Transparent Rectangle>' class='cls-1' width='32' height='32'/%3E %3C/svg%3E");
  }
  #hsm--section-selling-points li:nth-child(3) h1::before {
    background-image: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cdefs%3E%3Cstyle%3E.cls-1{fill:none;}%3C/style%3E%3C/defs%3E%3Crect x='6.34' y='19' width='11.31' height='2' transform='translate(-10.63 14.34) rotate(-45)'/%3E%3Cpath d='M17,30a1,1,0,0,1-.37-.07,1,1,0,0,1-.62-.79l-1-7,2-.28.75,5.27L21,24.52V17a1,1,0,0,1,.29-.71l4.07-4.07A8.94,8.94,0,0,0,28,5.86V4H26.14a8.94,8.94,0,0,0-6.36,2.64l-4.07,4.07A1,1,0,0,1,15,11H7.48L4.87,14.26l5.27.75-.28,2-7-1a1,1,0,0,1-.79-.62,1,1,0,0,1,.15-1l4-5A1,1,0,0,1,7,9h7.59l3.77-3.78A10.92,10.92,0,0,1,26.14,2H28a2,2,0,0,1,2,2V5.86a10.92,10.92,0,0,1-3.22,7.78L23,17.41V25a1,1,0,0,1-.38.78l-5,4A1,1,0,0,1,17,30Z'/%3E%3Crect id='_Transparent_Rectangle_' data-name='%26lt%3BTransparent Rectangle%26gt%3B' class='cls-1' width='32' height='32'/%3E%3C/svg%3E");
  }
#hsm--section-selling-points li:last-child { margin-bottom: 60px; }
#hsm--section-selling-points li p {
  margin: 0;
  font-size: 18px;
  letter-spacing: 1px;
  line-height: 26px;
}
@media (min-width: 1144px) {
  #hsm--section-selling-points > p {
    position: relative;
    opacity: 0;
  }
    #hsm--section-selling-points > p.in-view {
      animation: slideFadeUp 1.5s ease-in-out 1;
      opacity: 1;
    }
  #hsm--section-selling-points p {
    font-size: 32px;
    letter-spacing: .9px;
    line-height: 46px;
    margin-bottom: 86px;
    max-width: 900px;
  }
  #hsm--section-selling-points ul { flex-direction: row; }
  #hsm--section-selling-points li {
    width: 272px;
    position: relative;
    opacity: 0;
  }
    #hsm--section-selling-points li + li {
      margin-top: 0;
      margin-left: 131px;
    }
    #hsm--section-selling-points li:last-child { margin-bottom: 96px; }
    #hsm--section-selling-points li.in-view {
      animation: slideFadeUp 1.5s ease-in-out 1;
      opacity: 1;
    }
}

/* CAPABILITIES SECTION */
#hsm--section-capabilities {
  background-color: #001ABB;
  color: #FFFFFF;
  padding-bottom: 78px;
}
  #hsm--section-capabilities > div {
    max-width: 540px;
    text-align: left;
    padding-bottom: 40px;
  }
  #hsm--img-capabilities {
    height: auto;
    max-height: 280px;
    width: auto;
    flex: 0 0 auto;
    margin-top: 0;
    order: -1;
  }
  @media (min-width: 975px) {
    #hsm--img-capabilities {
      max-height: 380px;
      order: 1;
    }
  }
  /* TABS */
  .tabs {
    width: 100%;
    max-width: 800px;
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .tabs input[type="radio"] {
    display: none;
  }
  .tabs label {
    display: inline-block;
    white-space: nowrap;
    font-family: "IBMPlexSans-Medium", sans-serif;
    font-size: 18px;
    line-height: 34px;
    padding-bottom: 4px;
    cursor: pointer;
    margin-right: 20px;
    border-bottom: 2px solid transparent;
    opacity: 0.7;
    transition: all 0.2s ease;
    flex: 0 0 auto;
  }
  .tabs label:hover {
    opacity: 1;
    cursor: pointer;
  }
  .tabs input:checked + label {
    opacity: 1;
    border-bottom: 2px solid #FFFFFF;
  }
  .tabs .tab {
    display: none;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    flex-basis: 100%;
    margin-top: 24px;
  }
  .tabs #tab-1:checked ~ .tab[data-id="tab-1"],
  .tabs #tab-2:checked ~ .tab[data-id="tab-2"],
  .tabs #tab-3:checked ~ .tab[data-id="tab-3"] {
    display: flex;
  }
  .tabs .tab p {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 20px;
    max-width: 600px;
  }
  .tabs .tab img {
    height: auto;
    max-height: 280px;
    width: auto;
    max-width: 100%;
    margin-top: 0;
    position: relative;
    opacity: 0;
  }
  .tabs .tab img.in-view {
    animation: slideFadeLeft 1.5s ease-in-out 1;
    opacity: 1;
  }

  .hsm--capabilities-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    max-width: 800px;
    margin-bottom: 40px;
  }
  .hsm--capabilities-list li {
    line-height: 42px;
    letter-spacing: .69px;
    display: flex;
    align-items: center;
    text-align: left;
    padding-left: 54px;
    position: relative;
  }
    .hsm--capabilities-list li + li { margin-top: 16px; }
    .hsm--capabilities-list li::before {
      content: '';
      display: block;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background-color: #5390FD;
      position: absolute;
      left: 18px;
      top: 13px;
    }
  @media (min-width: 975px) {
    #hsm--section-capabilities {
      flex-direction: row;
      align-items: flex-start;
      padding-top: 124px;
      justify-content: center;
      gap: 40px;
    }
      #hsm--section-capabilities > div {
        width: 329px;
        margin-top: 0;
        padding-bottom: 0;
      }
      #hsm--section-capabilities .tabs {
        flex: 1 1 auto;
        max-width: 580px;
        margin-top: 0;
      }
      #hsm--section-capabilities .tabs .tab img {
        max-height: 380px;
      }

      .tabs .tab img.in-view {
        animation: slideFadeLeft 1.5s ease-in-out 1;
        opacity: 1;
      }

      @media (min-width: 1200px) {
        #hsm--section-capabilities {
          gap: 80px;
        }
      }
      #hsm--section-capabilities h1 {
        font-size: 42px;
        letter-spacing: 1px;
        line-height: 55px;
        margin-bottom: 30px;
      }
    .hsm--capabilities-list {
      height: 260px;
      flex-wrap: wrap;
      max-width: 540px;
    }
    .hsm--capabilities-list li {
      font-size: 20px;
      position: relative;
      opacity: 0;
    }
      .hsm--capabilities-list li.in-view {
        animation: slideFadeUp 1.5s ease-in-out 1;
        opacity: 1;
      }
  }

/* SMART CARD SECTION */
#hsm--section-smartcard {
  background-color: #0043FF;
  color: #FFFFFF;
  padding-bottom: 78px;
}
  #hsm--img-smartcard {
    height: auto;
    max-height: 280px;
    width: auto;
    flex: 0 0 auto;
    margin-top: 0;
    position: relative;
    opacity: 0;
  }
  #hsm--img-smartcard.in-view {
    animation: slideFadeRight 1.5s ease-in-out 1;
    opacity: 1;
  }
  #hsm--section-smartcard > div {
    max-width: 500px;
    text-align: left;
    position: relative;
    opacity: 0;
  }
  #hsm--section-smartcard > div.in-view {
    animation: slideFadeUp 1.5s ease-in-out 1;
    opacity: 1;
  }
  @media (min-width: 989px) {
    #hsm--section-smartcard {
      flex-direction: row;
      align-items: center;
      justify-content: center;
      gap: 60px;
      padding-top: 124px;
    }
    #hsm--img-smartcard {
      max-height: 380px;
      flex-shrink: 0;
    }
    #hsm--section-smartcard h1 {
      font-size: 42px;
      letter-spacing: 1px;
      line-height: 55px;
      margin-bottom: 30px;
    }
  }

/* SECURITY SECTION */
#hsm--section-security {
  background-color: #5390FD;
  color: #FFFFFF;
  padding-bottom: 78px;
}
  #hsm--section-security h1 { margin-bottom: 50px; }
  #hsm--section-security ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 78px;
  }
  #hsm--section-security li {
    line-height: 42px;
    letter-spacing: .69px;
    display: flex;
    text-align: left;
    padding-left: 54px;
    position: relative;
  }
    #hsm--section-security li + li { margin-top: 30px; }
    #hsm--section-security li::before {
      content: '';
      display: block;
      width: 32px;
      height: 32px;
      background-size: 22px;
      background-repeat: no-repeat;
      background-position: center;
      background-color: #FFFFFF;
      border-radius: 50%;
      position: absolute;
      left: 8px;
      top: 5px;
    }
    #hsm--section-security li:nth-child(1)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cdefs%3E%3Cstyle%3E.cls-1{fill:none;}%3C/style%3E%3C/defs%3E%3Cpath d='M24,14H22V8A6,6,0,0,0,10,8v6H8a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H24a2,2,0,0,0,2-2V16A2,2,0,0,0,24,14ZM12,8a4,4,0,0,1,8,0v6H12ZM24,28H8V16H24Z'/%3E%3Crect class='cls-1' width='32' height='32'/%3E%3C/svg%3E");
    }
    #hsm--section-security li:nth-child(2)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cdefs%3E%3Cstyle%3E.cls-1{fill:none;}%3C/style%3E%3C/defs%3E%3Cpath d='M21,2a8.9977,8.9977,0,0,0-8.6119,11.6118L2,24v6H8L18.3881,19.6118A9,9,0,1,0,21,2Zm0,16a7.0125,7.0125,0,0,1-2.0322-.3022L17.821,17.35l-.8472.8472-3.1811,3.1812L12.4141,20,11,21.4141l1.3787,1.3786-1.5859,1.586L9.4141,23,8,24.4141l1.3787,1.3786L7.1716,28H4V24.8284l9.8023-9.8023.8472-.8474-.3473-1.1467A7,7,0,1,1,21,18Z'/%3E%3Ccircle cx='22' cy='10' r='2'/%3E%3Crect class='cls-1' width='32' height='32'/%3E%3C/svg%3E");
    }
    #hsm--section-security li:nth-child(3)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cdefs%3E%3Cstyle%3E.cls-1{fill:none;}%3C/style%3E%3C/defs%3E%3Cpolygon points='14 16.59 11.41 14 10 15.41 14 19.41 22 11.41 20.59 10 14 16.59'/%3E%3Cpath d='M16,30,9.8242,26.7071A10.9818,10.9818,0,0,1,4,17V4A2.0021,2.0021,0,0,1,6,2H26a2.0021,2.0021,0,0,1,2,2V17a10.9818,10.9818,0,0,1-5.8242,9.7071ZM6,4V17a8.9852,8.9852,0,0,0,4.7656,7.9423L16,27.7333l5.2344-2.791A8.9852,8.9852,0,0,0,26,17V4Z'/%3E%3Crect class='cls-1' width='32' height='32'/%3E%3C/svg%3E");
    }
    #hsm--section-security li:nth-child(4)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cdefs%3E%3Cstyle%3E.cls-1{fill:none;}%3C/style%3E%3C/defs%3E%3Cpolygon points='11 23.18 9 21.179 7.589 22.589 11 26 17 20 15.59 18.59 11 23.18'/%3E%3Cpath d='M28,30H24V28h4V16H24V8a4.0045,4.0045,0,0,0-4-4V2a6.0067,6.0067,0,0,1,6,6v6h2a2.0021,2.0021,0,0,1,2,2V28A2.0021,2.0021,0,0,1,28,30Z' transform='translate(0 0)'/%3E%3Cpath d='M20,14H18V8A6,6,0,0,0,6,8v6H4a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V16A2,2,0,0,0,20,14ZM8,8a4,4,0,0,1,8,0v6H8ZM20,28H4V16H20Z' transform='translate(0 0)'/%3E%3Crect class='cls-1' width='32' height='32'/%3E%3C/svg%3E");
    }
    #hsm--section-security li:nth-child(5)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E %3Cdefs%3E %3Cstyle%3E .cls-1 { fill: none; } .cls-1, .cls-2 { stroke-width: 0px; } %3C/style%3E %3C/defs%3E %3Cpath fill='%235390FD' d='m28,8v-3c0-2.2056-1.7944-4-4-4s-4,1.7944-4,4v3c-1.1028,0-2,.8975-2,2v6c0,1.1025.8972,2,2,2h8c1.1028,0,2-.8975,2-2v-6c0-1.1025-.8972-2-2-2Zm-6-3c0-1.1025.8972-2,2-2s2,.8975,2,2v3h-4v-3Zm-2,11v-6h8v6h-8Z'/%3E %3Cpath fill='%235390FD' d='m16,30h-2v-5c-.0018-1.6561-1.3439-2.9982-3-3h-4c-1.6561.0018-2.9982,1.3439-3,3v5h-2v-5c.0033-2.7601,2.2399-4.9967,5-5h4c2.7601.0033,4.9967,2.2399,5,5v5Z'/%3E %3Cpath fill='%235390FD' d='m9,10c1.6569,0,3,1.3431,3,3s-1.3431,3-3,3-3-1.3431-3-3,1.3431-3,3-3m0-2c-2.7614,0-5,2.2386-5,5s2.2386,5,5,5,5-2.2386,5-5-2.2386-5-5-5Z'/%3E %3Crect id='_Transparent_Rectangle_' data-name='<Transparent Rectangle>' class='cls-1' width='32' height='32'/%3E %3C/svg%3E");
    }
    #hsm--section-security li:nth-child(6)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E %3Cdefs%3E %3Cstyle%3E .cls-1 { fill: none; } %3C/style%3E %3C/defs%3E %3Cpath d='M16,22a6,6,0,1,1,6-6A5.9364,5.9364,0,0,1,16,22Zm0-10a3.9123,3.9123,0,0,0-4,4,3.9123,3.9123,0,0,0,4,4,3.9123,3.9123,0,0,0,4-4A3.9123,3.9123,0,0,0,16,12Z' transform='translate(0 0)'/%3E %3Cpath d='M29.3047,11.044,26.9441,6.9562a1.9977,1.9977,0,0,0-2.3728-.8946l-2.4341.8233a11.0419,11.0419,0,0,0-1.312-.7583L20.3215,3.608A2,2,0,0,0,18.36,2H13.64A2,2,0,0,0,11.6785,3.608l-.5037,2.5186A10.9666,10.9666,0,0,0,9.8481,6.88L7.4287,6.0616a1.9977,1.9977,0,0,0-2.3728.8946L2.6953,11.044a2.0006,2.0006,0,0,0,.4119,2.5025l1.9309,1.6968C5.021,15.4947,5,15.7447,5,16c0,.2578.01.5127.0278.7656l-1.9206,1.688a2.0006,2.0006,0,0,0-.4119,2.5025L5.0559,25.044a1.9977,1.9977,0,0,0,2.3728.8946l2.4341-.8233a10.9736,10.9736,0,0,0,1.312.7583l.5037,2.5186A2,2,0,0,0,13.64,30H18V28H13.64l-.71-3.5508a9.0953,9.0953,0,0,1-2.6948-1.5713L6.7878,24.044l-2.36-4.0878,2.7253-2.3951a8.9263,8.9263,0,0,1-.007-3.1279L4.4275,12.044,6.7886,7.9562l3.4267,1.1591a9.0305,9.0305,0,0,1,2.7141-1.5644L13.64,4H18.36l.71,3.5508a9.0978,9.0978,0,0,1,2.6948,1.5713l3.4468-1.166,2.36,4.0878-2.7978,2.4522L26.0923,16l2.8-2.4536A2.0006,2.0006,0,0,0,29.3047,11.044Z' transform='translate(0 0)'/%3E %3Cpolygon points='23 26.18 20.41 23.59 19 25 23 29 30 22 28.59 20.59 23 26.18'/%3E %3Crect id='_Transparent_Rectangle_' data-name='<Transparent Rectangle>' class='cls-1' width='32' height='32'/%3E %3C/svg%3E");
    }
    #hsm--section-security li:nth-child(7)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E %3Cdefs%3E %3Cstyle%3E .cls-1 { fill: none; } %3C/style%3E %3C/defs%3E %3Cpath d='M11,21H9V19a3.0033,3.0033,0,0,1,3-3h6v2H12a1.0011,1.0011,0,0,0-1,1Z' transform='translate(0 0)'/%3E %3Cpath d='M15,15a4,4,0,1,1,4-4A4.0045,4.0045,0,0,1,15,15Zm0-6a2,2,0,1,0,2,2A2.0021,2.0021,0,0,0,15,9Z' transform='translate(0 0)'/%3E %3Cpath d='M24,22a4,4,0,1,1,4-4A4.0045,4.0045,0,0,1,24,22Zm0-6a2,2,0,1,0,2,2A2.0021,2.0021,0,0,0,24,16Z' transform='translate(0 0)'/%3E %3Cpath d='M30,28H28V26a1.0011,1.0011,0,0,0-1-1H21a1.0011,1.0011,0,0,0-1,1v2H18V26a3.0033,3.0033,0,0,1,3-3h6a3.0033,3.0033,0,0,1,3,3Z' transform='translate(0 0)'/%3E %3Cpath d='M14,27.7334l-5.2344-2.791A8.9858,8.9858,0,0,1,4,17V4H24v6h2V4a2.0023,2.0023,0,0,0-2-2H4A2.0023,2.0023,0,0,0,2,4V17a10.9814,10.9814,0,0,0,5.8242,9.707L14,30Z' transform='translate(0 0)'/%3E %3Crect id='_Transparent_Rectangle_' data-name='<Transparent Rectangle>' class='cls-1' width='32' height='32'/%3E %3C/svg%3E");
    }
    #hsm--section-security li:nth-child(8)::before {
      background-image: url("data:image/svg+xml,%3Csvg fill='%235390FD' id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cdefs%3E%3Cstyle%3E.cls-1{fill:none;}%3C/style%3E%3C/defs%3E%3Cpath d='M7,5.21a.77.77,0,0,1-.46-1.38A15.46,15.46,0,0,1,16,1c2.66,0,6.48.45,9.5,2.62a.77.77,0,0,1,.18,1.07.78.78,0,0,1-1.08.17A15,15,0,0,0,16,2.53,14,14,0,0,0,7.5,5.05.74.74,0,0,1,7,5.21Z' transform='translate(0)'/%3E%3Cpath d='M28.23,12.26a.78.78,0,0,1-.63-.33C25.87,9.49,22.78,6.24,16,6.24a14,14,0,0,0-11.63,5.7.77.77,0,0,1-1.07.17A.76.76,0,0,1,3.15,11,15.54,15.54,0,0,1,16,4.71c5.61,0,9.81,2.08,12.84,6.34a.77.77,0,0,1-.19,1.07A.79.79,0,0,1,28.23,12.26Z' transform='translate(0)'/%3E%3Cpath d='M12.28,31a.78.78,0,0,1-.72-.49.75.75,0,0,1,.44-1c4.37-1.68,7-5.12,7-9.21a2.8,2.8,0,0,0-3-3c-1.86,0-2.76,1-3,3.35a4.27,4.27,0,0,1-4.52,3.83,4.27,4.27,0,0,1-4.32-4.59A11.71,11.71,0,0,1,16,8.39a12,12,0,0,1,12,11.93,18.66,18.66,0,0,1-1.39,6.5.78.78,0,0,1-1,.41.76.76,0,0,1-.41-1,17.25,17.25,0,0,0,1.27-5.91A10.45,10.45,0,0,0,16,9.92a10.18,10.18,0,0,0-10.38,10,2.77,2.77,0,0,0,2.79,3.06,2.74,2.74,0,0,0,3-2.48c.36-3.11,1.89-4.69,4.56-4.69a4.31,4.31,0,0,1,4.52,4.56c0,4.74-3,8.72-8,10.63A.92.92,0,0,1,12.28,31Z' transform='translate(0)'/%3E%3Cpath d='M19.77,30.28a.81.81,0,0,1-.52-.2.76.76,0,0,1,0-1.08,12.63,12.63,0,0,0,3.54-8.68c0-1.56-.48-6.65-6.7-6.65a6.83,6.83,0,0,0-4.94,1.87A6.17,6.17,0,0,0,9.32,20a.77.77,0,0,1-.77.76h0A.76.76,0,0,1,7.78,20,7.73,7.73,0,0,1,10,14.46a8.34,8.34,0,0,1,6-2.32c6.08,0,8.24,4.4,8.24,8.18A14.09,14.09,0,0,1,20.34,30,.75.75,0,0,1,19.77,30.28Z' transform='translate(0)'/%3E%3Cpath d='M8.66,27.74a14.14,14.14,0,0,1-1.56-.09.76.76,0,1,1,.17-1.52c2.49.28,4.45-.16,5.84-1.32a6.37,6.37,0,0,0,2.12-4.53.75.75,0,0,1,.82-.71.78.78,0,0,1,.72.81A7.89,7.89,0,0,1,14.09,26,8.2,8.2,0,0,1,8.66,27.74Z' transform='translate(0)'/%3E%3Crect id='_Transparent_Rectangle_' data-name='<Transparent Rectangle>' class='cls-1' width='32' height='32'/%3E%3C/svg%3E");
    }
  @media (min-width: 975px) {
    #hsm--section-security h1 {
      font-size: 42px;
      letter-spacing: .88px;
      line-height: 55px;
      margin-bottom: 73px;
      position: relative;
      opacity: 0;
    }
      #hsm--section-security h1.in-view {
        animation: slideFadeUp 1.5s ease-in-out 1;
        opacity: 1;
      }
    #hsm--section-security ul {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      column-gap: 48px;
      row-gap: 38px;
      max-width: 975px;
      height: auto;
      margin-bottom: 78px;
    }
    #hsm--section-security li {
      font-size: 24px;
      letter-spacing: .92px;
      line-height: 1.5;
      white-space: nowrap; 
      position: relative;
      padding-left: 79px;
      opacity: 0;
      margin-top: 0;
    }
      #hsm--section-security li.in-view {
        animation: slideFadeUp 1.5s ease-in-out 1;
        opacity: 1;
      }
      #hsm--section-security li::before {
        width: 46px;
        height: 46px;
        background-size: 32px;
        left: 0;
        top: 6px;
      }
      #hsm--section-security li + li { margin-top: 0; }
  }

/* OUTRO SECTION */
#hsm--section-outro {
  background: #001ABB;
  color: #FFFFFF;
}
  #hsm--section-outro p {
    letter-spacing: .69px;
    line-height: 23px;
    margin-bottom: 42px;
  }
  #hsm--section-outro .hsm--app-links { margin-bottom: 53px; }
  @media (min-width: 600px) {
    #hsm--section-outro p {
      font-size: 24px;
      letter-spacing: .9px;
      line-height: 39px;
    }
  }

/* ===============================
   FAQ & ANSWER PAGE SHARED HEADER
   =============================== */
#hsm--page-faqs #hsm--header-links,
#hsm--page-faqs-answer #hsm--header-links,
#hsm--page-demo #hsm--header-links,
#hsm--page-news #hsm--header-links {
  padding-top: 30px;
  padding-bottom: 30px;
  background-image: linear-gradient(80deg, #001ABB 0%, #0043FF 99%);
  position: static;
  margin: 0;
}

/* ===============================
   FAQ PAGE
   =============================== */
#hsm--page-faqs {
  color: #4A4A4A;
  font-family: "IBMPlexSans";
}
  #hsm--page-faqs h2 {
    font-size: 24px;
    letter-spacing: .5px;
    line-height: 32px;
    margin-bottom: 30px;
    font-family: "IBMPlexSans-Medium";
  }
  @media (min-width: 700px) {
    #hsm--page-faqs h2 {
      font-size: 36px;
      letter-spacing: 1px;
      line-height: 47px;
      margin-bottom: 42px;
    }
  }

#hsm--search-field {
  background: #F8FAFA;
  text-align: center;
  padding: 36px 36px 24px;
  border-bottom: 1px solid #D8D8D8;
}
  #hsm--search-field > div { position: relative; }
  #hsm--search-field input {
    width: 100%;
    line-height: 46px;
    border: 1px solid #D8D8D8;
    font-size: 16px;
    padding: 0 36px 0 18px;
    color: #4A4A4A;
    outline: none;
  }
  #hsm--search-field button {
    display: none;
    border: none;
    background: transparent;
    position: absolute;
    top: 16px;
    right: 15px;
    width: 15px;
    height: 15px;
    overflow: hidden;
  }
    #hsm--search-field button::before,
    #hsm--search-field button::after {
      content: '';
      display: block;
      position: absolute;
      height: 15px;
      width: 2px;
      background-color: #4A4A4A;
      transform: rotate(45deg);
      top: 0;
    }
    #hsm--search-field button::after { transform: rotate(-45deg); }

  @media (min-width: 700px) {
    #hsm--search-field { padding: 72px 36px 66px; }
      #hsm--search-field > div { max-width: 676px; margin: 0 auto; }
      #hsm--search-field input { font-size: 16px; letter-spacing: .5px; }
  }

#hsm--search-results {
  text-align: left;
  padding: 14px 0 30px;
  font-size: 18px;
  line-height: 26px;
  background: #FFFFFF;
  border: 1px solid #D8D8D8;
  border-top: none;
  position: absolute;
  z-index: 1;
  display: none;
  width: 100%;
}
  #hsm--search-results li { padding: 0 18px; }
    #hsm--search-results li::before { display: none; }
  #hsm--search-results li + li { padding-top: 30px; }
  #hsm--search-results a { text-decoration: none; color: #4A4A4A; }
  @media (min-width: 700px) {
    #hsm--search-results {
      padding: 0;
      font-size: 24px;
      letter-spacing: .5px;
      line-height: 32px;
    }
      #hsm--search-results li { padding: 12px 17px; }
        #hsm--search-results li:hover { background: #EDF4FF; }
      #hsm--search-results li + li { padding-top: 12px; }
  }

#hsm--expand-controls {
  padding: 0 36px 24px;
  text-align: right;
}
  #hsm--expand-all {
    background: none;
    border: 1px solid #0043FF;
    color: #0043FF;
    font-size: 14px;
    padding: 6px 14px;
    cursor: pointer;
    border-radius: 2px;
    position: relative; 
    top: 30px;
  }
  #hsm--expand-all:hover {
    background: #0043FF;
    color: #ffffff;
  }
@media (min-width: 700px) {
  #hsm--expand-controls { padding: 0 151px 24px; }
}

#hsm--faqs-container { padding-bottom: 61px; }
  #hsm--faqs-container section {
    border-bottom: 1px solid #D8D8D8;
    padding: 22px 36px;
  }
    #hsm--faqs-container section h1 {
      position: relative;
      padding-left: 29px;
      cursor: pointer;
    }
      #hsm--faqs-container section h1 button {
        font-size: 20px;
        line-height: 30px;
        background: none;
        border: none;
        padding: 0;
        outline: none;
      }
      #hsm--faqs-container section h1.open::before { display: none; }
      #hsm--faqs-container section h1::before,
      #hsm--faqs-container section h1::after {
        content: '';
        display: block;
        position: absolute;
        width: 3px;
        height: 11px;
        background-color: #4A4A4A;
      }
      #hsm--faqs-container section h1::before { top: 9px; left: 0; }
      #hsm--faqs-container section h1::after  { top: 9px; left: 0; transform: rotate(90deg); }
    #hsm--faqs-container section ul {
      display: none;
      padding: 0 11px;
      font-size: 18px;
      line-height: 26px;
    }
    #hsm--faqs-container section li { margin-top: 24px; }
      #hsm--faqs-container section li::before { display: none; }
      #hsm--faqs-container section li a {
        text-decoration: none;
        color: #0043FF;
      }
  @media (min-width: 700px) {
    #hsm--faqs-container { padding-bottom: 172px; }
      #hsm--faqs-container section { padding: 30px 151px; }
        #hsm--faqs-container section ul {
          padding: 0 30px;
          font-size: 20px;
          line-height: 30px;
        }
        #hsm--faqs-container section li { margin-top: 30px; }
  }

/* ===============================
   FAQ ANSWER PAGE
   =============================== */
#hsm--page-faqs-answer { font-family: "IBMPlexSans"; }

#hsm--faqs-answer-container { padding: 30px 36px 132px; }
  #hsm--faqs-answer-container > a {
    font-size: 20px;
    line-height: 30px;
    text-decoration: none;
    color: #0043FF;
    display: flex;
  }
    #hsm--faqs-answer-container > a span {
      width: 30px;
      height: 30px;
      display: inline-block;
      border-radius: 50%;
      border: 2px solid #0043FF;
      margin-right: 12px;
      position: relative;
    }
      #hsm--faqs-answer-container > a span::before,
      #hsm--faqs-answer-container > a span::after {
        content: '';
        display: block;
        position: absolute;
        width: 16.5px;
        height: 2px;
        background: #0043FF;
        top: 12px;
        left: calc(50% - 8.25px);
      }
      #hsm--faqs-answer-container > a span::after {
        width: 8px;
        height: 8px;
        background: transparent;
        transform: rotate(-45deg);
        top: 8px;
        border-top: 2px solid #0043FF;
        border-left: 2px solid #0043FF;
      }
  #hsm--faqs-answer-container h1 {
    font-size: 24px;
    letter-spacing: .5px;
    line-height: 32px;
    margin: 42px 0;
  }
  #hsm--faqs-answer-container .hsm--faq-answer-text {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 90px;
  }
    /* Paragraphs: space below each one */
    #hsm--faqs-answer-container .hsm--faq-answer-text p {
      margin-bottom: 16px;
    }
    #hsm--faqs-answer-container .hsm--faq-answer-text p:last-child {
      margin-bottom: 0;
    }
    /* Ordered lists */
    #hsm--faqs-answer-container .hsm--faq-answer-text ol {
      list-style-type: decimal;
      list-style-position: inside;
      padding-left: 20px;
      margin-top: 8px;
      margin-bottom: 20px;
    }
      #hsm--faqs-answer-container .hsm--faq-answer-text ol li::before {
        color: #4A4A4A;
        margin: 0 12px 0 0;
        display: none;
      }
      #hsm--faqs-answer-container .hsm--faq-answer-text ol li { margin-top: 10px; }
      #hsm--faqs-answer-container .hsm--faq-answer-text ol li + li { margin-top: 10px; }
    /* Unordered lists */
    #hsm--faqs-answer-container .hsm--faq-answer-text ul {
      list-style-type: disc;
      list-style-position: outside;
      padding-left: 65px;
      margin-top: 8px;
      margin-bottom: 20px;
    }
      #hsm--faqs-answer-container .hsm--faq-answer-text ul li { margin-top: 8px; }
      #hsm--faqs-answer-container .hsm--faq-answer-text ul li + li { margin-top: 8px; }
    /* Bold heading paragraphs followed by a list — tighten the gap */
    #hsm--faqs-answer-container .hsm--faq-answer-text p + ul,
    #hsm--faqs-answer-container .hsm--faq-answer-text p + ol {
      margin-top: 4px;
    }
    #hsm--faqs-answer-container .hsm--faq-answer-text img {
      margin-top: 42px;
      display: block;
      width: 100%;
      max-width: 600px;
      height: auto;
    }
  @media (min-width: 900px) {
    #hsm--faqs-answer-container { padding: 36px 151px 132px; }
      #hsm--faqs-answer-container h1 {
        margin: 66px 0 48px;
        font-size: 36px;
        letter-spacing: 1px;
        line-height: 47px;
      }
      #hsm--faqs-answer-container .hsm--faq-answer-text {
        font-size: 20px;
        line-height: 32px;
      }
  }

#hsm--related-qs {
  border-top: 1px solid #979797;
  padding: 42px 0 0;
  font-size: 18px;
  line-height: 26px;
}
  #hsm--related-qs h3 {
    margin-bottom: 24px;
    font-family: "IBMPlexSans-Medium";
  }
  #hsm--related-qs a {
    color: #0043FF;
    text-decoration: none;
  }
  #hsm--related-qs li + li { margin-top: 24px; }
  #hsm--related-qs li::before { display: none; }
  @media (min-width: 900px) {
    #hsm--related-qs { font-size: 20px; line-height: 30px; }
  }

/* ===============================
   DEMO / VIDEOS PAGE
   =============================== */
#hsm--page-demo {
  color: #4A4A4A;
  font-family: "IBMPlexSans";
}

#hsm--demo-header {
  background-image: linear-gradient(80deg, #001ABB 0%, #0043FF 99%);
  color: #FFFFFF;
  padding: 80px 36px 60px;
  text-align: center;
}
  #hsm--demo-header h2 {
    font-family: "IBMPlexSans-Medium";
    font-size: 36px;
    letter-spacing: .75px;
    line-height: 47px;
    margin-bottom: 16px;
  }
  #hsm--demo-header p {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: .5px;
    max-width: 680px;
    margin: 0 auto;
  }
  @media (min-width: 700px) {
    #hsm--demo-header h2 { font-size: 48px; line-height: 62px; }
  }

#hsm--demo-grid {
  padding: 60px 36px 80px;
  max-width: 1100px;
  margin: 0 auto;
}

.hsm--video-section { margin-bottom: 72px; }
  .hsm--video-section h3 {
    font-family: "IBMPlexSans-Medium";
    font-size: 22px;
    letter-spacing: .5px;
    line-height: 30px;
    margin-bottom: 32px;
    padding-bottom: 12px;
    border-bottom: 2px solid #0043FF;
    color: #001ABB;
  }

.hsm--video-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
}

.hsm--video-card {
  background: #FFFFFF;
  border: 1px solid #E0E0E0;
  border-radius: 4px;
  width: 100%;
  overflow: hidden;
  transition: box-shadow 0.2s;
  display: flex;
  flex-direction: column;
}
  .hsm--video-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
  @media (min-width: 600px) {
    .hsm--video-card { width: calc(50% - 14px); }
  }
  @media (min-width: 900px) {
    .hsm--video-card { width: calc(33.33% - 19px); }
  }

.hsm--video-thumb {
  position: relative;
  background: #001ABB;
  padding-top: 56.25%; /* enforces 16:9 ratio */
  overflow: hidden;
  flex-shrink: 0;
}
  .hsm--video-thumb iframe,
  .hsm--video-thumb a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .hsm--video-thumb iframe { border: none; }
  /* thumbnail image fills the thumb area */
  .hsm--video-thumb a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* play button overlay on real thumbnail links */
  .hsm--video-thumb a::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 24px solid rgba(255,255,255,0.9);
    margin-left: 3px;
    pointer-events: none;
  }
  /* play button circle behind the triangle */
  .hsm--video-thumb a::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(0,0,0,0.45);
    border: 2px solid rgba(255,255,255,0.7);
    pointer-events: none;
  }
  .hsm--video-thumb a:hover::before {
    background: rgba(0,26,187,0.75);
  }
  .hsm--video-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #001ABB 0%, #0043FF 100%);
    color: #FFFFFF;
    font-family: "IBMPlexSans";
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 80px;
  }
    .hsm--video-placeholder::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 48px;
      height: 48px;
      border-radius: 50%;
      border: 2px solid rgba(255,255,255,0.7);
    }
    .hsm--video-placeholder::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 0;
      height: 0;
      border-top: 12px solid transparent;
      border-bottom: 12px solid transparent;
      border-left: 20px solid rgba(255,255,255,0.9);
      margin-left: 3px;
    }

.hsm--video-info {
  padding: 16px 20px 20px;
}
  .hsm--video-info h4 {
    font-family: "IBMPlexSans-Medium";
    font-size: 16px;
    line-height: 22px;
    letter-spacing: .3px;
    color: #001ABB;
    margin-bottom: 8px;
  }
  .hsm--video-info p {
    font-size: 14px;
    line-height: 20px;
    color: #6F6F6F;
  }
  .hsm--video-info .hsm--video-duration {
    display: inline-block;
    margin-top: 10px;
    font-size: 12px;
    color: #FFFFFF;
    background: #0043FF;
    padding: 2px 8px;
    border-radius: 2px;
    letter-spacing: .5px;
  }

/* ===============================
   NEWS PAGE
   =============================== */
#hsm--page-news {
  color: #4A4A4A;
  font-family: "IBMPlexSans";
}

#hsm--news-header {
  background: #F8FAFA;
  padding: 36px 36px 30px;
  border-bottom: 1px solid #D8D8D8;
  text-align: center;
}
  #hsm--news-header h2 {
    font-family: "IBMPlexSans-Medium";
    font-size: 24px;
    letter-spacing: .5px;
    line-height: 32px;
    margin-bottom: 12px;
  }
  #hsm--news-header p {
    font-size: 16px;
    line-height: 24px;
    color: #6F6F6F;
  }
  @media (min-width: 700px) {
    #hsm--news-header {
      padding: 60px 36px 48px;
    }
    #hsm--news-header h2 {
      font-size: 36px;
      letter-spacing: 1px;
      line-height: 47px;
      margin-bottom: 16px;
    }
    #hsm--news-header p {
      font-size: 18px;
      line-height: 28px;
    }
  }

#hsm--news-container {
  padding: 36px 36px 60px;
}
  @media (min-width: 700px) {
    #hsm--news-container {
      padding: 48px 151px 80px;
    }
  }

.hsm--news-article {
  border-bottom: 1px solid #D8D8D8;
  padding-bottom: 36px;
  margin-bottom: 36px;
}
  .hsm--news-article:last-child {
    border-bottom: none;
    margin-bottom: 0;
  }

.hsm--news-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.hsm--news-date {
  font-size: 14px;
  color: #6F6F6F;
  letter-spacing: .3px;
}

.hsm--news-tag {
  font-size: 12px;
  font-family: "IBMPlexSans-Medium";
  color: #FFFFFF;
  background: #0043FF;
  padding: 2px 10px;
  border-radius: 2px;
  letter-spacing: .5px;
  text-transform: uppercase;
}

.hsm--news-title {
  font-family: "IBMPlexSans-Medium";
  font-size: 20px;
  letter-spacing: .4px;
  line-height: 28px;
  margin-bottom: 12px;
}
  @media (min-width: 700px) {
    .hsm--news-title {
      font-size: 24px;
      line-height: 32px;
    }
  }

.hsm--news-summary {
  font-size: 16px;
  line-height: 26px;
  margin-bottom: 16px;
}
  @media (min-width: 700px) {
    .hsm--news-summary {
      font-size: 18px;
    }
  }

.hsm--news-read-more {
  font-size: 16px;
  color: #0F6DFF;
  text-decoration: none;
  font-family: "IBMPlexSans-Medium";
}
  .hsm--news-read-more:hover {
    text-decoration: underline;
  }