/* Homepage | .hero */

main > section:first-child {
    margin-top: 6.040vw
    /*88px*/;
}

.hero {
    padding: 4.873vw /*71px*/ 0 3.432vw /*50px*/ 0;
    text-align: center;
}

.hero .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.hero .text {
    color: var(--black-70, rgba(0, 0, 0, 0.70));
    margin-top: 2.128vw
    /*31px*/;
    max-width: 43.377vw
    /*632px*/;
}

.hero .button-container {
    margin-top: 2.883vw
    /*42px*/;
    gap: 1.098vw
    /*16px*/;
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
}

.hero .title .multiple-img {
    margin-top: -0.618vw
    /*-9px*/;
}

.multiple-img {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.multiple-img .img {
    display: block;
    height: 5.491vw
    /* 80px*/;
    margin: 0 !important;
}

.multiple-img .img img {
    display: block;
    height: 100%;
}

.img.auto-slider {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: var(--light-Green);
}

.auto-slider img {
    display: block;
    height: 100%;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}

.auto-slider img.-active {
    opacity: 1;
    pointer-events: auto;
}

.auto-slider img:not(:first-child) {
    position: absolute;
}

/* Homepage | partners-section */

.partners-section {
    padding: 5.491vw /*80px*/ 0 8.236vw /*120px*/ 0;
}

.partners-section .img {
    height: 3.844vw
    /*56px*/;
    margin-right: 6.589vw
    /*96px*/;
}

.partners-section .img img {
    display: block;
    height: 100%;
    display: block;
    width: auto;
}


/* Homepage | pinned-section */

.pinned-section .container {
    padding-top: 5.491vw
    /*80px*/;
}

.pinned-section .container .title {
    margin-top: 1.647vw
    /*24px*/;
}

.section-title .img {
    display: inline-flex;
    height: 4.942vw
    /*72px*/;
    vertical-align: middle;
    margin-top: -0.686vw
    /*-10px*/;
    width: auto !important;
}

.section-title .img img {
    display: block;
    height: 100%;
}

.section-title .img.-middle {
    height: 4.118vw
    /*60px*/;
    margin-top: -0.206vw
    /*-3px*/;
}

.section-title .img.-small {
    height: 3.844vw
    /*56px*/;
    margin: -0.343vw /*-5px*/ 0 0 0.412vw
    /*6px*/;
}

.pinned-section .pinned-slider__wrapper {
    padding: 1.098vw /*16px*/ 2.745vw
    /*40px*/;
    pointer-events: auto;
}

.pinned-slider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* body.-has-banner .pinned-slider {
  padding-top: 120px;
}

body:not(.-has-banner) .pinned-slider {
  padding-top: 80px;
} */

.pinned-slider__card {
    width: 100%;
    transform-origin: top;
    pointer-events: none;
    /* margin: 4.393vw

    0;
    */
    /* transition: opacity 0.4s; */
    opacity: 0;
    pointer-events: none;
}

.pinned-slider__card .pinned-slider__card-wrapper {
    pointer-events: none;
}

.pin-spacer .pinned-slider__card {
    opacity: 1;
    pointer-events: auto;
    transition: opacity 0.4s;
}

.pin-spacer .pinned-slider__card .pinned-slider__card-wrapper {
    pointer-events: auto;
}

.pinned-slider__card .service-card .overlay {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.4s;
    background: var(--White, #FFF);
}

.pinned-slider__card .service-card {
    position: relative;
    z-index: 1;
}

.pinned-slider__card.-hidden {
    opacity: 0;
}

.pinned-slider__card-wrapper {
    pointer-events: auto;
    transform: translateY(100vh);
    max-height: 70vh;
}

.pinned-slider__card:not(:first-child) {
    position: absolute;
    left: 0;
}


/* .pinned-slider__card-wrapper {
  height: clamp(70vh, 41.181vw, 41.181vw);
} */

/* Homepage | industries-section */

.industries-section {
    padding: 13.727vw /*200px*/ 0 8.236vw /*120px*/ 0;
    overflow: hidden;
}

.industries-section .section-title {
    margin-top: 1.030vw
    /*15px*/;
}

.industries-section .section-title + .text {
    margin-top: 2.128vw
    /*31px */;
}

.industries-section .carousel-slider {
    margin-top: 2.883vw
    /*42px*/;
    width: 100%;
    padding: 0 1.098vw
    /*16px*/;
}

.carousel-slider .swiper-wrapper {
    padding: 2.745vw /*40px*/ 0;
}

.carousel-slider .swiper-pagination {
    margin: 2.745vw /*40px*/ auto 0 auto;
}

.swiper-pagination {
    position: relative;
    border-radius: 2.745vw
    /*40px*/;
    border: 1px solid var(--Light-grey-2, #D1DDE8);
    padding: 0.480vw
    /*7px*/;
    gap: 0.412vw
    /*6px*/;
    bottom: auto !important;
    left: auto !important;
    top: auto !important;
    display: flex;
    width: fit-content !important;
    justify-content: center;
    align-items: center;
}

.swiper-pagination .swiper-pagination-bullet {
    width: 0.412vw
    /*6px*/;
    height: 0.412vw
    /*6px*/;
    border-radius: 50%;
    background: var(--Light-grey-2) !important;
    opacity: 1 !important;
    transition: background 0.4s;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer;
}

.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--Black) !important;
}

.carousel-slider .swiper-slide {
    width: 21.963vw
    /*320px*/;
}

.carousel-slider .swiper-slide .industry-card {
    transition: opacity 0.4s;
}

.carousel-slider .swiper-slide:not(.swiper-slide-visible) .industry-card {
    opacity: 0;
    pointer-events: none;
}

/* Homepage | expirience-section */

.expirience-section {
    padding: 5.491vw /*80px*/ 0 13.727vw /*200px*/ 0;
}

.expirience-section.-centered .section-tag {
    margin: 0 auto;
}

.expirience-section.-centered .section-title {
    text-align: center;
    margin-top: 1.667vw
}

.expirience-section.-centered .section-description {
    text-align: center;
    margin-top: 1.667vw
}


.expirience-section .section-title {
    margin-top: 1.304vw
    /*19px*/;
}


.expirience-section .statistic-list {
    margin: 5.491vw /*80px*/ 0;
}

.expirience-section.-e-commerce .statistic-list .statistic-card__text {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;

}

.expirience-section.-e-commerce .statistic-list .statistic-card__text .title {
    margin-bottom: auto;
}

.expirience-section.-e-commerce .statistic-card__text .info {
    display: flex;
    justify-content: space-between;
    gap: 0.972vw;
}

.expirience-section.-e-commerce .statistic-card__text .text {
    margin-top: 2.361vw;
    max-width: 30vw;
}

.expirience-section.-e-commerce .statistic-card .img {
    margin-top: auto;

}

.statistic-list {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1.098vw
    /*16px*/;
}

.statistic-list .col {
    display: flex;
    flex-direction: column;
    grid-column: span 6;
    gap: 1.098vw
    /*16px*/;
}

.statistic-list .col.-animated .statistic-card {
    transition: margin 0.7s ease-out;
    margin: 0 !important;
}

.expirience-section .button {
    margin-top: 2.196vw
    /*32px*/;
    width: fit-content;
}

/* Homepage | sticky-part-section */


.sticky-part-section {
    padding: 13.727vw /*200px*/ 0;
}

.sticky-part-section__wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 3.432vw
    /*50px*/;
}

.sticky-part-section__fixed {
    position: sticky;
    top: 10.295vw
    /*150px*/;
    width: fit-content;
}

.sticky-part-section__fixed .section-title {
    margin-top: 1.167vw
    /*17px*/;
}

.sticky-part-section__fixed .text {
    margin-top: 1.990vw
    /*29px*/;
    max-width: 32.944vw
    /*480px*/;
}

.sticky-part-section__fixed .button {
    margin-top: 3.432vw
    /*50px*/;
    width: fit-content;
}

.sticky-part-section__relative {
    width: 35.964vw
    /*524px*/;
    min-width: 35.964vw
    /*524px*/;
}

.sticky-part-section__relative .benefit-card + .benefit-card {
    margin-top: 4.393vw
    /*64px*/;
}

.benefit-card .img {
    width: 5.491vw
    /*80px*/;
    aspect-ratio: 1/1;
    border-radius: 50%;
    overflow: hidden;
}

.benefit-card .img img {
    display: block;
    width: 100%;
    border-radius: 50%;
}

.benefit-card .title {
    margin-top: 2.196vw
    /*32px*/;
}

.benefit-card .text {
    margin-top: 1.098vw
    /*16px*/;
    max-width: 30.199vw
    /*440px*/;
    color: var(--Black-70);
}


.sticky-part-section .button.-mob {
    display: none;
}

/* Homepage | background-video-section */

.background-video-wrapper {
    position: relative;
    z-index: 1;
    border-radius: 1.098vw
    /*16px*/;
    background: var(--Black, #000);
    overflow: hidden;
}

.background-video-wrapper .bg {
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.background-video-wrapper .bg:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.80) 100%);
}

.background-video-wrapper .bg img,
.background-video-wrapper .bg video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.background-video-wrapper.-static .bg video {
    opacity: 0;
}

.background-video-wrapper .bg video:not(.-full-loaded) {
    opacity: 0;
}

.background-video-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10.981vw /*160px*/ 64px 12.491vw /*182px*/ 64px;
}

.background-video-wrapper .title {
    margin-top: 1.030vw
    /*15px*/;
    text-align: center;
    color: var(--White);
}

/* Homepage | customer-reviews-wrapper */

.customer-reviews-wrapper {
    padding: 6.589vw /*96px*/ 4.393vw
    /*64px*/;
    border-radius: 1.098vw
    /*16px*/;
    background: var(--Light-grey);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    overflow: hidden;
}

.customer-reviews-wrapper .section-title {
    margin-top: 1.647vw
    /*24px*/;
}

.customer-reviews-wrapper .description {
    margin-top: 1.647vw
    /*24px*/;
}

.reviews-slider {
    margin-top: 5.491vw
    /*80px */;
    width: 100%;
}

.review-card {
    padding: 2.745vw
    /*40px*/;
    border-radius: 0.549vw
    /*8px*/;
    background: var(--White, #FFF);

    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.reviews-slider .swiper-slide {
    height: auto;
    width: 49.417vw
    /*720px*/;
}

.review-card .title {
    position: relative;
    padding-top: 3.569vw
    /*52px*/;
    margin-bottom: 2.745vw
    /*40px*/;
    text-align: left;
    color: var(--black-70, rgba(0, 0, 0, 0.70));
}

.review-card .title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 1.922vw
    /*28px*/;
    height: 1.373vw
    /*20px*/;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyOCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEuNjQyNDYgMjBWMTUuODQ1MUg0LjMwMTY4QzYuNDM5NDggMTUuODQ1MSA3LjUwODM4IDE0Ljg4MjYgNy41MDgzOCAxMi45NTc3VjEwLjcwNDJINi4zMzUyQzQuNTEwMjQgMTAuNzA0MiAyLjk5ODE0IDEwLjIxMTMgMS43OTg4OCA5LjIyNTM1QzAuNTk5NjI3IDguMjM5NDQgMCA2Ljk5NTMxIDAgNS40OTI5NkMwIDMuODQ5NzcgMC41OTk2MjcgMi41MzUyMSAxLjc5ODg4IDEuNTQ5MjlDMi45OTgxNCAwLjUxNjQzMSA0LjUxMDI0IDAgNi4zMzUyIDBDOC4xNjAxNSAwIDkuNjQ2MTggMC41Mzk5MDYgMTAuNzkzMyAxLjYxOTcyQzExLjk5MjYgMi42NTI1OCAxMi41OTIyIDQuMDE0MDggMTIuNTkyMiA1LjcwNDIzVjEzLjAyODJDMTIuNTkyMiAxNy42NzYxIDEwLjAxMTIgMjAgNC44NDkxNiAyMEgxLjY0MjQ2Wk0xNy4wNTAzIDIwVjE1Ljg0NTFIMTkuNzA5NUMyMS44NDczIDE1Ljg0NTEgMjIuOTE2MiAxNC44ODI2IDIyLjkxNjIgMTIuOTU3N1YxMC43MDQySDIxLjc0M0MxOS45MTgxIDEwLjcwNDIgMTguNDA2IDEwLjIxMTMgMTcuMjA2NyA5LjIyNTM1QzE2LjAwNzQgOC4yMzk0NCAxNS40MDc4IDYuOTk1MzEgMTUuNDA3OCA1LjQ5Mjk2QzE1LjQwNzggMy44NDk3NyAxNi4wMDc0IDIuNTM1MjEgMTcuMjA2NyAxLjU0OTI5QzE4LjQwNiAwLjUxNjQzMSAxOS45MTgxIDAgMjEuNzQzIDBDMjMuNTY4IDAgMjUuMDU0IDAuNTM5OTA2IDI2LjIwMTEgMS42MTk3MkMyNy40MDA0IDIuNjUyNTggMjggNC4wMTQwOCAyOCA1LjcwNDIzVjEzLjAyODJDMjggMTcuNjc2MSAyNS40MTkgMjAgMjAuMjU3IDIwSDE3LjA1MDNaIiBmaWxsPSIjODM5NkE4Ii8+Cjwvc3ZnPgo=);
}

.reviews-slider .swiper-slide .review-card {
    height: 100%;
    transition: opacity 0.7s;
}

.reviews-slider .swiper-slide:not(.swiper-slide-active) .review-card {
    opacity: 0.4;
}

.review-card .logo {
    margin: auto 0 0 0;
    height: 3.844vw
    /*56px*/;
}

.review-card .logo img {
    height: 100%;
    display: block;
    max-width: 100%;
    width: 100%;
}

.reviews-slider .swiper-pagination {
    margin: 2.745vw /*40px*/ auto 0 auto;
}

.reviews-slider {
    position: relative;
}

.reviews-slider .swiper-wrapper {
    position: relative;
}

.reviews-slider .swiper-navigation {
    position: absolute;
    z-index: 3;
    pointer-events: none;
    width: 100%;
    height: 100%;
}

.reviews-slider .swiper-navigation .navigation-button {
    position: absolute;
    top: 0;
    pointer-events: auto;
    cursor: pointer;
    height: 100%;
    width: calc(((100% - 49.417vw) / 2) + 4.393vw);
}

.reviews-slider .swiper-navigation .navigation-button.next {
    right: 0;
    cursor: url(/wp-content/themes/magnetiq/assets/images/icons/slider-arrow-right.svg) 40 40, pointer;
    transform: translateX(4.393vw);
}

.reviews-slider .swiper-navigation .navigation-button.prev {
    left: 0;
    cursor: url(/wp-content/themes/magnetiq/assets/images/icons/slider-arrow-left.svg) 40 40, pointer;
    transform: translateX(-4.393vw);
}


/* Homepage | news-section */

.news-section {
    padding: 13.727vw /*200px*/ 0 5.491vw /*80px */ 0;
}

.news-section__wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.098vw;
}

.news-section__wrapper-left {
    position: sticky;
    top: 10.295vw
    /*150px*/;
    width: 28.552vw
    /*416px*/;
    min-width: 28.552vw
    /*416px*/;
}

.news-section__wrapper-left .title {
    margin-top: 1.304vw
    /*19px*/;
}

.news-section__wrapper-left .button {
    margin-top: 3.020vw
    /*44px*/;
    width: fit-content;
}

.news-section__wrapper-right {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 2.745vw /*40px*/ 1.098vw
    /*16px*/;
}

.news-section__wrapper-right .article-preview {
    grid-column: span 3;
}

.mobile-slider {
    display: none;
}

/* Homepage | upcoming-events */

.upcoming-events {
    margin: 4.118vw /*60px*/ 0 13.727vw /*200px*/ 0;
}

.upcoming-events .section-title {
    margin-top: 1.647vw
    /*24px*/;
}

.upcoming-events .event-list {
    margin-top: 4.393vw
    /*64px*/;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.098vw
    /*16px*/;
    width: 100%;
}

.upcoming-events .event-list .event-card {
    grid-column: span 1;
}

.upcoming-events .button {
    margin-top: 4.393vw
    /*64px*/;
}

/* Homepage | team-section */

.team-section {
    padding: 13.727vw /*200px*/ 0 13.727vw /*200px*/ 0;
    overflow: hidden;
}

.team-section .section-title {
    margin-top: 1.647vw
    /*24px*/;
}

.team-grid {
    margin-top: 4.393vw
    /*64px*/;
}

.team-grid {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.team-grid__col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 37.062vw
    /*540px*/;
}

.team-grid .static-img {
    display: none;
}

.team-member {
    grid-column: span 1;
    aspect-ratio: 1/1;
    overflow: hidden;

    display: flex;
    justify-content: center;
    align-items: center;
}

.team-member img {
    display: block;
    width: 100%;
}

.team-member.-icon img {
    display: block;
    width: 2.745vw
    /*40px*/;
    aspect-ratio: 1/1;
}

.team-member.-mob {
    display: none;
}

.team-grid__col.-second-rounded .team-member:nth-child(2n+1) {
    border-radius: 50%;
}

.team-grid__col.-first-rounded .team-member:nth-child(2n+2) {
    border-radius: 50%;
}

.team-grid__col .team-member.-rounded {
    border-radius: 50% !important;
}

.team-grid__col.-mob {
    display: none !important;
}

.team-grid .video {
    position: absolute;
    z-index: -2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;

    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.team-grid .video video,
.team-grid .video iframe {
    display: block;
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}

.team-grid .video > * {
    /* padding: 0 !important; */
    width: 100%;
    height: 100%;
}

.team-grid.-before-start-video .video {
    opacity: 0;
}

/* .video-static-afterview {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
}

.video-static-afterview picture,
.video-static-afterview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-grid.-static .video-static-afterview {
  opacity: 1;
} */

.team-grid.-static .video {
    opacity: 0;
}

.team-section .text-container {
    max-width: 43.377vw
    /*632px*/;
    margin: 4.393vw /*64px*/ auto 0 auto;
}

.team-section .text-container p + p {
    margin-top: 1.647vw
    /*24px*/;
}

.team-section .text-container .text {
    color: var(--black-70, rgba(0, 0, 0, 0.70));
    padding-right: 7.687vw
    /*112px*/;
}

.pinned-video {
    width: 100%;
    margin-top: 3.294vw
    /*48px*/;
    overflow: hidden;

    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.pinned-video__inner {
    /* translateY(-27.3%) */
    /* transform-origin: top; */
    /* transform: scale(0.45); */
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 1.098vw
    /*16px*/;
    clip-path: inset(0 0 0 0 round 1.098vw);
    /* width: 45%;
    margin: 0 auto; */
    transform: scale(0.45);
    transform-origin: top;
    overflow: hidden;
    position: relative;
    z-index: 1;
    width: 100%;
    max-height: 95vh;
}

.pinned-video .showreel {
    width: 100%;
    aspect-ratio: 1408/768;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pinned-video .showreel > * {
    /* width: 100%;
    padding: 0 !important;
    height: 100%; */
}


.pinned-video .showreel iframe {
    position: absolute;
    width: 100%;
    height: 105%;
}

.pinned-video video {
    display: block;
    width: 100%;
    /* max-height: calc(100vh - calc(2.745vw * 3)); */
    border-radius: inherit;
    object-fit: cover;
    aspect-ratio: 11/6;
}

.pinned-video .preview {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    transition: opacity 0.4s;
}

.pinned-video .preview video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pinned-video .preview:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    opacity: 0.3;
    background: var(--Black, #000);
    width: 100%;
    height: 100%;
}

.play-button {
    position: absolute;
    z-index: 2;
    border-radius: 5.491vw
    /*80px*/;
    background: var(--white-70, rgba(255, 255, 255, 0.70));
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 0.549vw /*8px*/ 1.647vw /*24px*/ 0.549vw /*8px*/ 0.549vw
    /*8px*/;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.098vw
    /*16px*/;
    cursor: pointer;
    transition: background 0.4s, opacity 0.4s;
    opacity: 0;
    pointer-events: none;
}


.pinned-video__inner.-show-button .play-button {
    opacity: 1;
    pointer-events: auto;
}

.play-button .arrow {
    width: 3.844vw
    /*56px*/;
    display: block;
    aspect-ratio: 1/1;
    border-radius: 50%;
}

.play-button .arrow svg {
    display: block;
    width: 100%;
}

.play-button .arrow rect,
.play-button .arrow path {
    transition: fill 0.4s;
}

.pinned-video__inner.-show-toolbar .video-toolbar {
    opacity: 1;
    pointer-events: auto;
}

.pinned-video__inner.-show-toolbar .preview {
    opacity: 0;
    pointer-events: none;
}

.pinned-video__inner:before {
    content: '';
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: var(--Black);
    opacity: 0;
    pointer-events: none;
    transition: 0.4s;
}

.pinned-video__inner.-video-ended iframe {
    /* transition: 0.4s;
    opacity: 0; */
    pointer-events: none;
}

.pinned-video__inner.-video-ended:before {
    opacity: 1;
}

.video-toolbar {
    position: absolute;
    z-index: 2;
    bottom: 2.745vw
    /*40px*/;
    border-radius: 5.491vw
    /*80px*/;
    background: var(--white-50, rgba(255, 255, 255, 0.50));
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 0.275vw
    /*4px*/;
    gap: 0.275vw
    /*4px*/;

    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.4s;
    opacity: 0;
    pointer-events: none;
}

.video-toolbar > * {
    width: 4.942vw
    /*72px*/;
    aspect-ratio: 1/1;

    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    border-radius: 50%;

    transition: opacity 0.4s, background 0.4s;
    cursor: pointer;
}

.video-toolbar .fullScreen:before,
.video-toolbar .mute:after,
.video-toolbar .mute:before,
.video-toolbar .play:after,
.video-toolbar .play:before {
    background: no-repeat 50% / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTI0LjE5MiAxNy4zOTQtMTIuNzI2IDcuMzg0QzEwLjM4NiAyNS40MDQgOSAyNC42NDYgOSAyMy4zODRWOC42MTZjMC0xLjI2IDEuMzg0LTIuMDIgMi40NjYtMS4zOTJsMTIuNzI2IDcuMzg0YTEuNjA0IDEuNjA0IDAgMCAxIDAgMi43ODZaIiBmaWxsPSIjMDAwIi8+PC9zdmc+);
    content: "";
    display: block;
    height: 2.196vw
    /*32px*/;
    width: 2.196vw
    /*32px*/;
    position: absolute;
    transition: opacity .4s, transform .4s;
    opacity: 0.4;
}

.video-toolbar .play:after {
    background: no-repeat 50% / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTI0IDguNXYxNWMwIC4zOTgtLjE1My43OC0uNDI2IDEuMDYtLjI3My4yODItLjY0My40NC0xLjAyOS40NEgxOC45MWMtLjM4NiAwLS43NTYtLjE1OC0xLjAyOC0uNDRhMS41MjQgMS41MjQgMCAwIDEtLjQyNy0xLjA2di0xNWMwLS4zOTguMTU0LS43OC40MjctMS4wNi4yNzItLjI4Mi42NDItLjQ0IDEuMDI4LS40NGgzLjYzN2MuMzg1IDAgLjc1NS4xNTggMS4wMjguNDQuMjczLjI4LjQyNi42NjIuNDI2IDEuMDZaTTEzLjA5IDdIOS40NTZjLS4zODYgMC0uNzU2LjE1OC0xLjAyOS40NEExLjUyNCAxLjUyNCAwIDAgMCA4IDguNXYxNWMwIC4zOTguMTUzLjc4LjQyNiAxLjA2LjI3My4yODIuNjQzLjQ0IDEuMDI5LjQ0aDMuNjM2Yy4zODYgMCAuNzU2LS4xNTggMS4wMjgtLjQ0LjI3My0uMjguNDI3LS42NjIuNDI3LTEuMDZ2LTE1YzAtLjM5OC0uMTU0LS43OC0uNDI3LTEuMDZBMS40MzMgMS40MzMgMCAwIDAgMTMuMDkxIDdaIiBmaWxsPSIjMDAwIi8+PC9zdmc+);
    opacity: 0;
    transform: scale(0);
}

.video-toolbar .mute:before {
    background: no-repeat 50% / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI2EpIiBmaWxsPSIjMDAwIj48cGF0aCBkPSJNMjMuMzA2IDE4LjM1M2EzLjQ3MyAzLjQ3MyAwIDAgMCAuOTM4LTIuMzYxYzAtLjg3LS4zMzQtMS43MDktLjkzOC0yLjM2YS43NzUuNzc1IDAgMCAwLTEuMDUyLS4wNTUuNjkyLjY5MiAwIDAgMC0uMDc0IDFjLjM2Mi4zOS41NjIuODk0LjU2MiAxLjQxNXMtLjIgMS4wMjUtLjU2MiAxLjQxNmEuNjkyLjY5MiAwIDAgMCAuMDc0IDEgLjc3NS43NzUgMCAwIDAgMS4wNTItLjA1NVpNMjggMTUuOTkyYy4wMDEtMS43NTctLjY4LTMuNDUzLTEuOTEyLTQuNzYzYS43NzQuNzc0IDAgMCAwLTEuMDUyLS4wNDcuNjkzLjY5MyAwIDAgMC0uMDY2IDEgNS41NTggNS41NTggMCAwIDEgMS41MjkgMy44MSA1LjU1OCA1LjU1OCAwIDAgMS0xLjUzIDMuODA5LjcwOC43MDggMCAwIDAtLjE5OS41MTkuNjg3LjY4NyAwIDAgMCAuMjUuNDk4Ljc2MS43NjEgMCAwIDAgLjU0OC4xOC43ODMuNzgzIDAgMCAwIC41Mi0uMjQ0QzI3LjMyIDE5LjQ0NCAyOCAxNy43NDkgMjggMTUuOTkyWk0xOC41MzMgMjYuOTE0YS44MjIuODIyIDAgMCAxLS44NzgtLjA5M2wtNy4yNzUtNS43NDRINS42NjdjLS40NDIgMC0uODY2LS4xNzktMS4xNzktLjQ5NkExLjcwNiAxLjcwNiAwIDAgMSA0IDE5LjM4NHYtNi43NjljMC0uNDQ5LjE3Ni0uODc5LjQ4OC0xLjE5NmExLjY1NCAxLjY1NCAwIDAgMSAxLjE3OS0uNDk2aDQuNzEzbDcuMjc1LTUuNzQ0YS44Mi44MiAwIDAgMSAxLjEuMDY5Ljg1My44NTMgMCAwIDEgLjI0NS41OTh2MjAuMzA4YS44NTYuODU2IDAgMCAxLS40NjcuNzZaIi8+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0iYSI+PHBhdGggZmlsbD0iI2ZmZiIgdHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgLTEgMCAzMikiIGQ9Ik0wIDBoMzJ2MzJIMHoiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=);
}

.video-toolbar .mute:after {
    background: no-repeat 50% / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI2EpIiBmaWxsPSIjMDAwIj48cGF0aCBkPSJNMTguNTMzIDUuMDg2YS44MjIuODIyIDAgMCAwLS44NzguMDkzbC03LjI3NSA1Ljc0NEg1LjY2N2MtLjQ0MiAwLS44NjYuMTc4LTEuMTc5LjQ5NkExLjcwNiAxLjcwNiAwIDAgMCA0IDEyLjYxNnY2Ljc2OWMwIC40NDguMTc2Ljg3OS40ODggMS4xOTYuMzEzLjMxOC43MzcuNDk2IDEuMTc5LjQ5Nmg0LjcxM2w3LjI3NSA1Ljc0NGEuODIuODIgMCAwIDAgMS4xLS4wNjkuODUzLjg1MyAwIDAgMCAuMjQ1LS41OThWNS44NDZhLjg1Ni44NTYgMCAwIDAtLjQ2Ny0uNzZaTTI2LjczNyAxNmwyLjAwNy0yLjAwNmEuODc1Ljg3NSAwIDEgMC0xLjIzOC0xLjIzOEwyNS41IDE0Ljc2M2wtMi4wMDYtMi4wMDdhLjg3NS44NzUgMCAxIDAtMS4yMzggMS4yMzhMMjQuMjYzIDE2bC0yLjAwNyAyLjAwNmEuODc1Ljg3NSAwIDEgMCAxLjIzOCAxLjIzOGwyLjAwNi0yLjAwNyAyLjAwNiAyLjAwN2EuODc1Ljg3NSAwIDEgMCAxLjIzOC0xLjIzOEwyNi43MzcgMTZaIi8+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0iYSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTAgMGgzMnYzMkgweiIvPjwvY2xpcFBhdGg+PC9kZWZzPjwvc3ZnPg==);
    opacity: 0;
}

.video-toolbar .fullScreen:before {
    background: no-repeat 50% / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTEzLjcxNSAxMy43MTMgNS43MTUgNS43MTVNMTQuODU4IDE5LjQyOGg0LjU3MnYtNC41NzJNMTAuMjg1IDEwLjI4NiA0LjU3MSA0LjU3TTkuMTQgNC41NzFINC41N3Y0LjU3MiIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjEuNyIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+);
}

.video-toolbar .fullScreen {
    display: none;
}

.video-toolbar .play.-running:after {
    opacity: 0.4;
    transform: scale(1);
}

.video-toolbar .play.-running:before {
    opacity: 0;
    transform: scale(0);
}

.video-toolbar .mute.-muted:before {
    opacity: 0;
}

.video-toolbar .mute.-muted:after {
    opacity: 0.4;
}

.video-toolbar .play .progressbar {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    pointer-events: none;
}

.video-toolbar .play .progressbar svg {
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.progressbarLine {
    transition: 0.5s;
}

.controls {
    display: none !important;
}


/* Homepage | code-section */

.code-section__wrapper {
    border-radius: 1.098vw
    /*16px*/;
    background: var(--Light-grey, #E8EDF1);
    padding: 10.981vw /*160px*/ 4.393vw
    /*64px*/;

    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8.511vw
    /*124px*/;
}

.code-section__wrapper-left {
    width: 43.377vw
    /*632px*/;
    min-width: 43.377vw
    /*632px*/;
}

.code-section__wrapper-left .button.-mob {
    display: none;
}

.code-example {
    width: 100%;
    aspect-ratio: 632/480;
    border-radius: 0.549vw
    /*8px*/;
    background: var(--Dark-grey-2, #586977);
    overflow: hidden;
}

.code-section__wrapper-right {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.code-section__wrapper-right .title {
    margin-top: 1.647vw
    /*24px*/;
}

.code-section__wrapper-right .text {
    margin-top: 1.647vw
    /*24px*/;
    color: var(--Black-70);
}

.code-section__wrapper-right .button {
    margin-top: 3.294vw
    /*48px*/;
}

.token.punctuation {
    color: var(--White);
}

.token.entity,
.token.operator,
.token.url {
    color: var(--White);
}

.token.class-name,
.token.constant,
.token.property,
.token.symbol {
    color: var(--white-70, rgba(255, 255, 255, 0.70));
}

.token.attr-value,
.token.char,
.token.regex,
.token.string,
.token.variable {
    color: var(--Light-green, #45ED94);
}

:not(pre) > code[class*=language-],
pre[class*=language-] {
    background: var(--Dark-grey-2, #586977);
}

.code-example__tabs {
    height: 100%;
    max-height: calc(100% - 5.216vw /*76px*/
    );
    overflow: hidden;
}

.code-example__item {
    max-height: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

.code-example__item-inner {
    position: relative;
    overflow: hidden;
    max-height: 100%;
    height: 100%;
    grid-column: span 12;
}

.code-for-copy {
    padding: 1.647vw
    /*24px*/;
    width: fit-content;
    min-width: 100%;
}

.code-example__item .copy-button {
    position: absolute;
    z-index: 2;
    right: 1.647vw
    /*24px*/;
    top: 1.647vw
    /*24px*/;
}

.code-example__menu {
    padding: 1.647vw
    /*24px*/;
    height: 5.216vw
    /*76px*/;
    min-height: 5.216vw
    /*76px*/;
    background: var(--white-20, rgba(255, 255, 255, 0.20));
    overflow: hidden;

    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.code-example__menu-inner {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    width: fit-content;
    max-height: 100%;
    gap: 0.275vw
    /*4px*/;
}


pre[class*=language-] {
    padding: 0;
    margin: 0;
}

pre[class*=language-] * {
    white-space: break-spaces !important;
}

.code-example__menu-item {
    border-radius: 2.745vw
    /*40px*/;

    color: var(--White);
    height: 1.922vw
    /*28px*/;
    min-width: 5.491vw
    /*80px*/;
    padding: 0 0.686vw /*10px*/ 0.069vw /*1px*/ 0.686vw
    /*10px*/;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.7;
    transition: opacity 0.4s, background 0.4s;
    cursor: pointer;
}

body.-apple .code-example__menu-item .arrow {
    margin-top: -2px;
}

body.-apple .code-example__menu-item {
    padding-top: 4px;
    padding-bottom: 1px;
}

.code-example__menu-item.-active {
    background: var(--Black, #000);
    opacity: 1;
    pointer-events: none;
}

.code-example .os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-vertical {
    top: 1.098vw
    /*16px*/;
    bottom: 0;
    padding: 0;
    width: 0.206vw
    /*3px*/;
    color: var(--white-70, rgba(255, 255, 255, 0.70));
}

.code-example .os-theme-dark > .os-scrollbar-vertical .os-scrollbar-handle:before,
.code-example .os-theme-light > .os-scrollbar-vertical .os-scrollbar-handle:before {
    left: 0;
    right: 0;
}

.code-example .os-theme-dark > .os-scrollbar-vertical,
.code-example .os-theme-light > .os-scrollbar-vertical {
    width: 3px;
    top: 16px;
    bottom: 16px;
}

.code-example .os-theme-dark > .os-scrollbar-horizontal,
.code-example .os-theme-light > .os-scrollbar-horizontal {
    height: 3px;
    left: 0;
}

.code-example .os-theme-dark > .os-scrollbar,
.code-example .os-theme-light > .os-scrollbar {
    padding: 0;
}


/* E-commerce | hero*/

.hero.-e-commerce {
    padding: 3.333vw /*48px*/ 0;
}

.hero-wrapper {
    display: grid;
    grid-template-columns: 51.389vw 37.500vw;

}

.hero-main {
    text-align: start;
    padding-right: 4.167vw;
}

.hero-main .multiple-img img {
    width: fit-content;
    aspect-ratio: 1/1;

}

.hero-main .button-container {
    margin-top: 3.333vw;
}

.hero-illustration {
    overflow: hidden;
    border-radius: 0.556vw /*8px*/;
}

.hero-illustration img, .hero-illustration video {
    max-width: 100%;
    display: block;
}


/* E-commerce | faq */

.faq {
    margin-top: 13.889vw;
    padding-bottom: 13.889vw;
}

.faq-wrapper {
    display: grid;
    grid-template-columns: 1fr 51.389vw /*740px*/;
    justify-content: space-between;
}


.faq-info {
    position: sticky;
    top: 10.295vw /*150px*/;
    height: fit-content;
}

.faq-info .title {
    margin-top: 1.667vw /*24px*/;
}

.faq-list {
    display: flex;
    flex-direction: column;
    gap: 0.833vw /*12px*/;
}


.faq-accordion .question {
    color: var(--Black, #000);
}

/* E-commerce | info-section*/

.info-section {
    margin-top: 13.889vw;
    padding-bottom: 5.556vw;
}

.info-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.111vw;
    align-items: center;
}

.info-text .title {
    margin-top: 1.667vw;
}

.info-text .section-description {
    max-width: 33.333vw /*480px*/;
    margin-top: 1.667vw;
}

.info-text .section-description {

}

.info-image img {
    border-radius: 0.556vw;
}

.d-none {
    display: none;
}

.d-block {
    display: block;
}

.d-flex {
    display: flex !important;
}

.flex-direction--column {
    flex-direction: column !important;
}

.justify-content-center {
    justify-content: center !important;
}

.align-items-center {
    align-items: center !important;
}

.position-relative {
    position: relative;
}

.position-absolute {
    position: absolute;
}

.position-fixed {
    position: fixed;
}

.position-static {
    position: static;
}

.position-sticky {
    position: sticky;
}

.mb-20 {
    margin-bottom: 1.25rem; //20px
}

@media screen and (min-width: 759px) {
    .font-size-min-w759px-24px {
        font-size: 24px;
    }
}

@media screen and (min-width: 759px) {
    .font-size-min-w759px-16px {
        font-size: 16px;
    }
}


@media screen and (min-width: 1024px) {
    .font-size-min-w1024px-24px {
        font-size: 24px;
    }
}

@media screen and (min-width: 1024px) {
    .font-size-min-w1024px-20px {
        font-size: 20px;
    }
}

@media screen and (min-width: 1260px) {
    .font-size-min-w1260px-40px {
        font-size: 40px;
    }
}

@media screen and (min-width: 1260px) {
    .font-size-min-w1260px-32px {
        font-size: 32px;
    }
}

.title-color {
    color: #000;
    opacity: 0.4;
}

.border-1px-000 {
    border: 1px solid rgba(0, 0, 0, .1);
}

.search-result {
    grid-column: span 3;
    width: 100%;
    background-color: var(--Light-grey);
    border-radius: 0.549vw;
    order: 5;
}

.search-result__item {
    padding: 15px 40px 15px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.search-result__item:last-child {
    border-bottom: unset;
}

.search-no-result {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 200px;
}

.loader-container {
    width: auto !important;
    height: auto !important;
    top: 35%;
    right: 50px;
}

/* E-commerce | Powering*/