body {
  background-color: #f1f5f8;
  background-size: 200px 200px;
  color: #0E1545; }

section.header-banner .banner-slider-v2 {
  width: 100%;
  height: 220px; }
  section.header-banner .banner-slider-v2 img {
    width: 100%;
    height: 100%; }
  @media (max-width: 480px) {
    section.header-banner .banner-slider-v2 {
      height: 160px; } }

section.running-text {
  width: 100%;
  height: 56px;
  overflow: hidden;
  white-space: nowrap;
  background-color: #33D3CB; }
  section.running-text#running-text-1 {
    background-color: #FFE767;
    cursor: pointer; }
  section.running-text #text-container {
    display: inline-block;
    animation: marquee 60s linear infinite; }
  @media (max-width: 768px) {
    section.running-text {
      background-color: #33D3CB; } }

section.celebration {
  height: 473.61px;
  position: relative;
  overflow: hidden; }
  @media (min-width: 1181px) {
    section.celebration .unset-gap {
      gap: unset !important; } }
  section.celebration .card.card-basic-title {
    width: 1010px;
    top: -100px; }
    @media (max-width: 768px) {
      section.celebration .card.card-basic-title .card-title {
        margin-top: 1vh;
        font-weight: 400;
        font-size: 16px;
        line-height: 23px; } }
    @media only screen and (min-width: 768px) and (max-width: 1180px) {
      section.celebration .card.card-basic-title .card-title {
        font-size: 16px; } }
    @media (max-width: 1180px) {
      section.celebration .card.card-basic-title {
        width: 352px;
        top: -282px; } }
    @media (max-width: 768px) {
      section.celebration .card.card-basic-title {
        width: 315px;
        min-height: 143px;
        top: -272px; }
        section.celebration .card.card-basic-title .card-body {
          padding: 14px; } }
  section.celebration .card.card-action {
    min-height: 168.61px;
    box-shadow: -4px 5px 0 1px #1929BB; }
  @media (max-width: 768px) {
    section.celebration {
      height: 788.84px;
      padding: 16px 16px 24px; }
      section.celebration .row {
        flex-direction: column; }
      section.celebration .bottom-cta .btn {
        width: 343px; } }
  @media only screen and (min-width: 768px) and (max-width: 1180px) {
    section.celebration {
      height: 780px; }
      section.celebration .row {
        flex-direction: column; } }

section.about-us {
  margin-bottom: -8rem; }
  @media (max-width: 900px) {
    section.about-us {
      height: 100%;
      background-attachment: unset;
      margin-bottom: auto; } }
  section.about-us .has-bg-card-sprite-left:before {
    content: "";
    width: 180px;
    height: 218px;
    position: absolute;
    left: -8%;
    top: 32%;
    background-image: url('data:image/svg+xml;utf8,<svg width="189" height="227" viewBox="0 0 189 227" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g filter="url(%23filter0_d_327_73127)"><g clip-path="url(%23clip0_327_73127)"><rect x="8" y="0.4104" width="180.386" height="218.094" rx="8" fill="%23EBEBEB"/><mask id="path-3-inside-1_327_73127" fill="white"><path d="M8 0.4104H188.386V33.0226H8V0.4104Z"/></mask><path d="M8 0.4104H188.386V33.0226H8V0.4104Z" fill="%23FF7357"/><circle cx="36.5358" cy="16.7164" r="3.56696" fill="white" stroke="%230E1545" stroke-width="1.01913"/><circle cx="48.7652" cy="16.7164" r="3.56696" fill="white" stroke="%230E1545" stroke-width="1.01913"/><circle cx="60.9947" cy="16.7164" r="3.56696" fill="white" stroke="%230E1545" stroke-width="1.01913"/><path d="M188.386 31.5226H8V34.5226H188.386V31.5226Z" fill="%230E1545" mask="url(%23path-3-inside-1_327_73127)"/><rect x="8.75" y="33.7725" width="178.886" height="183.982" fill="url(%23pattern0)"/><rect x="8.75" y="33.7725" width="178.886" height="183.982" fill="%23E7E1F6"/><rect x="8.75" y="33.7725" width="178.886" height="183.982" stroke="%230E1545" stroke-width="1.5"/></g><rect x="8.75" y="1.1604" width="178.886" height="216.594" rx="7.25" stroke="%230E1545" stroke-width="1.5"/></g><defs><filter id="filter0_d_327_73127" x="0" y="0.4104" width="188.386" height="226.094" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dx="-8" dy="8"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix type="matrix" values="0 0 0 0 0.054902 0 0 0 0 0.0823529 0 0 0 0 0.270588 0 0 0 1 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_327_73127"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_327_73127" result="shape"/></filter><pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1"><use xlink:href="%23image0_327_73127" transform="matrix(0.0160664 0 0 0.015625 -0.0141243 0)"/></pattern><clipPath id="clip0_327_73127"><rect x="8" y="0.4104" width="180.386" height="218.094" rx="8" fill="white"/></clipPath><image id="image0_327_73127" width="64" height="64" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAA40lEQVR4Xu3bQQ6EQAhEUbj/oXsO8Sdh4XOvJAi/qkF3Zt6E6710++xuiD6T40uACtACqYlzD2IACFKBkoHcgmSQDJJBMngKIT6ADygF6DSYfcCLTzg/z0eGrASogDbT0gKxB2MB5pkiBoBgrEEMwIBjLx9fAAiCIAhygmkkRgYjhWMHditsL2AvYC+QIHjdwzk+BmAABmBAWc1kCF0bKRAEQRAEQRAMGaACbaCUz/P5BRiKxhQaiV07uRjfYgQDMKDpGAhGCMUCzD4CBEEw1iAGYIBPZMJh+g8/P8cKpAJfV4EfMee/sLtaEFIAAAAASUVORK5CYII="/></defs></svg>');
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0; }
    @media (max-width: 900px) {
      section.about-us .has-bg-card-sprite-left:before {
        left: 3%;
        top: 23%;
        width: 103.12px;
        height: 124.68px; } }
  @media (max-width: 900px) {
    section.about-us .has-bg-card-sprite-left {
      flex-flow: row-reverse; } }
  section.about-us .card-image {
    width: 100%; }
    @media (max-width: 900px) {
      section.about-us .card-image {
        height: 225px; } }
    section.about-us .card-image .card-body img {
      width: 100%;
      border-bottom-left-radius: 12px;
      border-bottom-right-radius: 12px;
      object-fit: contain; }
      @media (max-width: 900px) {
        section.about-us .card-image .card-body img {
          height: 200px;
          object-fit: cover; } }
    @media (min-width: 1200px) {
      section.about-us .card-image.slider .card-body .swiper {
        min-height: 329.63px; } }
    section.about-us .card-image.slider .card-body .swiper .swiper-pagination-bullet {
      width: 10px;
      height: 10px;
      opacity: 1;
      border: 1px solid #0E1545;
      background: transparent; }
      section.about-us .card-image.slider .card-body .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background: #FFF983; }
    section.about-us .card-image:before {
      content: "";
      width: 51px;
      height: 60px;
      position: absolute;
      right: 5%;
      top: -12%;
      background-image: url('data:image/svg+xml;utf8,<svg width="53" height="62" viewBox="0 0 53 62" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M34.8097 40.4355L23.2737 37.1591L19.5142 22.951C19.3626 22.3999 18.8775 22.0171 18.3015 22.0171C17.7255 22.0171 17.2404 22.3999 17.0888 22.951L13.3293 37.1591L1.79333 40.4355C1.2476 40.5886 0.883789 41.0785 0.883789 41.645C0.883789 42.2115 1.26276 42.7014 1.79333 42.8545L13.3293 46.1309L17.0888 60.339C17.2404 60.8901 17.7255 61.2729 18.3015 61.2729C18.8775 61.2729 19.3626 60.8901 19.5142 60.339L23.2737 46.1309L34.8097 42.8545C35.3554 42.7014 35.7192 42.2115 35.7192 41.645C35.7192 41.0785 35.3402 40.5886 34.8097 40.4355Z" fill="%23FCD500" stroke="%23142C54" stroke-width="1.01913" stroke-miterlimit="10"/><path d="M51.0904 12.6165L44.2082 10.6568L41.9495 2.11362C41.7979 1.56245 41.3128 1.17969 40.7368 1.17969C40.1607 1.17969 39.6756 1.56245 39.5241 2.11362L37.2654 10.6568L30.3832 12.6165C29.8374 12.7696 29.4736 13.2596 29.4736 13.8261C29.4736 14.3925 29.8526 14.8825 30.3832 15.0356L37.2654 16.9953L39.5241 25.5385C39.6756 26.0897 40.1607 26.4724 40.7368 26.4724C41.3128 26.4724 41.7979 26.0897 41.9495 25.5385L44.2082 16.9953L51.0904 15.0356C51.6361 14.8825 51.9999 14.3925 51.9999 13.8261C51.9999 13.2596 51.621 12.7696 51.0904 12.6165Z" fill="white" stroke="%23142C54" stroke-width="1.01913" stroke-miterlimit="10"/></svg>');
      background-repeat: no-repeat;
      background-size: contain; }
      @media (max-width: 900px) {
        section.about-us .card-image:before {
          width: 29px;
          height: 34px;
          right: 0;
          left: 20%;
          top: -10%; } }
  @media (max-width: 900px) {
    section.about-us .card-basic {
      width: 100%; } }
  section.about-us .card-basic .btn-primary-harpropnas {
    width: 212.33px;
    height: 48px;
    border-radius: 4px; }
    @media (max-width: 900px) {
      section.about-us .card-basic .btn-primary-harpropnas {
        width: 100%; } }

@keyframes marquee {
  100% {
    transform: translateX(-100%); } }

.harpropnas-knowledge {
  padding-top: 80px;
  margin-inline: 160px; }
  @media only screen and (min-width: 730px) and (max-width: 1024px) {
    .harpropnas-knowledge {
      padding-top: 40px; } }
  @media (max-width: 729px) {
    .harpropnas-knowledge {
      margin-inline: 0px !important;
      padding-inline: 8px;
      padding-bottom: 24px;
      padding-top: 40px; } }

.additonal-image-right {
  position: absolute;
  right: 0; }
  @media (max-width: 729px) {
    .additonal-image-right {
      display: none; } }

.card-title {
  font-family: "Merilona", sans-serif;
  color: #1929bb;
  font-size: 56px;
  font-style: normal;
  font-weight: 400;
  line-height: 64px;
  letter-spacing: 1.12px; }
  @media (max-width: 729px) {
    .card-title {
      font-size: 40px !important;
      font-style: normal;
      font-weight: 400 !important;
      line-height: 40px !important;
      letter-spacing: 0.8px !important; } }

.card-text {
  color: var(--Neutral-D-Neutral-300, #1a2258);
  font-family: "Mandau", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal; }
  @media (max-width: 729px) {
    .card-text {
      font-size: 16px !important;
      font-style: normal !important;
      font-weight: 400 !important;
      line-height: normal !important; } }

@media (max-width: 769px) {
  .mobile-none {
    display: none; }
  .additonal-image-left {
    display: none; }
  .section-harpropnas-knowledge {
    display: flex;
    flex-direction: column-reverse; } }

.body-why-harpropnas {
  display: flex;
  gap: 24px; }

.title-why-harpropnas {
  font-family: "Merilona", sans-serif;
  color: #1929bb;
  text-align: center;
  font-size: 56px;
  font-style: normal;
  font-weight: 400;
  line-height: 64px;
  letter-spacing: 1.12px; }
  @media (max-width: 767px) {
    .title-why-harpropnas {
      text-align: center;
      font-size: 40px !important;
      font-style: normal !important;
      font-weight: 400 !important;
      line-height: normal !important;
      letter-spacing: 0.8px !important; } }

.img-wrap-harpropnas {
  border-radius: 6px; }

.cta-button-join-harpropnas {
  border-radius: 8px;
  font-family: "Mandau", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  background: #1929bb;
  display: flex;
  height: 48px;
  padding: 0px 24px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: #f1f5f8; }

.section-why-join-harpropnas {
  margin-bottom: 32px; }
  @media (max-width: 768px) {
    .section-why-join-harpropnas {
      padding-inline: 1rem; } }

.swiper-about-us {
  border-radius: 56px 0px 56px 56px;
  background: #d9d9d9;
  box-shadow: -8px 8px 0px 0px #2cc6be; }

@media (max-width: 768px) {
  section.celebration {
    height: 100%;
    padding-top: 32px; }
    section.celebration .row {
      flex-direction: column; }
    section.celebration .bottom-cta .btn {
      width: 100%; } }

.breadcrumbs {
  font-size: 14px;
  color: #333;
  padding: 0;
  margin: 0;
  border-bottom: 1px solid #ccc; }
  @media (max-width: 768px) {
    .breadcrumbs {
      font-size: 12px; } }
  .breadcrumbs li {
    display: inline;
    margin-right: 5px; }
    .breadcrumbs li::after {
      content: "/";
      color: #b6bac2;
      margin-left: 5px; }
    .breadcrumbs li:last-child::after {
      content: ""; }

.swiper-container .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%; }

@media (min-width: 768px) {
  .carousel-about-us {
    max-width: 510px; } }

.card-image-slider {
  background: center; }

.swiper-pagination {
  display: none; }