@charset "UTF-8";
@import url("reset.min.css");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&family=Roboto:wght@300;400;500&display=block');

@font-face {
    font-display: block;
    font-family: 'Nexa-Bold';
    src: url('../assets/fonts/font.woff2') format('woff2'), url('../assets/fonts/font.woff') format('woff');
}

* {
    box-sizing: border-box;
    outline: none;
}


/* ############ 
    VARIABLES
############### */

:root {
    --baseFontFmly: 'Roboto', sans-serif;
    --headingFontFmly: 'Nexa-Bold';
    --btnFontFmly: 'Nexa-Bold';
    --hLinkFontFmly: 'Nexa-Bold';
    --footrLinkFontFamly: 'Montserrat', sans-serif;
    --baseFontSze: 14px;
    --baseBGclr: #fff;
    --footrLinkClr: #878F9D;
    --placeholderClr: #87878E;
    --dodgerBlue: #0077FF;
    --baseBlue: #F8FAFD;
}



/* ############ 
    PLACEHOLDER
############### */

::-webkit-input-placeholder {
    color: var(--placeholderClr); /* Edge */
    font: 500 14px var(--baseFontFmly);
    letter-spacing: 0.25px;
}

:-ms-input-placeholder {
    color: var(--placeholderClr); /* Internet Explorer 10-11 */
    font: 500 14px var(--baseFontFmly);
    letter-spacing: 0.25px;
}

::-ms-input-placeholder {
    color: var(--placeholderClr);
    font: 500 14px var(--baseFontFmly);
    letter-spacing: 0.25px;
}

::placeholder, .placeholder {
    color: var(--placeholderClr);
    font: 500 14px var(--baseFontFmly);
    letter-spacing: 0.25px;
}

.form-control:-ms-input-placeholder {
    color: var(--placeholderClr); /* Internet Explorer 10-11 */
    font: 500 14px var(--baseFontFmly);
    letter-spacing: 0.25px;
}

.form-control::-ms-input-placeholder {
    font: 500 14px var(--baseFontFmly);
    color: var(--placeholderClr);
    letter-spacing: 0.25px;
}



/* ############ 
    UTILITY
############### */

.xs-show {
    display: none !important;
}

.sm-show {
    display: none !important;
}

.mt-70 {
    margin-top: 70px;
}

.ml-21 {
    margin-left: 21px;
}

.ml-24 {
    margin-left: 24px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-24 {
    margin-bottom: 24px;
}

.mb-28 {
    margin-bottom: 28px;
}

.mb-32 {
    margin-bottom: 32px;
}

.mb-33 {
    margin-bottom: 33px;
}

.mb-36 {
    margin-bottom: 36px;
}

.mb-37 {
    margin-bottom: 37px;
}

.bgclr--grdntblue {
    background: linear-gradient(0deg, rgba(0, 119, 255, 0.15), rgba(0, 119, 255, 0.15)), #FFFFFF;
}

.bgclr--grdntorange {
    background: linear-gradient(0deg, #FBEBC4, #FBEBC4), #FFFFFF;
}

.bgclr--blue {
    background-color: #0077FF;
}

.bgclr--blue--15 {
    background-color: rgba(0, 119, 255, 0.15);
}

.bgclr--lightblue {
    background-color: #D0E3F8;
}

.bgclr--pictonblue {
    background-color: #458DE5;
}

.bgclr--aliceblue {
    background-color: var(--baseBlue);
}

.bgclr--pink {
    background-color: #E75476;
}

.bgclr--pink--15 {
    background-color: rgba(255, 0, 97, 0.15);
}

.bgclr--purple {
    background-color: #A75EB4;
}

.bgclr--purple--20 {
    background-color: #E2CFF5;
}

.bgclr--alicepurple {
    background-color: #F6F1FC;
}

.bgclr--sun {
    background-color: #F9A70D;
}

.bgclr--eggsour {
    background-color: #FFF3DC;
}

.bgclr--ghostwhite {
    background-color: #F9F9FC;
}

.clr--blue {
    color: #0077FF;
}

.clr--pink {
    color: #E75476;
}

.clr--darkpink {
    color: #FF0061;
}

.clr--orange {
    color: #FAB61E;
}

.clr--sun {
    color: #F9A70D;
}

.clr--purple {
    color: #A75EB4;
}

.clr--purple--80 {
    color: #893FD5;
}

.fw-medimuRobo {
    font-weight: 500 !important;
}

.middle {
    margin: 0 auto;
}

.center {
    text-align: center;
}

.right {
    text-align: right;
}

.alignC--flxStrt {
    align-content: flex-start;
}

.justC--flxEnd {
    justify-content: flex-end;
}

.pull-left {
    margin-right: auto;
}

.wdth--100 {
    width: 100%;
}

.col-reverse {
    grid-auto-flow: dense;
}

.d-gray {
    color: #8E919C;
}

em {
    font-style: italic;
}

b {
    font-weight: 700;
}



/* ############ 
    GLOBAL
############### */

html, body {
    height: 100%;
    font-size: var(--baseFontSze);
}

body {
    font-family: var(--baseFontFmly);
    background-color: var(--baseBGclr);
}

a, a:hover, a:focus {
    text-decoration: none;
}

h1, h2, h3 {
    font-family: var(--headingFontFmly);
}

img {
    max-width: 100%;
    height: auto;
}

.video-cb {
    border: none;
    border-radius: 24px;
}

.block--auto {
    grid-template-columns: auto !important;
}



/* ############ 
    BUTTON
############### */

a.btn, a.btn:hover, a.btn:focus {
    text-decoration: none;
}

.btn, .hs-button {
    font-family: var(--btnFontFmly);
    display: inline-grid;
    min-height: 40px;
    align-content: center;
    text-align: center;
    border-radius: 24px;
    text-transform: uppercase;
    padding: 11px 24px;
    letter-spacing: 0.25px;
    color: #292A34;
    border: none;
    cursor: pointer;
}

.btn--white {
    background-color: #fff;
}

.btn--white:not(.base-clean) {
    box-shadow: 0 11px 35px rgba(0, 0, 0, 0.05);
}

.btn--blue, .hs-button {
    background-color: var(--dodgerBlue);
    color: #fff;
    box-shadow: 0 15px 25px rgba(0, 119, 255, 0.15);
}

.btn--purple {
    background-color: #893FD5;
    color: #fff;
    box-shadow: 0 15px 25px rgba(137, 63, 213, 0.15);
}

.btn--orange {
    background-color: #F9A70D;
    color: #fff;
    box-shadow: 0 15px 25px rgba(249, 167, 13, 0.15);
}

.base-clean {
    border: 1.5px solid #E9E9E9;
}



/* ############ 
    LINK BUTTON
############### */

.cta-link {
    font-family: var(--hLinkFontFmly);
    text-transform: uppercase;
    margin-right: auto;
    letter-spacing: 0.25px;
}

.cta-link svg {
    margin-left: 8px;
}



/* ############ 
    HEADER
############### */

header {
    margin-bottom: 9px;
    position: relative;
    z-index: 99;
}

.header {
    grid-template-columns: [logo] 140px [nav] auto;
    padding-top: 36px;
    padding-bottom: 36px;
    align-items: center;
    gap: 0 3.5%;
    position: relative;
    z-index: 1;
}

.brand {
    display: grid;
}

.brand img {
    max-width: 137px;
    height: auto;
}

.header .btn {
    max-width: 157px;
    margin-left: auto;
}

.menu {
    -ms-display: grid;
    display: flex;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: 0 32px;
    align-items: center;
}

.menu li {
    position: relative;
    list-style-type: none;
}

.menu li:last-child {
    margin-left: auto;
}

.menu > li > a:not(.btn) {
    font-weight: 500;
    color: #292A34;
    font-size: 18px;
    line-height: 24px;
}

.menu > li:hover > a + .submenu-wrppr, .menu > li:focus > a + .submenu-wrppr {
    display: block;
}

.submenu-wrppr {
    position: absolute;
    display: none;
    top: 100%;
    right: 0;
    padding-top: 5px;
}

.submenu {
    padding: 8px 0;
    background-color: #fff;
    box-shadow: 0 6px 11px rgb(0 0 0 / 20%), 0 4px 34px rgb(0, 0, 0, 0.12);
    border-radius: 8px;
}

.submenu > li > a {
    padding: 8px 16px;
    display: grid;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: #292A34;
}

.submenu li a:hover, .submenu li a:focus {
    background-color: #E8F1FC;
}

.hmbrgr {
    display: none;
    flex-flow: column nowrap;
    align-items: center;
    margin-left: auto;
    cursor: pointer;
    width: 24px;
    margin-right: -6px;
    padding: 12px 18px;
}

.hmbrgr-bar {
    width: 18px;
    height: 2px;
    background-color: #1E2439;
}

.hmbrgr-bar:not(:first-child) {
    margin-top: 3px;
}



/* ############ 
    FOOTER
############### */

.footer {
    min-height: 258px;
    display: grid;
    grid-template-columns: [brand] 40% [site-links] 60%;
    padding: 59px 0 35px !important;
}

.recognition {
    padding: 25px 0 0 18px;
}

.recognition a + a {
    margin-left: 15px;
}

.site-links {
    display: grid;
    grid-template-columns: [set-1] 38% [set-2] 28% [set-3] 30%;
    gap: 0 2%;
    margin-top: 18px;
}

.links-set {
    display: grid;
    gap: 24px 0;
    align-content: baseline;
}

.links-set a {
    font-family: var(--footrLinkFontFamly);
    font-weight: 500;
    color: var(--footrLinkClr);
    line-height: 21px;
    margin-right: auto;
}



/* ############ 
    COPYRIGHT
############### */

.copyright {
    background-color: var(--baseBlue);
    min-height: 62px;
    padding-top: 23px;
}

.copyright .block {
    align-items: center;
}

.copyright-txt {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    color: #878F9D;
    font-size: 12px;
}

.vt-social {
    display: grid;
    grid-template-columns: repeat(4, 8%);
    text-align: right;
    align-items: center;
    justify-content: flex-end;
}



/* ############ 
    WRAPPER / CONTAINER
############### */

.wrapper {
    display: grid;
    min-height: 900px;
    align-items: center;
}

.container {
    display: -ms-grid;
    display: grid;
    width: 100%;
    max-width: 1170px;
    height: 100%;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}



/* ############ 
    HOME page
############### */

/* === CAROUSEL - HOME === */
.carousel {
    min-height: 775px;
    display: grid;
    align-items: center;
    background: url('../assets/images/bg-carousel.png') no-repeat right 0;
}

.slider {
    display: grid;
    grid-template-columns: [content] 69% [img] 31%;
}

.container.slider {
    padding-right: 0;
}

.subtitle {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    color: #4F5059;
    font-size: 18px;
    line-height: 27px;
    display: block;
    text-transform: uppercase;
    margin: 28px 0 8px;
}

.slide-content .feature-title {
    letter-spacing: 1.14px;
    line-height: 77px;
    font-size: 60px;
}

.slide-content .feature-title:nth-child(2) {
    letter-spacing: 1.14px;
}

.slide-content .feature-title:nth-child(3) {
    font-size: 60px;
    letter-spacing: 0;
}

.carousel .col {
    align-content: flex-start;
}

.img-wrppr {
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    margin-top: 19%;
}

.btn-play {
    position: absolute;
    z-index: 5;
    cursor: pointer;
    fill: rgba(252, 234, 238, 0.60);
}

.videoask-cb {
    width: 95%;
    height: 600px;
    border: none;
    border-radius: 24px;
}

.slider-content {
    margin-top: 19%;
    min-width: 0;
}

.macbook-img {
    position: absolute;
    right: 0;
    top: -125px;
    height: 950px;
}

.carousel .btn {
    padding: 16px 32px;
    min-height: 50px;
    margin-right: auto;
    font-size: 14px; /*to override slider text property*/
    line-height: 18px; /*to override slider text property*/
}

.slide-content .feature-title {
    grid-area: 1/1/2/2;
}

/* HOME - ASPIRE LEADERBOARD */
.leaderboard {
    background-color: #DDEAF9;
    min-height: 533px;
}

.leaderboard .block {
    grid-template-columns: 23% 77%;
}

.leaderboard .feature-title {
    font-size: 42px;
    line-height: 52px;
    margin-bottom: 24px;
}

.leaderboard .cta-wrppr {
    justify-content: start;
}

.leaderboard .btn {
    min-height: 50px;
}

.leaderboard .btn + .btn {
    margin-left: 16px;
}

.leaderboard .btn--white {
    border: 2px solid #DDDEE1;
    box-shadow: 0px 15px 25px rgba(187, 187, 187, 0.15);
}


/* === CONTENT - HOME === */
.block {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.col {
    display: grid;
    align-content: center;
    position: relative;
}

.home .wrapper.sec-01 {
    min-height: 722px;
}

.sec-01 .feature-desc {
    max-width: 85%;
}

.bg-img {
    position: absolute;
    top: 0;
    bottom: 0;
    display: grid;
    right: 0;
    align-items: center;
    z-index: -1;
}

.bg-img--01 {
    background: url('../assets/images/bg-sec01.png') no-repeat center;
    left: -110px;
    top: 60px;
}

.main-img01 {
    height: auto;
    margin-left: -60px;
    margin-top: 15px;
}

.home .wrapper.sec-02 {
    min-height: 829px;
}

.home .wrapper.sec-02 .col:nth-of-type(1) {
    padding-left: 45px;
}

.home .wrapper.sec-02 .col:nth-of-type(2) {
    padding-top: 26px;
}

.sec-02 .feature-desc {
    max-width: 90%;
}

.bg-img--02 {
    background: url('../assets/images/bg-sec01.png') no-repeat 75% center;
    left: -170px;
    margin-top: 25px;
}

.main-img02 {
    max-width: 640px;
}

.icn-base {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-img03 {
    background: url('../assets/images/bg-highlight.png') no-repeat center 39px;
}

.bar {
    display: inline-grid;
    width: 48px;
    height: 3px;
}

.feature-title {
    font-size: 50px;
    line-height: 64px;
    color: #292A34;
}

.feature-title--ms {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 40px;
    line-height: 80px;
    letter-spacing: 0.71px;
}

h3.feature-title {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 0.714285px;
}

.feature-desc {
    font-weight: 300;
    font-size: 18px;
    line-height: 27px;
    color: #4F5059;
}

.feature-list li {
    margin-bottom: 8px;
    margin-left: 16px;
    padding-left: 24px;
    position: relative;
    line-height: 27px;
    font-size: 18px;
    color: #4F5059;
}

.feature-list li:before {
    content: '';
    width: 8px;
    height: 8px;
    background-color: #1E2439;
    display: inline-block;
    border-radius: 50%;
    vertical-align: top;
    margin-right: 16px;
    position: absolute;
    top: 7px;
    left: 0;
}

.home .wrapper.sec-03 {
    min-height: 782px;
}

.main-img03 {
    max-width: inherit;
    margin-left: -75px;
    margin-top: -5px;
}

.bg-img--03 {
    background: url('../assets/images/bg-sec01.png') no-repeat 0 center;
    left: -50px;
    top: 60px;
}

.home .wrapper.sec-03 .col:nth-of-type(2) {
    padding-left: 135px;
}

.home .wrapper.sec-03 .feature-desc {
    max-width: 90%;
}

.home .sec-post {
    margin-top: 100px;
}

.highlights {
    background-color: #0077FF;
    padding: 50px 0 62px;
}

.highlights .block {
    grid-template-columns: [content] 70% [cta] 30%;
}

.highlights-content {
    padding-left: 100px;
}

.highlights-content .feature-title {
    color: #fff;
}

.highlights-content .feature-desc {
    color: #dcdcdc;
}

.highlights-cta {
    padding-right: 100px;
}

.highlights-cta .btn {
    width: 165px;
    color: #0077FF;
    margin-left: auto;
    min-height: 48px;
}


/* ############ 
    VIDEOASK 
############### */
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 600px;
    width: 98%;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.toggleclose {
    display: none;
}

.close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 5;
}



/* ############ 
    PLATFORM page
############### */

/* === CAROUSEL - PLATFORM === */
.pltfrm .carousel {
    background: url('../assets/images/bg-carousel-pltfrm.png') no-repeat right 7px;
    position: relative;
}

.pltfrm .img-wrppr {
    margin-top: 0;
}

.pltfrm .img-wrppr img {
    position: absolute;
    top: -60px;
    left: -139px;
    max-width: inherit;
    z-index: 0;
}

.pltfrm .slider {
    grid-template-columns: [content] 55% [img] 45%;
}

.pltfrm .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}

.slider .btn.base-clean {
    border-width: 2px;
    border-color: #E8E9EB;
    filter: drop-shadow(0px 15px 25px rgba(0 119 255 / 15%));
}


/* === CONTENT - PLATFORM === */
.pltfrm .wrapper.sec-01 {
    min-height: 696px;
}

.pltfrm .wrapper.sec-01 .main-img02 {
    margin-left: 35px;
}

.pltfrm .wrapper.sec-02 {
    min-height: 780px;
}

.pltfrm .wrapper.sec-02 .bg-img--01 {
    background-position: center 92px;
    left: -130px;
}

.pltfrm .wrapper.sec-02 .main-img01 {
    margin-left: 32px;
}

.pltfrm .wrapper.sec-02 .feature-title {
    max-width: 95%;
}

.pltfrm .sec-02 .feature-desc {
    max-width: 91%;
}

.pltfrm .wrapper.sec-03 {
    min-height: 849px;
}

.pltfrm .sec-03 .feature-desc {
    max-width: 95%;
}

.pltfrm .sec-03 .feature-list {
    max-width: 98%;
}



/* ############ 
    BLOG POST
############### */

.home .sec-post, .pltfrm .sec-post {
    min-height: 846px;
}

.sec-post {
    background-color: var(--baseBlue);
    padding: 105px 0 100px;
}

.sec-post .feature-desc {
    max-width: 775px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 49px;
}

.card-wrapper {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 458px));
    gap: 0 30px;
    justify-content: center;
    background: url('../assets/images/bg-post.png') no-repeat center 0 / 100%;
    align-content: start;
}

.card-container {
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-end;
    background-color: #FFFFFF;
    box-shadow: 0px 11px 35px rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    width: 100%;
    max-width: 458px;
    align-content: flex-start;
    overflow: hidden;
    height: 100%; /*to fix decreasing height due to wrapping anchor tag*/
}

.sec-post .feature-title--ms {
    margin-bottom: 49px;
}

.photo-wrppr {
    max-height: 272px;
    overflow: hidden;
}

.card-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0.321429px;
    margin: 19px 47px 3px 26px;
    color: #292A34;
    height: 100%;
}

.card-desc {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    color: #4F5059;
    margin: 0 25px 15px 26px;
}

.link-wrppr {
    display: flex;
    flex-flow: column nowrap;
}

.card-footer {
    border-top: 1px solid #F8F1FA;
    padding: 18px 0 21px 0;
    margin: 0 24px 0 26px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    align-self: stretch;
}

.crd-ftr-lbl {
    font-family: 'Montserrat', sans-serif;
}

.badge {
    display: inline-grid;
    border-radius: 15px;
    padding: 7px 13px;
    font-size: 12px;
    line-height: 14px;
}

.inner-post {
    min-height: 687px;
    padding: 128px 0 0;
}

.inner-post .card-title {
    margin-top: 33px;
    margin-bottom: 32px;
}

.hide {
    display: none;
}

.card-title.blog {
    min-height: 54px;
    /* max-height: 54px; */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

#getBlog .badge {
    text-transform: capitalize;
}

#getBlog .photo-wrapper {
    max-height: 272px;
    overflow: hidden;
}

#getBlog .card-desc {
    max-height: 50px;
    min-height: 50px;
    overflow: hidden;
}


/* ############ 
    PLATFORM > BRIDGE (HARMONY) page
############### */

/* === CAROUSEL - BRIDGE (HARMONY) === */
.hrmny .carousel {
    background: url('../assets/images/bg-carousel-pltfrm.png') no-repeat right 7px;
    position: relative;
}

.hrmny .carousel .slider-content {
    margin-top: 142px;
}

.hrmny .carousel .subtitle {
    margin: 0;
}

.hrmny .img-wrppr {
    margin-top: 0;
}

.hrmny .img-wrppr img {
    position: absolute;
    top: -60px;
    left: -139px;
    max-width: inherit;
    z-index: 0;
}

.hrmny .slider {
    grid-template-columns: [content] 55% [img] 45%;
}

.hrmny .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
    max-width: 450px;
}


/* === CONTENT - BRIDGE (HARMONY) === */
.hrmny .wrapper.sec-01 {
    min-height: 696px;
}

.hrmny .wrapper.sec-01 .col:nth-child(2) {
    padding-left: 40px;
}

.hrmny .sec-01 .feature-desc {
    max-width: inherit;
}

.hrmny .wrapper.sec-02 {
    min-height: 780px;
}

.hrmny .wrapper.sec-02 .col:nth-child(1) {
    margin-left: -15px;
}

.hrmny .wrapper.sec-02 .bg-img--01 {
    background-position: center 92px;
    left: -115px;
}

.hrmny .wrapper.sec-02 .main-img01 {
    margin-left: 25px;
}

.hrmny .wrapper.sec-02 .feature-title {
    max-width: 95%;
}

.hrmny .sec-02 .feature-list {
    max-width: 95%;
}

.hrmny .wrapper.sec-03 {
    min-height: 611px;
}

.hrmny .wrapper.sec-03 .main-img02 {
    margin-left: -20px;
}

.hrmny .wrapper.sec-03 .col:nth-child(2) {
    padding-left: 10px;
}

.hrmny .sec-03 .feature-desc {
    max-width: 92%;
}



/* ############ 
    PLATFORM > WORK SIMPLY
############### */

/* === CAROUSEL - WORK SIMPLY === */
.wrksmply .carousel {
    background: url('../assets/images/bg-carousel-gtf.png') no-repeat right 16px / 50%;
    padding-top: 54px;
}

.wrksmply .carousel .slider-content {
    margin-top: 54px;
    margin-left: 0;
    margin-right: 10px;
}

.wrksmply .carousel .subtitle {
    margin: 0;
}

.wrksmply .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.wrksmply .img-wrppr img {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    max-width: 630px;
}

.wrksmply .slider {
    grid-template-columns: [content] 38% [img] 62%;
}

.wrksmply .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}

.wrksmply .app-usp {
    padding: 0px 12px;
}



/* ############ 
    PLATFORM > SCALE UP
############### */

/* === CAROUSEL - SCALE UP === */
.scaleup .carousel {
    background: url('../assets/images/bg-carousel-collbort.png') no-repeat right 16px / 49%;
    padding-top: 54px;
}

.scaleup .carousel .slider-content {
    margin-top: 56px;
    margin-left: 0;
    margin-right: 10px;
}

.scaleup .carousel .subtitle {
    margin: 0;
}

.scaleup .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.scaleup .img-wrppr img {
    position: absolute;
    top: 70px;
    right: -20px;
    z-index: 0;
    max-width: 750px;
}

.scaleup .slider {
    grid-template-columns: [content] 38% [img] 62%;
}

.scaleup .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}



/* ############ 
    PLATFORM > COMMUNICATE EFFORTLESSLY
############### */

/* === CAROUSEL - COMMUNICATE EFFORTLESSLY === */
.comuncat .carousel {
    background: url('../assets/images/bg-carousel-raq.png') no-repeat right 0 / 46%;
    padding-top: 54px;
}

.comuncat .carousel .slider-content {
    margin-top: 65px;
    margin-left: 0;
    margin-right: 10px;
}

.comuncat .carousel .subtitle {
    margin: 0;
}

.comuncat .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.comuncat .img-wrppr img {
    position: absolute;
    top: 0;
    right: -70px;
    z-index: 0;
    max-width: 630px;
}

.comuncat .slider {
    grid-template-columns: [content] 38% [img] 62%;
}

.comuncat .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}

.comuncat .app-usp {
    padding: 0px 12px;
}



/* ############ 
    PLATFORM > BRIDGE (HARMONY) > GET ON SAME PAGE page, EXPEDITE APPROVALS page
############### */

/* === CAROUSEL - GET ON SAME PAGE, EXPEDITE APPROVALS === */

.gosp .carousel {
    background: url('../assets/images/bg-carousel-gtf.png') no-repeat right 0;
    padding-top: 110px;
}

.col-reverse .col:nth-child(1) {
    grid-column-start: 2;
}

.gosp .carousel .slider-content {
    margin-top: 95px;
    margin-left: 50px;
    margin-right: 10px;
}

.gosp .carousel .subtitle {
    margin: 0;
}

.gosp .carousel .feature-desc {
    max-width: 95%;
}

.gosp .img-wrppr {
    margin-top: 0;
}

.gosp .img-wrppr img {
    position: absolute;
    top: -10px;
    left: 0;
    z-index: 0;
    max-width: 760px;
}

.gosp .slider {
    grid-template-columns: [content] 55% [img] 45%;
}

.gosp .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}



/* ############ 
    PLATFORM > BRIDGE (HARMONY) > COLLABORATE SEAMLESSLY
############### */

/* === CAROUSEL - COLLABORATE SEAMLESSLY === */
.collbort .carousel {
    background: url('../assets/images/bg-carousel-collbort.png') no-repeat right 16px;
    padding-top: 153px;
}

.collbort .carousel .slider-content {
    margin-top: 112px;
    margin-left: 15px;
    margin-right: 10px;
}

.collbort .carousel .subtitle {
    margin: 0;
}

.collbort .carousel .feature-desc {
    max-width: 400px;
}

.collbort .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.collbort .img-wrppr img {
    position: absolute;
    top: 32px;
    left: 0;
    z-index: 0;
    max-width: 760px;
}

.collbort .slider {
    grid-template-columns: [content] 40% [img] 60%;
}

.collbort .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}



/* ############ 
    PLATFORM > BRIDGE (HARMONY) > EXPEDITE APPROVALS page
############### */

/* === CAROUSEL - EXPEDITE APPROVALS page === */
.expapprov .carousel {
    background: url('../assets/images/bg-carousel-raq.png') no-repeat right 0;
}

.expapprov .img-wrppr img {
    top: 62px;
    left: 50px;
}

.expapprov .carousel .slider-content {
    margin-top: 105px;
    margin-left: 70px;
    margin-right: 0;
}



/* ############ 
    PLATFORM > ARRANGE (CONDUCTOR) page
############### */

/* === CAROUSEL - ARRANGE (CONDUCTOR) === */
.cnductr .carousel {
    background: url('../assets/images/bg-carousel-pltfrm.png') no-repeat right 7px;
    position: relative;
}

.cnductr .img-wrppr {
    margin-top: 0;
}

.cnductr .img-wrppr img {
    position: absolute;
    top: -60px;
    left: -139px;
    max-width: inherit;
    z-index: 0;
}

.cnductr .slider {
    grid-template-columns: [content] 55% [img] 45%;
}

.cnductr .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}


/* === CONTENT - ARRANGE (CONDUCTOR) === */
.cnductr .wrapper.sec-01 {
    min-height: 780px;
}

.cnductr .wrapper.sec-01 .bg-img--01 {
    background: url(../assets/images/bg-blue.png) no-repeat center;
    top: -40px;
    left: -150px;
}

.cnductr .wrapper.sec-01 .main-img02 {
    margin-left: -35px;
}

.cnductr .wrapper.sec-01 .contnt {
    padding-left: 10px;
}

.cnductr .wrapper.sec-02 {
    min-height: 696px;
}

.cnductr .wrapper.sec-02 .main-img01 {
    margin: 40px auto 0;
}

.cnductr .wrapper.sec-02 .feature-title {
    max-width: 95%;
}

.cnductr .sec-02 .feature-desc {
    max-width: 92%;
}

.cnductr .wrapper.sec-03 {
    min-height: 780px;
}

.cnductr .wrapper.sec-03 .bg-img--01 {
    background: url(../assets/images/bg-orange.png) no-repeat center;
    right: 30px;
    top: 65px;
}

.cnductr .wrapper.sec-03 .main-img02 {
    margin-left: -60px;
}

.cnductr .wrapper.sec-03 .contnt {
    padding-left: 42px;
}

.cnductr .sec-03 .feature-desc {
    max-width: 95%;
}

.cnductr .sec-03 .feature-list {
    max-width: 98%;
}

.cnductr .sec-03 .feature-list li {
    margin-left: 24px;
}



/* ############ 
    PLATFORM > ARRANGE (CONDUCTOR) > GO TEMPLATE FREE
############### */

/* === CAROUSEL - GO TEMPLATE FREE === */
.gtf .carousel {
    background: url('../assets/images/bg-carousel-gtf.png') no-repeat right 16px / 56%;
    padding-top: 54px;
}

.gtf .carousel .slider-content {
    margin-top: 144px;
    margin-left: 15px;
    margin-right: 10px;
}

.gtf .carousel .subtitle {
    margin: 0;
}

.gtf .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.gtf .img-wrppr img {
    position: absolute;
    top: 45px;
    right: -35px;
    z-index: 0;
    max-width: 760px;
}

.gtf .slider {
    grid-template-columns: [content] 40% [img] 60%;
}

.gtf .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}



/* ############ 
    PLATFORM > ARRANGE (CONDUCTOR) > TRANSLATE CODE INTO MEANINGFUL DATA
############### */

/* === CAROUSEL - TRANSLATE CODE INTO MEANINGFUL DATA === */
.tcmd .carousel {
    background: url('../assets/images/bg-carousel-collbort.png') no-repeat right 16px;
    padding-top: 54px;
}

.tcmd .carousel .slider-content {
    margin-top: 112px;
    margin-left: 15px;
    margin-right: 10px;
}

.tcmd .carousel .subtitle {
    margin: 0;
}

.tcmd .carousel .feature-desc {
    max-width: 450px;
}

.tcmd .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.tcmd .img-wrppr img {
    position: absolute;
    top: 70px;
    left: 0;
    z-index: 0;
    max-width: 760px;
}

.tcmd .slider {
    grid-template-columns: [content] 45% [img] 55%;
}

.tcmd .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}



/* ############ 
    PLATFORM > ARRANGE (CONDUCTOR) > REVIEW & ADJUST QUICKLY
############### */

/* === CAROUSEL - REVIEW & ADJUST QUICKLY === */
.raq .carousel {
    background: url('../assets/images/bg-carousel-raq.png') no-repeat right 16px;
    padding-top: 54px;
}

.raq .carousel .slider-content {
    margin-top: 135px;
    margin-left: 15px;
    margin-right: 10px;
}

.raq .carousel .subtitle {
    margin: 0;
}

.raq .carousel .feature-desc {
    max-width: 430px;
}

.raq .img-wrppr {
    margin-top: 0;
    margin-left: 5px;
}

.raq .img-wrppr img {
    position: absolute;
    top: 60px;
    left: 0;
    z-index: 0;
    max-width: 760px;
}

.raq .slider {
    grid-template-columns: [content] 45% [img] 55%;
}

.raq .slide-content .feature-title {
    letter-spacing: 0;
    line-height: 72px;
    font-size: 62px;
}



/* ############ 
    CONTENT USP
############### */
.wrppr-usp {
    min-height: 788px;
    padding-top: 109px;
    align-content: start;
}

.wrppr-usp .feature-title {
    margin-bottom: 100px;
    letter-spacing: 0.89px;
}

.block.of-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.app-usp {
    text-align: center;
    padding: 0px 15px;
}

.path {
    position: relative;
}

.path:after {
    content: '';
    background: url(../assets/images/path.png) no-repeat 0 0;
    display: inline-block;
    position: absolute;
    top: 60px;
    right: -210px;
    width: 151px;
    height: 27px;
}

.flip:after {
    transform: scaleX(1) scaleY(-1);
    top: 30px;
}

.app-usp .icn-base {
    margin: 0 auto 27px;
    width: 105px;
    height: 105px;
}

.usp-title {
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0.32px;
}

.usp-desc {
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
}

.contact {
    text-align: center;
    position: relative;
    margin-top: 53px;
}

.contact:before {
    content: '';
    display: inline-block;
    width: 80px;
    height: 1px;
    background-color: #E7EBEF;
    margin-bottom: 56px;
}

.contact p {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.29px;
    font-family: var(--headingFontFmly);
    margin-bottom: 10px;
}

.contact .btn {
    max-width: 165px;
    width: 100%;
    color: #878F9D;
}



/* ############ 
    ABOUT page
############### */

.abt .carousel {
    background: none;
    min-height: 528px;
}

.abt .slider {
    grid-template-columns: [img] 100%;
}

.abt .carousel .col {
    align-content: center;
}

.abt .slider .img-wrppr {
    margin-top: 0;
}

.logo-focus {
    width: 685px;
    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.06)) drop-shadow(0px 4px 32px rgba(0, 0, 0, 0.08));
}

.abt .wrapper.sec-01 {
    align-content: flex-start;
}

.abt .wrapper.sec-01 .feature-title {
    font-size: 48px;
    margin: 70px 0 20px;
}

.abt .desc {
    font-size: 18px;
    line-height: 27px;
    font-weight: 400;
    margin-top: 25px;
}

.abt .wrapper.sec-01 .feature-title + p.desc {
    margin-top: 0;
}

.abt .card-wrapper {
    background: none;
    margin: 91px 0 26px;
}

.abt .card-wrapper .card-title {
    margin-top: 33px;
    margin-bottom: 32px;
}


.abt .highlights {
    margin-top: 75px;
}



/* ############ 
    CUSTOMER STORIES page
############### */

.cusstrie .carousel {
    min-height: 577px;
}

.cusstrie.strie-drp .carousel {
    background: #C890F5 none;
}

.cusstrie.strie-dcp .carousel {
    background: #6398D7 none;
}

.cusstrie .slider {
    grid-template-columns: [img] 100%;
}

.cusstrie .carousel .col {
    align-content: end;
}

.cusstrie .slider .img-wrppr {
    margin-top: 0;
}

.cusstrie .wrapper.sec-01 {
    align-content: flex-start;
}

.inline-nav {
    display: grid;
    grid-template-columns: max-content;
}

.inline-nav a {
    font-size: 18px;
    display: inline-grid;
    grid-auto-flow: column;
    grid-gap: 0 8px;
    color: #626674;
    align-items: center;
}

.cta-wrppr {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
}

.cusstrie .wrapper.sec-01 .feature-title {
    font-size: 48px;
    margin-bottom: 25px;
    color: #2D3748;
}

.cusstrie .desc {
    font-size: 18px;
    line-height: 27px;
    font-weight: 400;
    margin-top: 30px;
    color: #2D3748;
}

.cusstrie .wrapper.sec-01 .feature-title + p.desc {
    margin-top: 0;
}

.cusstrie .wrapper.sec-01 .btn {
    min-height: 50px;
}

.cusstrie footer {
    margin-top: 80px;
}



/* ############ 
    BOOK A DEMO page
############### */

.wrapper--demo {
    min-height: 788px;
    background: url('../assets/images/bg-demo.png') no-repeat left -110px;
}

.wrapper--demo .block {
    grid-template-columns: 60% 40%;
}

.wrapper--demo .container .col {
    padding-top: 115px;
    align-content: flex-start;
}

.form-container {
    justify-content: right;
}

.demo-form {
    width: 100%;
    max-width: 473px;
    min-width: 473px;
    height: auto;
    background: #FFF;
    box-shadow: 0 11px 35px rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    padding: 37px 59px 34px 60px;
    margin-right: 89px;
}

.block-title {
    font-size: 22px;
    line-height: 27px;
    letter-spacing: 0.392857px;
}

.form-control, .hs-input {
    font: 500 14px var(--baseFontFmly);
    width: 100%;
    height: 48px;
    max-width: 354px;
    border-radius: 24px;
    border: 2px solid #E9E9E9;
    padding-left: 24px;
    padding-right: 24px;
}

.custom-appearance {
    position: relative;
}

.custom-appearance select {
    appearance: none;
    position: relative;
    z-index: 1;
    background-color: transparent;
}

.custom-appearance:after {
    content: '';
    width: 10px;
    height: 10px;
    border-width: 0 0 1px 1px;
    border-style: solid;
    border-color: #C2C2C2;
    display: inline-block;
    position: absolute;
    right: 35px;
    top: 16px;
    transform: rotate(-45deg);
    z-index: 0;
}

.contact-no {
    display: none;
}

.contact-no span:nth-of-type(1) {
    font-family: var(--headingFontFmly);
    color: var(--footrLinkClr);
}

.contact-no span:nth-of-type(2) {
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0.32px;
    color: var(--dodgerBlue);
}

.contact-links {
    display: flex;
    flex-direction: column;
    margin-left: 23px;
    margin-top: 37px;
}

.contact-options li {
    font-weight: 500;
    line-height: 24px;
    font-size: 16px;
    display: grid;
    grid-template-columns: 11% 45%;
    align-items: center;
    gap: 15px;
}

.contact-options li a + a {
    color: var(--dodgerBlue);
}

.contact-options li:not(:first-child) {
    margin-top: 30px;
}

.contact-options .icn-base {
    width: 48px;
    height: 48px;
    background-color: var(--baseBlue);
}

#demoForm .form-columns-1, #demoForm .form-columns-2 {
    margin-bottom: 14px;
}

#demoForm .form-columns-2 .hs-form-field:nth-of-type(1) {
    margin-bottom: 14px;
}

#demoForm fieldset.form-columns-1 .input, #demoForm fieldset.form-columns-2 .input {
    margin-right: 0;
}

#demoForm fieldset.form-columns-1 .hs-input {
    width: 100%;
}

#demoForm fieldset.form-columns-2 .hs-form-field {
    width: 100%;
}

.hs-button {
    width: 100%;
    margin-bottom: 28px;
}

.hs-error-msgs {
    color: red;
    font-weight: 500;
    padding: 5px 0 0 25px;
}

.hs_error_rollup {
    display: none;
}

.submitted-message {
    margin-bottom: 28px;
    overflow: visible !important;
}



/* ############ 
    ABM - LANDING page
############### */
.abm .carousel {
    background: none;
    padding-bottom: 40px;
    min-height: 730px;
}

.abm .carousel .slider > .col {
    align-content: center;
}

.abm .carousel .slider {
    grid-template-columns: [content] 65% [img] 35%;
}

.abm .slider .block.of-three {
    gap: 0 20px;
}

.abm .video-cb {
    margin-right: 20px;
    width: 300px;
    height: 539px;
}

.btn-abm {
    border-radius: 5px;
    padding: 19px 38px;
    font-size: 16px;
    text-transform: none;
    box-shadow: none;
}

.abm .slider .feature-title {
    font-size: 45px;
}

.benefits .col {
    align-content: flex-start;
}

.benefit-pic {
    max-height: 125px;
    margin: 0 auto;
}

.benefit-desc {
    max-width: 200px;
    margin: 10px auto 0;
    line-height: 1.75;
    text-align: center;
}

.abm .sec-01 {
    min-height: 350px;
}

.abm .sec-01 .feature-title {
    font-size: 40px;
}



/* ############ 
    MEDIA QUERIES - RESPONSIVE
############### */

/* === 
    iPAD PRO LANDSCAPE only
=== */
@media all and (device-width: 1024px) and (device-height: 1366px) and (orientation:portrait) {
    /* HEADER */
    .header {
        gap: 0 0.5%;
    }
}


/* === 
    iPAD LANDSCAPE only
=== */
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
    /* HEADER */
    .header {
        gap: 0 0.5%;
    }

    /* HOME */
    .home .main-img01 {
        margin-left: -20px;
    }

    .home .main-img03 {
        margin-left: 0;
    }

    .abm .carousel .slider {
        grid-template-columns: [content] 69% [img] 31%;
    }

    .abm .carousel .slider .toggleclose {
        top: 8%;
    }

    #div-mob, #div-mob {
        padding-right: 15px;
    }

    .videoask-cb:not(iframe), .abm .video-cb {
        width: 298px;
        height: 522px;
        margin: 50px auto 20px;
    }

    .img-wrppr {
        margin-top: 0;
    }

    .toggleclose {
        right: 5%;
        top: 1%;
    }

    /* PLATFORM, BRIDGE, ARRANGE */
    .macbook-img {
        top: -80px;
        height: 800px;
    }

    .pltfrm .wrapper.sec-01 .main-img02 {
        margin-left: -50px;
    }

    .pltfrm .wrapper.sec-01 .feature-list {
        max-width: 85%;
    }

    .pltfrm .wrapper.sec-02 .main-img01 {
        margin-left: 0;
    }

    .pltfrm .wrapper.sec-02 .col:nth-of-type(2) {
        padding-left: 10%;
    }

    .pltfrm .sec-03 .feature-desc {
        max-width: 85%;
    }

    .pltfrm .sec-03 .feature-list {
        max-width: 85%;
    }

    .pltfrm .sec-03 .main-img02 {
        margin-left: -14%;
    }

    .cnductr .wrapper.sec-01 .main-img02 {
        margin-left: 0;
    }

    .cnductr .wrapper.sec-01 .contnt {
        padding-left: 15%;
    }

    .cnductr .wrapper.sec-03 .main-img02 {
        margin-left: 0;
        max-width: 102%;
    }

    .hrmny .wrapper.sec-01 .col:nth-child(2) {
        padding-left: 100px;
    }

    .hrmny .wrapper.sec-02 .col:nth-child(1) {
        margin-left: 0;
    }

    .hrmny .wrapper.sec-02 .main-img01 {
        margin-left: 0;
    }

    .hrmny .sec-02 .feature-list {
        max-width: 85%;
    }

    .hrmny .wrapper.sec-03 .main-img02 {
        margin-left: 0;
    }

    .hrmny .wrapper.sec-03 .col:nth-child(2) {
        padding-left: 20%;
    }

    /* BREAKOUT PAGES */
    .container.slider {
        overflow: hidden;
    }

    .gtf .img-wrppr img {
        max-width: 660px;
    }

    .gosp .img-wrppr img {
        max-width: 560px;
    }

    .expapprov .img-wrppr img {
        left: 20px;
    }
}

/* === 
    iPAD AIR LANDSCAPE only
=== */
@media all and (device-width: 1180px) and (device-height: 820px) and (orientation:landscape) {
    .main-img03 {
        margin-left: -10px !important;
        max-width: 700px !important;
    }
}

/* === 
    iPAD AIR PORTRAIT only
=== */
@media all and (device-width: 820px) and (device-height: 1180px) and (orientation:portrait) {
    .header {
        gap: 0 2.5%;
    }
}

/* === 
    iPHONE XR LANDSCAPE | iPAD AIR PORTRAIT 
=== */
@media screen and (min-width: 812px), screen and (max-width: 820px) {
    .main-img02 {
        max-width: 100%;
    }

    .main-img03 {
        margin-left: -30px;
        max-width: 550px;
    }
}

/* === 
    iPHONE 5/SE | 6/7/8 | 6/7/8 PLUS PROTRAIT & LANDSCAEP, iPHONE X, iPAD PORTRAIT 
=== */
@media screen and (max-width: 736px), screen and (max-width: 768px), screen and (max-width: 812px) {
    .xs-hide {
        display: none !important;
    }

    .xs-show {
        display: flex !important;
    }

    .menu .xs-show a {
        flex: 1;
    }


    /* GLOBAL */
    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    .col {
        align-content: normal;
    }

    .block {
        grid-template-columns: auto;
    }

    img {
        max-width: 100% !important;
    }

    .btn {
        width: 100%;
    }

    .feature-title {
        font-size: 40px;
        line-height: 52px;
        margin-bottom: 24px;
    }


    /* HEADER */
    .header {
        padding-top: 16px;
        padding-bottom: 16px;
        margin-bottom: 0;
    }


    /* MOBILE MENU */
    nav {
        position: relative;
    }

    .hmbrgr {
        display: flex;
    }

    .menu {
        display: none;
        position: absolute;
        top: 100%;
        left: auto;
        right: 0;
        flex-flow: column;
        align-items: start;
        background-color: #fff;
        padding: 8px 0;
        border-radius: 8px;
        box-shadow: 0px 4px 34px rgba(0, 0, 0, 0.12), 0px 6px 11px rgba(0, 0, 0, 0.2);
        z-index: 999;
    }

    .menu li {
        align-self: normal;
    }

    .menu li:nth-child(7) {
        order: 8;
    }

    .menu li:last-child {
        margin-left: inherit;
        order: 7;
    }

    .menu > li > a {
        line-height: 28px !important;
        padding: 8px 16px;
        display: block;
    }

    .menu > li > a.btn {
        border: none;
        max-width: inherit;
        margin-right: auto;
        margin-left: inherit;
        min-height: auto;
        font-family: var(--baseFontFmly);
        font-weight: 500;
        font-size: 18px;
        text-transform: inherit;
        text-align: left;
        padding: 8px 16px;
        border-radius: 0;
    }

    .menu > li > a.active {
        background-color: #E8F1FC;
    }

    .hmbrgr.active + .menu {
        display: flex;
    }


    /* HOME - CAROUSEL */
    .container.slider {
        padding-left: 0;
        padding-right: 0;
    }

    .carousel {
        background: none;
    }

    .slider {
        grid-template-columns: repeat(2, minmax(100%, 1fr));
        grid-auto-flow: dense;
        padding: 0;
    }

    .slider .col:nth-child(1) {
        grid-row: 2;
        padding: 0 24px;
    }

    .slider-content {
        margin-top: 0;
    }

    .carousel .slide-content .feature-title {
        line-height: 54px;
        font-size: 44px;
    }

    .videoask-cb, .abm .video-cb {
        margin-top: 0;
        border-radius: 0 !important;
        width: 100%;
    }

    .home .carousel .btn {
        margin-bottom: 32px;
    }

    .mob-wrppr {
        display: flex;
        flex-flow: column nowrap;
        position: relative;
    }

    #div-mob {
        display: flex;
        flex-flow: column nowrap;
    }

    .home .container.slider #div-mob, .abm .container.slider #div-mob {
        margin-top: 0;
        overflow: hidden;
    }

    .home .container.slider .video, .abm .container.slider .video {
        margin-top: -35px;
    }

    .pull-up {
        margin-top: -290px;
    }

    .abm .pull-up {
        padding-top: 90px !important;
    }

    .slider .col:nth-child(1) {
        position: relative;
        z-index: 1;
    }

    /* HOME - ASPIRE LEADERBOARD */
    .leaderboard {
        padding: 75px 0;
    }

    .leaderboard .block {
        grid-template-columns: auto;
    }

    .leaderboard .block .col:nth-child(1) img {
        margin: 0 auto 50px;
    }

    .leaderboard .cta-wrppr {
        grid-auto-flow: row;
        grid-template-columns: 100%;
    }

    .leaderboard .btn + .btn {
        margin-left: 0;
        margin-top: 20px;
    }

    /* HOME - CONTENT */
    .home .wrapper.sec-01 {
        min-height: 566px;
        margin-top: 32px;
    }

    .home .wrapper.sec-01 .col:nth-child(1) {
        margin: 0px -15px;
    }

    .bg-img--01 {
        display: none;
    }

    .main-img01 {
        margin-left: 0;
    }

    .home .wrapper.sec-01 .bar {
        margin-top: 40px;
    }

    .sec-01 .feature-desc {
        max-width: inherit;
    }

    .home .wrapper.sec-02 {
        margin-top: 112px;
    }

    .home .wrapper.sec-02 .container {
        background: url('../assets/images/bg-sec01-xs.png') no-repeat center 62%;
    }

    .home .wrapper.sec-02 .col:nth-of-type(1) {
        padding-left: 0;
    }

    .home .wrapper.sec-02 .col:nth-of-type(2) {
        grid-row: 1;
        padding-top: 0;
    }

    .bg-img--02 {
        display: none;
    }

    .home .wrapper.sec-02 .main-img02 {
        max-width: 115% !important;
        margin-left: -32px;
    }

    .home .wrapper.sec-02 .icn-base {
        margin-top: 27px;
    }

    .home .wrapper.sec-02 .feature-desc {
        max-width: inherit;
    }

    .bg-img--03 {
        display: none;
    }

    .main-img03 {
        margin-top: 125px;
        margin-left: 0;
    }

    .home .wrapper.sec-03 .container {
        background: url('../assets/images/bg-sec01.png') no-repeat 0 100%;
        padding-bottom: 160px;
    }

    .home .wrapper.sec-03 .col:nth-of-type(1) {
        margin: 0 -20px;
    }

    .home .wrapper.sec-03 .col:nth-of-type(2) {
        padding-left: 0;
    }

    .home .wrapper.sec-03 .bar {
        margin-top: 35px;
    }

    .home .sec-post {
        margin-top: 0;
    }


    /* PLATFORM. ARRANGE, BRIDGE - CAROUSEL */
    .pltfrm .carousel, .cnductr .carousel, .hrmny .carousel {
        background-image: url(../assets/images/bg-carousel-pltfrm-xs.png);
        background-position: center 100%;
        min-height: 925px;
    }

    .pltfrm .slider, .cnductr .slider, .hrmny .slider {
        grid-template-columns: repeat(2, minmax(100%, 1fr));
        grid-auto-flow: dense;
        position: relative;
    }

    .pltfrm .slider .col:nth-child(1), .cnductr .slider .col:nth-child(1), .hrmny .slider .col:nth-child(1) {
        position: relative;
        z-index: 1;
    }

    .pltfrm .slider .slider-content, .cnductr .slider .slider-content, .hrmny .slider .slider-content {
        margin-top: -18%;
    }

    .macbook-img {
        top: -100px;
        height: 650px;
        z-index: 0;
        margin-top: 27px;
        max-width: inherit !important;
    }

    .pltfrm .slider .slider-content .feature-title, .cnductr .slider .slider-content .feature-title, .hrmny .slider .slider-content .feature-title {
        margin-bottom: 32px;
    }

    .slider .btn.base-clean {
        background-color: #fff;
        margin-left: 0;
        margin-top: 16px;
    }

    /* PLATFORM, ARRANGE, BRIDGE  - CONTENT */
    .pltfrm .wrapper.sec-01, .cnductr .wrapper.sec-01, .hrmny .wrapper.sec-01 {
        margin-top: -210px;
        align-content: start;
        min-height: auto;
        margin-bottom: 88px;
    }

    .pltfrm .wrapper.sec-01 .col:nth-of-type(2), .cnductr .wrapper.sec-01 .col:nth-of-type(1), .hrmny .wrapper.sec-01 .col:nth-of-type(1) {
        display: none;
    }

    .pltfrm .wrapper.sec-02, .cnductr .wrapper.sec-02, .hrmny .wrapper.sec-02 {
        align-content: start;
        min-height: auto;
        margin-bottom: 88px;
    }

    .pltfrm .wrapper.sec-02 .col:nth-of-type(1), .cnductr .wrapper.sec-02 .col:nth-of-type(2), .hrmny .wrapper.sec-02 .col:nth-of-type(2) {
        display: none;
    }

    .pltfrm .sec-02 .feature-desc, .cnductr .sec-02 .feature-desc, .hrmny .sec-02 .feature-desc {
        max-width: inherit;
    }

    .pltfrm .wrapper.sec-03, .cnductr .wrapper.sec-03, .hrmny .wrapper.sec-03 {
        align-content: start;
        background: url('../assets/images/bg-sec01-xs.png') no-repeat center 0;
        min-height: auto;
        padding-bottom: 88px;
    }

    .pltfrm .wrapper.sec-03 .col:nth-of-type(2), .cnductr .wrapper.sec-03 .col:nth-of-type(1), .hrmny .wrapper.sec-03 .col:nth-of-type(1) {
        display: none;
    }

    .sec-post:not(.inner-post) .card-container + .card-container {
        margin-top: 32px;
        height: auto;
    }

    .home .sec-post .feature-title--ms, .pltfrm .sec-post .feature-title--ms {
        margin-bottom: 0;
    }

    .sec-post .card-wrapper a.link-wrppr {
        margin-bottom: 0;
    }


    /* ARRANGE (CONDUCTOR) */
    .cnductr .slider .slider-content {
        margin-top: -35%;
    }

    .cnductr .wrapper.sec-03 .contnt {
        padding-left: 0;
    }

    .cnductr .wrapper.sec-02 .bgclr--purple--20 {
        background-color: #F6F1FC;
    }


    /* BRIDGE (HARMONY) */
    .hrmny .slider .slider-content .subtitle {
        margin: 28px 0 8px;
    }

    .hrmny .slide-content .feature-title {
        max-width: inherit;
    }

    .hrmny .wrapper.sec-01 .col:nth-child(2) {
        padding-left: 0;
    }

    .hrmny .wrapper.sec-02 {
        margin-bottom: 0;
    }

    .hrmny .wrapper.sec-02 .col:nth-child(1) {
        margin-left: 0;
    }

    .hrmny .wrapper.sec-02 .bgclr--purple--20 {
        background-color: #F6F1FC;
    }

    .hrmny .sec-02 .feature-list {
        max-width: inherit;
    }

    .hrmny .sec-02 .clr--pink {
        color: #893FD5;
    }

    .hrmny .sec-02 .clr--pink svg path {
        fill: #893FD5;
    }

    .hrmny .wrapper.sec-03 {
        padding-top: 88px;
    }

    .hrmny .wrapper.sec-03 .col:nth-child(2) {
        padding-left: 0;
    }

    .hrmny .sec-03 .feature-desc {
        max-width: inherit;
    }


    /* ABOUT */
    .abt .carousel {
        min-height: 204px;
    }

    .abt .wrapper.sec-01 .card-wrapper + .feature-title {
        margin-top: 70px;
    }

    .abt .highlights {
        margin-top: 32px;
    }


    /* CUSTOMER STORIES, BLOG POSTS */
    .card-wrapper, .abt .card-wrapper {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        margin-left: -24px;
        margin-right: -24px;
        margin-top: 70px;
        margin-bottom: 0;
    }

    .card-wrapper a:nth-of-type(1) {
        margin-bottom: 32px;
    }

    .card-wrapper a:nth-of-type(1) .card-container {
        background-color: #c08cea;
    }

    .card-wrapper a:nth-of-type(2) .card-container {
        background-color: #6796ce;
    }

    .card-wrapper .card-container {
        border-radius: 0;
        max-width: inherit;
    }

        .card-wrapper .card-container img {
            margin: 0 auto;
        }

    .card-wrapper .card-title, .abt .card-wrapper .card-title {
        padding: 16px 24px 0 24px;
        margin: 0 0 16px;
        background-color: #fff;
    }


    /* CUSTOMER STORIES */
    .stries header:after {
        content: 'Customer Stories';
        font-size: 22px;
        line-height: 27px;
        font-family: var(--headingFontFmly);
        margin-left: 24px;
    }

    .stries .wrapper {
        margin-top: 37px;
    }

    .stries .card-wrapper {
        margin-top: 0;
    }

    .stries .inner-post {
        min-height: auto;
        padding: 0;
    }

    .stries footer {
        margin-top: 37px;
    }

    .cusstrie .carousel {
        min-height: 301px;
    }

    .cusstrie .slider .col:nth-child(1) {
        padding: 0;
    }

    .cusstrie .container > .inline-nav {
        margin-top: 32px;
    }

    .cusstrie .wrapper.sec-01 .feature-title {
        font-size: 40px;
        line-height: 56px;
    }

    .cusstrie .cta-wrppr {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        grid-auto-flow: dense;
    }

    .cusstrie .cta-wrppr .inline-nav {
        margin-top: 40px;
        margin-right: inherit;
        margin-left: auto;
    }

    .cusstrie footer {
        margin-top: 32px;
    }

    .strie-dcp .slider .img-wrppr {
        padding: 0px 35px;
    }


    /* BOOK A DEMO */
    .wrapper--demo {
        background: none;
        margin-bottom: 72px;
    }

    .wrapper--demo .container .col {
        padding-top: 65px;
    }

    .wrapper--demo .block {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .wrapper--demo .container .col {
        justify-content: inherit;
    }

    .demo-form {
        min-width: auto;
        padding: 0;
        max-width: inherit;
        box-shadow: none;
        margin-right: 0;
    }

    .demo-form .block-title {
        margin-bottom: 32px;
    }

    .form-control, .hs-input {
        max-width: inherit;
        width: 100% !important;
    }

    #demoForm .form-columns-1, #demoForm .form-columns-2 {
        max-width: inherit;
    }

    .hs-button {
        min-height: 50px;
    }

    .contact-links {
        margin: 0;
    }


    /* BREAKOUT PAGES */
    .wrksmply .carousel, .scaleup .carousel, .comuncat .carousel, .gosp .carousel, .expapprov .carousel, .collbort .carousel, .tcmd .carousel, .raq .carousel, .gtf .carousel {
        background: none;
        padding-top: 24px;
        min-height: auto;
    }

    .wrksmply .carousel, .gosp .carousel {
        background: url(../assets/images/bg-carousel-gtf-xs.png) no-repeat center 235px / 170%;
        padding-bottom: 240px;
    }

    .gtf .carousel {
        background: url(../assets/images/bg-carousel-gtf-xs.png) no-repeat center 235px / 170%;
        padding-bottom: 280px;
    }

    .wrksmply .wrppr-usp, .gosp .wrppr-usp, .gtf .wrppr-usp {
        margin-top: -175px;
        padding-top: 0;
    }

    .scaleup .carousel {
        background: url(../assets/images/bg-carousel-collbort-xs.png) no-repeat center 250px / 135%;
        padding-bottom: 250px;
    }

    .tcmd .carousel {
        background: url(../assets/images/bg-carousel-collbort-xs.png) no-repeat center 250px / 162%;
        padding-bottom: 250px;
    }

    .collbort .carousel {
        background: url(../assets/images/bg-carousel-collbort-xs.png) no-repeat center 235px / 170%;
        padding-bottom: 266px;
    }

    .scaleup .wrppr-usp, .tcmd .wrppr-usp, .collbort .wrppr-usp {
        margin-top: -200px;
        padding-top: 0;
    }

    .comuncat .carousel, .raq .carousel, .expapprov .carousel {
        background: url(../assets/images/bg-carousel-raq-xs.png) no-repeat center 235px / 170%;
        padding-bottom: 240px;
    }

    .comuncat .wrppr-usp, .raq .wrppr-usp, .expapprov .wrppr-usp {
        margin-top: -180px;
        padding-top: 0;
    }

    .wrksmply .carousel .col:nth-of-type(2), .scaleup .carousel .col:nth-of-type(2), .comuncat .carousel .col:nth-of-type(2), .gosp .carousel .col:nth-of-type(2), .expapprov .carousel .col:nth-of-type(2), .collbort .carousel .col:nth-of-type(2), .tcmd .carousel .col:nth-of-type(2), .raq .carousel .col:nth-of-type(2), .gtf .carousel .col:nth-of-type(2) {
        padding: 0 23px;
    }

    .scaleup .img-wrppr, .comuncat .img-wrppr, .gtf .img-wrppr, .tcmd .img-wrppr, .raq .img-wrppr, .collbort .img-wrppr {
        margin-left: 0;
    }

    .wrksmply .img-wrppr img, .scaleup .img-wrppr img, .comuncat .img-wrppr img, .gosp .img-wrppr img, .expapprov .img-wrppr img, .collbort .img-wrppr img, .tcmd .img-wrppr img, .raq .img-wrppr img, .gtf .img-wrppr img {
        position: relative;
        top: 0;
        right: 0;
    }

    .wrksmply .slider, .scaleup .slider, .comuncat .slider, .gosp .slider, .expapprov .slider, .collbort .slider, .tcmd .slider, .raq .slider, .gtf .slider {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .expapprov .col-reverse .col:nth-child(1), .gosp .col-reverse .col:nth-child(1) {
        grid-column-start: inherit;
    }

    .expapprov .img-wrppr img {
        left: 0;
    }

    .wrksmply .carousel .slider-content, .scaleup .carousel .slider-content, .comuncat .carousel .slider-content, .gosp .carousel .slider-content, .expapprov .carousel .slider-content, .collbort .carousel .slider-content, .tcmd .carousel .slider-content, .raq .carousel .slider-content, .gtf .carousel .slider-content {
        margin-top: 15px;
        margin-right: 0;
        margin-left: 0;
    }

    .wrksmply .slide-content .feature-title, .scaleup .slide-content .feature-title, .comuncat .slide-content .feature-title, .gosp .slide-content .feature-title, .expapprov .slide-content .feature-title, .collbort .slide-content .feature-title, .tcmd .slide-content .feature-title, .raq .slide-content .feature-title, .gtf .slide-content .feature-title {
        margin: 8px 0;
    }

    .tcmd .carousel .feature-desc, .raq .carousel .feature-desc, .collbort .carousel .feature-desc, .gosp .carousel .feature-desc, .home .wrapper.sec-03 .feature-desc {
        max-width: inherit;
    }

    .wrppr-usp {
        padding-top: 64px;
    }

    .wrppr-usp .feature-title {
        text-align: left;
        margin-left: 21px;
        margin-right: 21px;
        margin-bottom: 64px;
    }

    .wrppr-usp .block.of-three {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .wrksmply .app-usp, .scaleup .app-usp, .comuncat .app-usp, .gosp .app-usp, .expapprov .app-usp, .collbort .app-usp, .tcmd .app-usp, .raq .app-usp, .gtf .app-usp {
        padding: 0;
        margin-bottom: 64px;
    }

    .wrksmply .app-usp:last-child, .scaleup .app-usp:last-child, .comuncat .app-usp:last-child, .gosp .app-usp:last-child, .expapprov .app-usp:last-child, .collbort .app-usp:last-child, .tcmd .app-usp:last-child, .raq .app-usp:last-child, .gtf .app-usp:last-child {
        margin-bottom: 0;
    }

    .app-usp .icn-base {
        margin-bottom: 16px;
    }

    .usp-title {
        margin-bottom: 8px;
    }

    .contact {
        display: none;
    }

    .path:after {
        display: none;
    }

    .wrksmply .inner-post, .scaleup .inner-post, .comuncat .inner-post, .gosp .inner-post, .expapprov .inner-post, .collbort .inner-post, .tcmd .inner-post, .raq .inner-post, .gtf .inner-post {
        padding-top: 101px;
        min-height: auto;
        background: url('../assets/images/bg-sec01-xs.png') no-repeat right 15px;
        margin-bottom: 37px;
    }

    .wrksmply .inner-post .card-wrapper, .scaleup .inner-post .card-wrapper, .comuncat .inner-post .card-wrapper, .gosp .inner-post .card-wrapper, .expapprov .inner-post .card-wrapper, .collbort .inner-post .card-wrapper, .tcmd .inner-post .card-wrapper, .raq .inner-post .card-wrapper, .gtf .inner-post .card-wrapper {
        margin-top: 0;
    }


    /* HIGHLIGHTS */
    .highlights {
        padding: 45px 0 48px;
    }

    .bg-img03 {
        background: #0077FF url('../assets/images/bg-highlight-xs.png') no-repeat center 60px / 95%;
    }

    .highlights-content {
        padding-left: 0;
    }

    .highlights .block {
        grid-template-columns: auto;
    }

    .highlights-cta {
        padding-right: 0;
    }

    .highlights-cta .btn {
        width: 100%;
        margin-top: 24px;
        min-height: 50px;
    }


    /* ABM pages */
    .abm .carousel .slider {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .abm .carousel .slider > .col.justC--flxEnd {
        justify-content: normal;
    }

    .abm .video-cb {
        margin-bottom: 20%;
    }

    .abm .slider .block.of-three {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .abm .sec-01 .col {
        align-content: center;
    }

    .benefit-desc {
        max-width: inherit;
    }


    /* FOOTER */
    .footer {
        justify-content: center;
        grid-template-columns: 100%;
        padding-top: 35px !important;
    }

    .footer > div:first-child {
        text-align: center;
    }

    .recognition {
        padding-left: 0;
    }

    .site-links {
        grid-template-columns: [set-1] 65% [set-2] 32%;
        margin-top: 35px;
    }

    .links-set:nth-child(1) {
        padding-left: 25%;
    }


    /* COPYRIGHT */
    .copyright {
        min-height: 108px;
    }

    .copyright .container {
        text-align: center;
    }

    .copyright .container .col:nth-of-type(2) {
        grid-row: 1;
    }

    .copyright .copyright-txt {
        line-height: 1.15rem;
    }

    .vt-social {
        justify-content: center;
        margin-bottom: 24px;
        gap: 0 25px;
    }
}


/* === iPHONE 5/SE | 6/7/8 | 6/7/8 PLUS | 8 LANDSCAPE === */
@media screen and (max-width: 812px) and (orientation: landscape) {
    /* HOME - CONTENT */
    .home .wrapper.sec-02 .container {
        background-position: center 0;
        background-size: cover;
        padding-bottom: 50px;
    }

    .home .wrapper.sec-02 .main-img02 {
        margin: 0 auto;
        width: 100%;
    }

    .home .wrapper.sec-03 .bar {
        margin-top: -15px;
    }

    .bg-img03 {
        background-position: center -20%;
        background-size: 75%;
    }

    /* PLATFORM, ARRANGE, BRIDGE - CAROUSEL */
    .pltfrm .carousel, .cnductr .carousel, .hrmny .carousel {
        background-size: 100%;
    }

    .macbook-img {
        height: 870px;
        margin-top: 0;
        top: -120px;
    }

    .pltfrm .wrapper.sec-03, .cnductr .wrapper.sec-03, .hrmny .wrapper.sec-03 {
        background-size: 100%;
    }

    /* ARRANGE (CONDUCTOR) */
    .cnductr .slider .slider-content {
        margin-top: 0;
    }

    .cnductr .wrapper.sec-03 .contnt {
        padding-left: 0;
    }

    .cnductr .wrapper.sec-02 .bgclr--purple--20 {
        background-color: #F6F1FC;
    }


    /* BREAKOUT PAGES */
    .wrppr-usp .feature-title {
        text-align: center;
    }


    /* FOOTER */
    .site-links {
        grid-template-columns: [set-1] 60% [set-2] 38%;
    }

    .links-set:nth-child(1) {
        padding-left: 50%;
    }
}


/* === 
    iPAD PORTRAIT & LANDSCAPE
=== */
@media all and (min-width: 768px) and (max-width: 1024px) {
    .sm-hide {
        display: none !important;
    }

    .sm-show {
        display: flex !important;
    }

    .pull-up {
        margin-top: 0;
    }

    .home .container.slider .video, .abm .container.slider .video {
        margin: 50px auto 20px;
    }

}


/* === iPAD PORTRAIT only === */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
    
    /* HOME */
    .home .wrapper.sec-02 .container, .home .wrapper.sec-03 .container {
        background-size: 100%;
    }

    .home .wrapper.sec-02 .main-img02 {
        width: 100%;
        margin-left: 0;
    }

    .home .container.slider .video, .abm .container.slider .video {
        margin: 50px auto 20px;
    }

    .videoask-cb:not(iframe), .abm .video-cb {
        width: 351px;
        margin: 50px auto 20px;
        border-radius: 24px !important;
        height: 615px;
    }

    .toggleclose {
        right: 20%;
        top: 7%;
    }

    /* PLATFORM, BRIDGE, ARRAGE - CAROUSEL */
    .pltfrm .carousel, .cnductr .carousel, .hrmny .carousel {
        background-position: right 275px;
        background-size: 100% 68%;
        padding-bottom: 800px;
    }

    .pltfrm .slider .slider-content, .cnductr .slider .slider-content, .hrmny .slider .slider-content {
        margin-top: 75%;
    }

    .macbook-img {
        height: 1200px;
        top: -175px;
    }

    .pltfrm .wrapper.sec-01, .cnductr .wrapper.sec-01, .hrmny .wrapper.sec-01 {
        margin-top: -650px;
    }

    .pltfrm .wrapper.sec-03, .cnductr .wrapper.sec-03, .hrmny .wrapper.sec-03 {
        background-size: 100%;
    }

    .wrppr-usp .feature-title {
        text-align: center;
    }

    .wrksmply .carousel, .gosp .carousel, .gtf .carousel, .scaleup .carousel, .tcmd .carousel, .collbort .carousel, .comuncat .carousel, .raq .carousel, .expapprov .carousel {
        background-size: 100%;
    }
}


/* === iPHONE 5/SE, 6/7/8, 6/7/8 Plus | 8 LANDSCAPE only === */
@media screen and (max-width: 812px) and (orientation: landscape) {
    .wrksmply .carousel, .gosp .carousel, .gtf .carousel, .scaleup .carousel, .tcmd .carousel, .collbort .carousel, .comuncat .carousel, .raq .carousel, .expapprov .carousel {
        background-size: 100%;
    }

    .toggleclose svg path {
        fill: #fff;
    } 

    .home .wrapper.sec-03 .container {
        background-size: contain;
    } 

    .hrmny .wrapper.sec-01 {
        position: relative;
        z-index: 1;
    }
}


/* === iPHONE 5/SE === */
@media screen and (max-width: 568px) {
    .videoask-cb, .abm .video-cb {
        height: 725px;
    }
}


/* === iPHONE 6/7/8 PORTRAIT === */
@media screen and (max-width: 375px) and (orientation: portrait) {
    .videoask-cb, .abm .video-cb {
        height: 673px;
    }

    .recognition a + a {
        margin-left: 0;
    }
}


/* === iPHONE 5/SE PORTRAIT === */
@media screen and (max-width: 320px) {
    .menu {
        left: -40%;
    }

    .wrppr-usp .feature-title {
        margin-left: 0;
        margin-right: 0;
    }

    .videoask-cb, .abm .video-cb {
        height: 575px;
    }

    .leaderboard .feature-title {
        font-size: 39px;
        line-height: 49px;
    }

    .recognition a:last-child img {
        margin: 20px 0 0;
    }
}