:root {
  --viewport-width: 1440;
}
body {
  font-family: var(--title-font);
}
.header-intro {
  background: var(--background);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 9.7222vw 2.2222vw 11.3889vw;
}
.header-intro .tags {
  display: flex;
  gap: 0.8333vw;
  margin-bottom: calc(32 / var(--viewport-width) * 100vw);
  text-transform: uppercase;
}
.header-intro .tags .tag {
  background-color: #ffffff33;
  border-radius: 0.2778vw;
  padding: 0.4167vw 0.5556vw;
  color: #f1f1f1;
  box-shadow: 0 0 48px #000000;
}
.header-intro .subtitle {
  color: #ffffff;
  font-size: calc(24 / var(--viewport-width) * 100vw);
  letter-spacing: -5%;
  line-height: 90%;
  text-transform: uppercase;
  width: calc(1100 / var(--viewport-width) * 100vw);
}
.header-intro h1 {
  color: #ffffff;
  font-size: calc(64 / var(--viewport-width) * 100vw);
  line-height: 90%;
  letter-spacing: -3%;
  text-transform: uppercase;
  width: calc(1100 / var(--viewport-width) * 100vw);
  margin-top: calc(24 / var(--viewport-width) * 100vw);
}
.header-intro .image-box {
  display: flex;
  justify-content: center;
  align-items: center;
}
.header-intro .image-box img {
  width: 100%;
  max-width: calc(247 / var(--viewport-width) * 100vw);
  margin: calc(130 / var(--viewport-width) * 100vw);
}
.header-intro .intro-content {
  color: #000000;
}
.header-intro .intro-content .highlights {
  font-weight: 400;
  font-size: calc(20 / var(--viewport-width) * 100vw);
  letter-spacing: -1.5%;
  line-height: 100%;
  margin-bottom: calc(32 / var(--viewport-width) * 100vw);
  text-transform: uppercase;
}
.header-intro .intro-content .intro-main-content {
    font-weight: 400;
    font-size: calc(32 / var(--viewport-width) * 100vw);
    line-height: 160%;
    margin-bottom: calc(164 / var(--viewport-width) * 100vw);
    color: #0d0d0d;
    width: calc(1264 / var(--viewport-width) * 100vw);
}
.header-intro .intro-content .intro-main-content a {
    text-decoration: underline;
    color: #0d0d0d;
}
.header-intro .intro-content .intro-main-content a:hover {
    color: #FF5900;
}
.header-intro .intro-content .intro-cards {
  display: flex;
  gap: calc(20 / var(--viewport-width) * 100vw);
}
.header-intro .intro-content .intro-cards .intro-card {
  width: calc(260 / var(--viewport-width) * 100vw);
  border-radius: calc(8 / var(--viewport-width) * 100vw);
  padding: calc(32 / var(--viewport-width) * 100vw)
    calc(24 / var(--viewport-width) * 100vw);

  border: 0.0625rem solid hsla(0, 0%, 100%, 0.6);
  background: hsla(0, 0%, 100%, 0.05);
  backdrop-filter: blur(1.375rem);
  -webkit-backdrop-filter: blur(1.375rem);
  box-shadow: inset 0 0.0625rem 0 hsla(0, 0%, 100%, 0.08);
}
.header-intro .intro-content .intro-cards .intro-card .icon {
    margin-bottom: calc(16 / var(--viewport-width) * 100vw);
}
.header-intro .intro-content .intro-cards .intro-card .icon img {
    max-width: calc(51 / var(--viewport-width) * 100vw);
}
.header-intro .intro-content .intro-cards .intro-card .icon p {
  color: #ff5900;
  font-size: calc(48 / var(--viewport-width) * 100vw);
  line-height: 90%;
}
.header-intro .intro-content .intro-cards .intro-card > p {
  color: #000000;
  font-size: calc(16 / var(--viewport-width) * 100vw);
}

.success-story-content {
  display: flex;
  gap: calc(60 / var(--viewport-width) * 100vw);
  padding: calc(120 / var(--viewport-width) * 100vw)
    calc(138 / var(--viewport-width) * 100vw) 0
    calc(32 / var(--viewport-width) * 100vw);
  color: #c2c2c2;
  position: relative;
  flex-direction: row-reverse;
}
.success-story-content .table-of-content {
    width: calc(322 / var(--viewport-width) * 100vw);
    position: relative;
}
.success-story-content .table-of-content .table-of-content-wrapper {
    position: sticky;
    top: calc(130 / var(--viewport-width) * 100vw);
}
.success-story-content .table-of-content ul {
    padding: 0;
}
.success-story-content .table-of-content li {
    padding: calc(16 / var(--viewport-width) * 100vw);
    border-left: calc(1 / var(--viewport-width) * 100vw) solid #6B6B6B80;
    font-size: calc(14 / var(--viewport-width) * 100vw);
    text-transform: uppercase;
    color: #929292;
    cursor: pointer;
}
.success-story-content .table-of-content li.active {
    color: #FFFFFF;
    border-left: calc(1 / var(--viewport-width) * 100vw) solid #FF5900;
}
.success-story-content .table-of-content .share-buttons {
    margin-top: calc(60 / var(--viewport-width) * 100vw);
}
.success-story-content .table-of-content .share-buttons .group-title {
    font-size: calc(12 / var(--viewport-width) * 100vw);
    margin-bottom: calc(24 / var(--viewport-width) * 100vw);
    text-transform: uppercase;
    color: #929292;
}
.success-story-content .table-of-content .share-buttons .buttons-group {
    display: flex;
    gap: calc(4 / var(--viewport-width) * 100vw);
}
.success-story-content .table-of-content .share-buttons .buttons-group img {
    width: calc(52 / var(--viewport-width) * 100vw);
    height: calc(52 / var(--viewport-width) * 100vw);
}
.success-story-content .blocks {
  width: calc(888 / var(--viewport-width) * 100vw);
}

.success-story-content .row {
  display: flex;
}
.success-story-content .row-reverse {
  display: flex;
  flex-direction: row-reverse;
}
.link-arrow {
  color: white;
  font-size: calc(20 / var(--viewport-width) * 100vw);
  text-decoration: underline;
  line-height: 160%;
  font-weight: 400;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: calc(20 / var(--viewport-width) * 100vw);
}
.link-arrow::after {
  content: "";
  width: 1.667vw;
  height: 1.667vw;
  background: url(/wp-content/themes/pmtech/pages/homepage-old/assets/img/arrow.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  transition: 0.3s;
}
.block .block-title {
    font-size: calc(20 / var(--viewport-width) * 100vw);
    margin-bottom: calc(40 / var(--viewport-width) * 100vw);
    color: #F1F1F1;
}

.success-story-cta {
    padding: calc(263 / var(--viewport-width) * 100vw) 0 calc(304 / var(--viewport-width) * 100vw);
    /* background: url("/pages/success-stories/bongobongo/assets/img/background-cta.png"); */
    background: url(/wp-content/themes/pmtech/pages/success-stories/bongobongo/assets/img/background-cta.png);
    background-size: cover;
    background-position: center;
}
.success-story-cta .cta-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.success-story-cta .cta-wrapper .cta-title {
    font-size: calc(86 / var(--viewport-width) * 100vw);
    text-transform: uppercase;
    line-height: 80%;
}
.success-story-cta .cta-wrapper .cta-content {
    color: #C2C2C2;
    font-size: calc(14 / var(--viewport-width) * 100vw);
    line-height: 140%;
    margin: calc(44 / var(--viewport-width) * 100vw) 0 calc(40 / var(--viewport-width) * 100vw);
}
.success-story-cta .cta-wrapper .main-button {
    color: #FF5900;
    font-size: calc(11 / var(--viewport-width) * 100vw);
}
.success-story-cta .cta-wrapper .cta-title span {
    display: block;
}
.other-success-stories {
    padding: 0 calc(32 / var(--viewport-width) * 100vw) calc(100 / var(--viewport-width) * 100vw);
}
.other-success-stories .img-wrapper img {
    width: 100%;
}
.other-success-stories .section-title {
    font-size: calc(64 / var(--viewport-width) * 100vw);
    line-height: 90%;
    letter-spacing: -3%;
    margin-bottom: calc(52 / var(--viewport-width) * 100vw);
    text-transform: uppercase;
    text-align: center;
}
.other-success-stories .success-stories-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: calc(16 / var(--viewport-width) * 100vw);
}
.other-success-stories .title-wrapper .title {
    font-size: calc(24 / var(--viewport-width) * 100vw);
    margin-top: calc(24 / var(--viewport-width) * 100vw);
    line-height: 90%;
    letter-spacing: -5%;
    text-transform: uppercase;
    color: white;
}

@media screen and (max-width: 960px) {
    :root {
        --viewport-width: 375;
    }
    .header-intro {
        padding: 18.7222vw 5.3333vw 11.3889vw;
        background: url(https://gr8.tech/wp-content/themes/pmtech/pages/success-stories/bongobongo/assets/img/header-bg-mobile.png);
        background-size: cover;
        background-position: center;
    }
    .header-intro .subtitle {
        font-size: calc(18 / var(--viewport-width) * 100vw);
        line-height: 110%;
    }
    .header-intro h1 {
        margin-top: calc(8 / var(--viewport-width) * 100vw);
        font-size: calc(26 / var(--viewport-width) * 100vw);
    }
    .header-intro .intro-content .intro-cards,
    .success-story-content .row {
        flex-direction: column;
    }
    .success-story-content {
        flex-direction: column-reverse;
    }
    .success-story-content .row-reverse {
        flex-direction: column-reverse;
        gap: calc(20 / var(--viewport-width) * 100vw);
    }
    .header-intro .subtitle,
    .header-intro h1,
    .success-story-content .blocks,
    .header-intro .intro-content .intro-main-content {
        width: 100%;
    }
    .header-intro .intro-content .intro-main-content {
        font-size: calc(20 / var(--viewport-width) * 100vw);
    }
    .header-intro .intro-content .intro-cards .intro-card {
        width: 100%;
    }
    .header-intro .tags .tag {
        font-size: calc(11 / var(--viewport-width) * 100vw);
        padding: calc(6 / var(--viewport-width) * 100vw) calc(8 / var(--viewport-width) * 100vw);
        border-radius: calc(4 / var(--viewport-width) * 100vw);
    }
    .header-intro .tags {
        gap: calc(8 / var(--viewport-width) * 100vw);
    }
    .header-intro .image-box img {
        margin: calc(112 / var(--viewport-width) * 100vw) 0;
    }
    .header-intro .intro-content .highlights {
        margin-bottom: calc(24 / var(--viewport-width) * 100vw);
    }
    .success-story-content {
        padding: calc(58 / var(--viewport-width) * 100vw) calc(20 / var(--viewport-width) * 100vw) 0 calc(20 / var(--viewport-width) * 100vw);
    }
    .success-story-content .table-of-content li,
    .success-story-content .table-of-content li.active {
        border-left: 0;
        font-size: calc(12 / var(--viewport-width) * 100vw);
        padding: 0;
        display: flex;
        gap: calc(4 / var(--viewport-width) * 100vw);
    }
    .success-story-content .table-of-content li span:last-child {
        display: none;
    }
    .success-story-content .table-of-content li.active span:last-child {
        display: block;
    }
    .success-story-content .table-of-content ul {
        display: flex;
        padding-bottom: calc(20 / var(--viewport-width) * 100vw);
        border-bottom: calc(1 / var(--viewport-width) * 100vw) solid #6B6B6B80;
        gap: calc(20 / var(--viewport-width) * 100vw);
    }
    .success-story-content .table-of-content {
        width: 100%;
    }
    .success-story-content .table-of-content .share-buttons .group-title {
        display: none;
    }
    /* .success-story-content .table-of-content .share-buttons .buttons-group {
        justify-content: center;
        position: fixed;
        bottom: calc(32 / var(--viewport-width) * 100vw);
        width: 100%;
        left: 50%;
        transform: translateX(-50%);
    }
    .success-story-content .table-of-content .share-buttons .buttons-group.is-absolute {
        position: absolute;
        bottom: auto;
        top: calc(var(--section-bottom) - var(--group-height));
        transform: none;
        left: 50%; 
        transform: translateX(-50%);
    } */
    .success-story-content .table-of-content .share-buttons .buttons-group {
        position: static;
    }

    /* Fixed state while scrolling inside the section */
    .success-story-content .table-of-content .share-buttons .buttons-group.is-fixed {
        position: fixed;
        bottom: 32px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
    }

    /* Absolute state when reaching the bottom of the section */
    .success-story-content .table-of-content .share-buttons .buttons-group.is-absolute {
        position: absolute;
        bottom: 32px;
        top: auto;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
    }
    .link-arrow::after {
        width: 5.667vw;
        height: 5.667vw;
    }
    .block .block-title {
        font-size: calc(16 / var(--viewport-width) * 100vw);
        margin-bottom: calc(20 / var(--viewport-width) * 100vw);
    }
    .success-story-cta {
        background: url(/wp-content/themes/pmtech/pages/success-stories/bongobongo/assets/img/cta-bg-mobile.png);
        background-size: cover;
    }
    .success-story-cta .cta-wrapper .cta-title {
        font-size: calc(40 / var(--viewport-width) * 100vw);
    }
    .success-story-cta .cta-wrapper .cta-content {
        font-size: calc(12 / var(--viewport-width) * 100vw);
    }
    .other-success-stories .success-stories-wrapper {
        grid-template-columns: 1fr;
    }
    .other-success-stories .section-title {
        text-align: left;
        font-size: calc(40 / var(--viewport-width) * 100vw);
    }
    .other-success-stories {
        padding: 0 calc(17 / var(--viewport-width) * 100vw);
    }
    .other-success-stories .success-stories-wrapper {
        gap: calc(80 / var(--viewport-width) * 100vw);
    }
}








/* title block */
/* title block */
/* title block */
.block-title {
  margin: 0 0 calc(60 / var(--viewport-width) * 100vw);
}
.block-title .sm-title {
  color: #929292;
  font-weight: 400;
  font-size: calc(14 / var(--viewport-width) * 100vw);
  margin: 0 0 calc(8 / var(--viewport-width) * 100vw);
  line-height: 95%;
  text-transform: uppercase;
}
.block-title .big-title {
  color: #ffffff;
  font-weight: 400;
  font-size: calc(32 / var(--viewport-width) * 100vw);
  line-height: 160%;
  margin: 0;
}
@media screen and (max-width: 960px) {
    .block-title {
        margin: 0 0 calc(40 / var(--viewport-width) * 100vw);
    }
    .block-title .big-title {
        font-size: calc(24 / var(--viewport-width) * 100vw);
    }
}

/* block-content-image */
/* block-content-image */
/* block-content-image */

.block-content-image {
  margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
.block-content-image .row,
.block-content-image .row-reverse {
  gap: calc(60 / var(--viewport-width) * 100vw);
}
.block-content-image .content-60 {
  max-width: 60%;
}
.block-content-image .content {
  font-size: calc(20 / var(--viewport-width) * 100vw);
  line-height: 160%;
  font-weight: 400;
  letter-spacing: 0%;
}
.block-content-image .content a {
  color: white;
  text-decoration: underline;
}
@media screen and (max-width: 960px) {
    .block-content-image .content-60 {
        max-width: 100%;
    }
    .block-content-image .content {
        font-size: calc(14 / var(--viewport-width) * 100vw);
        line-height: 180%;
    }
    .block.block-content-image .row {
        flex-direction: column-reverse;
        gap: calc(20 / var(--viewport-width) * 100vw);
    } 
}

/* block-quote */
/* block-quote */
/* block-quote */
.block-quote.custom-linear {
  background: linear-gradient(164deg, #73198f, #19181b);
}
.block-quote .quote-main-content {
  background: linear-gradient(164deg, #525152, #19181b);
  padding: calc(40 / var(--viewport-width) * 100vw)
    calc(40 / var(--viewport-width) * 100vw)
    calc(60 / var(--viewport-width) * 100vw)
    calc(40 / var(--viewport-width) * 100vw);
}
.block-quote.custom-linear .quote-main-content {
  background: none;
}
.block-quote {
  color: white;
  margin-bottom: calc(20 / var(--viewport-width) * 100vw);
  padding: calc(40 / var(--viewport-width) * 100vw)
    calc(80 / var(--viewport-width) * 100vw)
    calc(60 / var(--viewport-width) * 100vw)
    calc(40 / var(--viewport-width) * 100vw);
}
.block-quote:has(.quote-main-content) {
  padding: 0;
}
.block-quote .row {
  gap: calc(20 / var(--viewport-width) * 100vw);
}
.block-quote .quote-icon {
  max-width: calc(19 / var(--viewport-width) * 100vw);
  margin-bottom: calc(30 / var(--viewport-width) * 100vw);
}
.block-quote .quote-content {
  font-size: calc(20 / var(--viewport-width) * 100vw);
  line-height: 160%;
  font-weight: 400;
  margin: 0;
}
.block-quote .additional-link {
  margin-top: calc(40 / var(--viewport-width) * 100vw);
}
.block-quote:has(.additional-link) {
  margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
@media screen and (max-width: 960px) {
    .block-quote.custom-linear {
        padding: calc(32 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw);
    }
    .block-quote .quote-content {
        font-size: calc(16 / var(--viewport-width) * 100vw);
    }
    .block-quote .quote-icon {
        margin-bottom: calc(24 / var(--viewport-width) * 100vw);
    }
    .block-quote .quote-main-content {
        padding: calc(32 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw);
    }
    .block-quote .additional-link {
        margin-top: calc(20 / var(--viewport-width) * 100vw);
    }
    .block-quote:has(.additional-link) {
        margin-bottom: calc(60 / var(--viewport-width) * 100vw);
    }
}
/* block-image */
/* block-image */
/* block-image */
/* block-image */

.block-image {
  margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
.block-image img:has(~ a) {
  margin-bottom: calc(40 / var(--viewport-width) * 100vw);
}
@media screen and (max-width: 960px) {
    .block-image {
       margin-bottom: calc(60 / var(--viewport-width) * 100vw);
    }
    .block-image img:has(~ a) {
        margin-bottom: calc(20 / var(--viewport-width) * 100vw);
    }
}
/* block-just-text */
/* block-just-text */
/* block-just-text */
/* block-just-text */

.block-just-text {
  font-size: calc(20 / var(--viewport-width) * 100vw);
  line-height: 160%;
  font-weight: 400;
  letter-spacing: 0%;
  margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
.block-just-text a {
    color: white;
    text-decoration: underline;
}
@media screen and (max-width: 960px) {
    .block-just-text {
        font-size: calc(14 / var(--viewport-width) * 100vw);
        margin-bottom: calc(60 / var(--viewport-width) * 100vw);
    }
}
/* block-dash */
/* block-dash */
/* block-dash */
.block-dash {
  margin: calc(80 / var(--viewport-width) * 100vw) 0;
  height: calc(1 / var(--viewport-width) * 100vw);
  background-color: #6b6b6b;
}
@media screen and (max-width: 960px) {
    .block-dash {
        margin: calc(60 / var(--viewport-width) * 100vw) 0;
    }
}
/* block-counted-cards */
/* block-counted-cards */
/* block-counted-cards */

.block-counted-cards {
    margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
.block-counted-cards .block-title {
  color: #f1f1f1;
  font-size: calc(20 / var(--viewport-width) * 100vw);
  line-height: 160%;
  margin-bottom: calc(40 / var(--viewport-width) * 100vw);
}
.block-counted-cards .cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(20 / var(--viewport-width) * 100vw);
}
.block-counted-cards .card {
  color: white;
  line-height: 160%;
  font-size: calc(16 / var(--viewport-width) * 100vw);
  padding: calc(32 / var(--viewport-width) * 100vw)
    calc(28 / var(--viewport-width) * 100vw);
}
.block-counted-cards .card .count {
  margin-bottom: calc(20 / var(--viewport-width) * 100vw);
  font-size: calc(16 / var(--viewport-width) * 100vw);
}
.block-counted-cards .card:first-child {
  background: #191919;
  background: radial-gradient(
    circle at 150% 55%,
    rgb(142, 62, 18) 0%,
    rgb(78, 33, 8) 35%,
    rgb(28, 26, 26) 70%,
    rgb(20, 20, 20) 100%
  );
}
.block-counted-cards .card {
  background: #191919;
  background: radial-gradient(
    circle at 55% 50%,
    rgb(175, 75, 18) 0%,
    rgb(112, 44, 8) 45%,
    rgb(56, 21, 4) 85%,
    rgb(36, 14, 3) 100%
  );
}
.block-counted-cards .card:last-child {
  background: #191919;
  background: 
  radial-gradient(
    circle at -12% 55%,
    rgb(105, 45, 15) 0%,
    rgb(54, 25, 10) 40%,
    rgb(26, 24, 24) 75%,
    rgb(18, 18, 18) 100%
  );
}

@media screen and (max-width: 960px) {
    .block-counted-cards {
        margin-bottom: calc(60 / var(--viewport-width) * 100vw);
    }
    .block-counted-cards .cards {
        grid-template-columns: 1fr;
    }
    .block-counted-cards .block-title {
        font-size: calc(16 / var(--viewport-width) * 100vw);
        margin-bottom: calc(20 / var(--viewport-width) * 100vw);
    }
    .block-counted-cards .card {
        padding: calc(32 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw);
    }
}
/* block-images-row */
/* block-images-row */
/* block-images-row */

.block-images-row {
    margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
.block-images-row .row {
    gap: calc(20 / var(--viewport-width) * 100vw);
}
.block-images-row .image img {
    width: 100%;
    height: 100%;
}

/* block-timeline */
/* block-timeline */
/* block-timeline */

.block-timeline {
    margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
/* .block-timeline .timeline-title {
    font-size: calc(20 / var(--viewport-width) * 100vw);
    margin-bottom: calc(40 / var(--viewport-width) * 100vw);
} */
.block-timeline .timeline .timeline-block {
    margin-bottom: calc(38 / var(--viewport-width) * 100vw);
}
/* .block-timeline .timeline-title, */
.block-timeline .timeline .timeline-block .timeline-block-title {
    color: #F1F1F1;
}
.block-timeline .timeline .timeline-block .timeline-block-title {
    margin: calc(16 / var(--viewport-width) * 100vw) 0 calc(8 / var(--viewport-width) * 100vw);
}
.block-timeline .timeline {
    padding: 0 0 0 calc(30 / var(--viewport-width) * 100vw);
    /* border-left: calc(1 / var(--viewport-width) * 100vw) dashed #C2C2C2; */
    background-image: linear-gradient(black 50%, #C2C2C2 50%);
    background-position: left;
    background-size: calc(1 / var(--viewport-width) * 100vw) calc(8 / var(--viewport-width) * 100vw);
    background-repeat: repeat-y;
}
.block-timeline .timeline .timeline-block .timeline-block-time {
    color: #FF5900;
}
.block-timeline .timeline .timeline-block .timeline-block-time::before {
    content: '';
    display: block;
    width: calc(14 / var(--viewport-width) * 100vw);
    height: calc(14 / var(--viewport-width) * 100vw);
    border: calc(4 / var(--viewport-width) * 100vw) solid #FF5900;
    border-radius: 100%;
    position: absolute;
    left: 0;
    background: black;
    transform: translate(-50%, calc(5 / var(--viewport-width) * 100vw));
} 
.block-timeline .timeline .timeline-block .timeline-block-title,
.block-timeline .timeline .timeline-block .timeline-content,
.block-timeline .timeline .timeline-block .timeline-block-time {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    line-height: 160%;
}
@media screen and (max-width: 960px) {
    .block-timeline .timeline .timeline-block .timeline-block-time::before {
        width: calc(7 / var(--viewport-width) * 100vw);
        height: calc(7 / var(--viewport-width) * 100vw);
        border: calc(2 / var(--viewport-width) * 100vw) solid #FF5900;
    }
}
/* block-quote-with-author */
/* block-quote-with-author */
/* block-quote-with-author */

.block-quote-with-author.quote-dark .quote-wrapper {
    background: #191919;
    background: radial-gradient(
        circle at 150% 55%,
        rgb(142, 62, 18) 0%,
        rgb(78, 33, 8) 35%,
        rgb(28, 26, 26) 70%,
        rgb(20, 20, 20) 100%
    );
}
.block-quote-with-author.quote-light .quote-wrapper {
    background: #F1F1F1;
    background: radial-gradient(circle at 95% 231%, #FF5900 18%, #F1F1F1 68%);
}
.block-quote-with-author.quote-dark .quote-wrapper {
    color: #FFFFFF;
}
.block-quote-with-author.quote-dark .quote-wrapper .quote-author .author-name-position .name {
    color: #FFFFFF;
}
.block-quote-with-author.quote-light .quote-wrapper {
    color: #000000;
}
.block-quote-with-author.quote-light .quote-wrapper .quote-author .author-name-position .name {
    color: #000000;
}
.block-quote-with-author {
    margin-bottom: calc(80 / var(--viewport-width) * 100vw);
}
.block-quote-with-author .quote-wrapper {
    padding: calc(60 / var(--viewport-width) * 100vw);
}
.block-quote-with-author .quote-content {
    font-size: calc(20 / var(--viewport-width) * 100vw);
    line-height: 160%;
    padding-bottom: calc(40 / var(--viewport-width) * 100vw);
}
.block-quote-with-author .quote-author .quote-author-image {
    width: calc(64 / var(--viewport-width) * 100vw);
}
.block-quote-with-author .quote-author .row {
    gap: calc(20 / var(--viewport-width) * 100vw);
    align-items: center;
}
.block-quote-with-author .quote-author .author-name-position .name {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    margin-bottom: calc(4 / var(--viewport-width) * 100vw);
}
.block-quote-with-author .quote-author .author-name-position .position {
    color: #929292;
}
@media screen and (max-width: 960px) {
    .block-quote-with-author .quote-wrapper {
        padding: calc(32 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw);
    }
    .block-quote-with-author .quote-author .row {
        flex-direction: row;
    }
    .block-quote-with-author .quote-content {
        font-size: calc(16 / var(--viewport-width) * 100vw);
    }
}
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */
/* tabs */





/* block-progress */
/* block-progress */
/* block-progress */
/* block-progress */

.block-progress .progress-intro {
    padding: calc(50 / var(--viewport-width) * 100vw) calc(40 / var(--viewport-width) * 100vw);
    background: linear-gradient(134deg, #525152, #19181B);
    position: relative;
    overflow: hidden;
    margin-bottom: calc(40 / var(--viewport-width) * 100vw);
}
.block-progress .progress-intro::after {
    content: '';
    position: absolute;
    width: 848px;
    height: 85px;
    background-color: #FF5900;
    filter: blur(156px);
    opacity: 1;
    pointer-events: none;
}
.block-progress .progress-intro .row {
    gap: calc(20 / var(--viewport-width) * 100vw);
}
.block-progress .progress-intro .progress-intro-content {
    max-width: 59%;
}
.block-progress .progress-intro .progress-intro-content .title {
    font-size: calc(20 / var(--viewport-width) * 100vw);
    margin-bottom: calc(10 / var(--viewport-width) * 100vw);
    color: #FFFFFF;
}
.block-progress .progress-intro .progress-intro-content .content {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    line-height: 160%;
    color: #C2C2C2;
}
.block-progress .progress-intro .progress-intro-image {
    width: calc(307 / var(--viewport-width) * 100vw);
}

/* .block-progress .progress-numbers { */
    /* position: relative; */
/* } */
.block-progress .progress-numbers .row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(20 / var(--viewport-width) * 100vw);
}
.block-progress .progress-numbers .row .number-block {
    padding: calc(50 / var(--viewport-width) * 100vw) calc(20 / var(--viewport-width) * 100vw) calc(40 / var(--viewport-width) * 100vw);
}
.block-progress .progress-numbers .row .number-block .number-big {
    font-size: calc(86 / var(--viewport-width) * 100vw);
}
.block-progress .progress-numbers .row .number-block .number-content {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    line-height: 160%;
}
.block-progress .progress-numbers .row .number-block:first-child {
    background-color: #FFFFFF;
    color: black;
    background: linear-gradient(112deg, #FFFFFF 31%, #ffe5d8 100%);
}
.block-progress .progress-numbers .row .number-block:last-child {
    background-color: #252525;
    color: #FFFFFF;
    background: linear-gradient(112deg, #252525 31%, #462d20 100%);
}
.block-progress .progress-numbers::after {
    content: '';
    position: absolute;
    width: 85px;
    height: 337px;
    background-color: #FF5900;
    filter: blur(156px);
    opacity: 1;
    right: 0;
    pointer-events: none;
    display: none;
}
.block-progress .middleware-text {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    line-height: 160%;
    margin: calc(20 / var(--viewport-width) * 100vw) 0 calc(40 / var(--viewport-width) * 100vw);
}
.block-progress .progress-ending .row {
    gap: calc(20 / var(--viewport-width) * 100vw);
}
.block-progress .progress-ending .number-block {
    background: linear-gradient(140deg, #FF7700 0%, #666666 67%);
    color: white;
    padding: calc(100 / var(--viewport-width) * 100vw) calc(66 / var(--viewport-width) * 100vw) calc(88 / var(--viewport-width) * 100vw) calc(25 / var(--viewport-width) * 100vw);
}
.block-progress .progress-ending .number-big {
    font-size: calc(86 / var(--viewport-width) * 100vw);
}
.block-progress .progress-ending .number-content {
    font-size: calc(20 / var(--viewport-width) * 100vw);
    line-height: 160%;
}
.block-progress .progress-ending .text-block {
    background: linear-gradient(164deg, #525152, #19181b);
    padding: calc(50 / var(--viewport-width) * 100vw) calc(40 / var(--viewport-width) * 100vw);
}
.block-progress .progress-ending .text-block * {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    line-height: 160%;
}

@media screen and (max-width: 960px) {
    .block-progress .progress-numbers .row {
        grid-template-columns: 1fr;
    }
    .block-progress .progress-ending .number-block,
    .block-progress .progress-intro {
        padding: calc(32 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw);
    }
    .block-progress .progress-intro .row {
        flex-direction: column-reverse;
    }
    .block-progress .progress-intro .progress-intro-image,
    .block-progress .progress-intro .progress-intro-content {
        max-width: 100%;
    }
    .block-progress .progress-intro .progress-intro-content .title {
        font-size: calc(16 / var(--viewport-width) * 100vw);
        margin-top: calc(24 / var(--viewport-width) * 100vw);
    }
    .block-progress .progress-ending .number-content,
    .block-progress .progress-intro .progress-intro-content .content {
        font-size: calc(14 / var(--viewport-width) * 100vw);
    }
    .block-progress .progress-ending .number-big,
    .block-progress .progress-numbers .row .number-block .number-big {
        font-size: calc(40 / var(--viewport-width) * 100vw);
    }
    .block-progress .progress-numbers .row .number-block {
        padding: calc(30 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw) calc(30 / var(--viewport-width) * 100vw);
    }
    .block-progress .progress-ending .text-block {
        padding: calc(32 / var(--viewport-width) * 100vw) calc(24 / var(--viewport-width) * 100vw);
    }
}
/* block-tabs */
/* block-tabs */
/* block-tabs */
/* block-tabs */
.block-tabs .tabs ul {
    display: flex;
    gap: calc(29 / var(--viewport-width) * 100vw);
}
.block-tabs .tabs li {
    color: #F1F1F1;
    text-transform: uppercase;
    font-size: calc(16 / var(--viewport-width) * 100vw);
    padding-bottom: calc(4 / var(--viewport-width) * 100vw);
    line-height: 160%;
    cursor: pointer;
}
.block-tabs .tabs li.active {
    color: #FF5900;
    border-bottom: calc(1 / var(--viewport-width) * 100vw) solid #FF5900;
}
.block-tabs .tab-content-wrapper {
    background: #6D6D6D33;
    margin-top: calc(40 / var(--viewport-width) * 100vw);
    border-radius: calc(8 / var(--viewport-width) * 100vw);
    padding: calc(40 / var(--viewport-width) * 100vw);
    display: flex;
    gap: calc(40 / var(--viewport-width) * 100vw);
    border: calc(1 / var(--viewport-width) * 100vw) solid #6D6D6D33;
}
.block-tabs .tab-content-wrapper .image-wrapper {
    width: calc(228 / var(--viewport-width) * 100vw);
}
.block-tabs .tab-content-wrapper .image-wrapper img {
    width: 100%;
}
.block-tabs .tab-content-wrapper .content-wrapper {
    width: calc(532 / var(--viewport-width) * 100vw);
}
.block-tabs .tab-content-wrapper .content-wrapper .title {
    font-size: calc(20 / var(--viewport-width) * 100vw);
    line-height: 160%;
    color: #FFFFFF;
    margin-bottom: calc(16 / var(--viewport-width) * 100vw);
}
.block-tabs .tab-content-wrapper .content-wrapper .content {
    font-size: calc(16 / var(--viewport-width) * 100vw);
    line-height: 160%;
}
.block-tabs .tab-content .tab-content-wrapper {
  display: none;
}
.block-tabs .tab-content .tab-content-wrapper.active {
  display: flex;
}
@media screen and (max-width: 960px) {
    .block-tabs .tabs ul {
        gap: calc(12 / var(--viewport-width) * 100vw);
        overflow-x: scroll;
    }
    .block-tabs .tab-content .tab-content-wrapper.active {
        flex-direction: column;
    }
    .block-tabs .tab-content-wrapper .content-wrapper,
    .block-tabs .tab-content-wrapper .image-wrapper {
        width: 100%;
    }
    .block-tabs .tab-content-wrapper {
        padding: calc(23 / var(--viewport-width) * 100vw);
    }
    .block-tabs .tab-content-wrapper .content-wrapper .title {
        font-size: calc(16 / var(--viewport-width) * 100vw);
    }
    .block-tabs .tab-content-wrapper .content-wrapper .content {
        font-size: calc(14 / var(--viewport-width) * 100vw);
        line-height: 180%;
    }
    .block-tabs .tabs li {
        white-space: nowrap;
        font-size: calc(16 / var(--viewport-width) * 100vw);
    }
}