/* SHOW/HIDE ON MOBILE
**************************************************/
.show-on-mobile { display:none; }
@media (max-width: 800px) {
    /* show on mobile */
    .show-on-mobile { display:inline; }
    /* hide on mobile */
    .hide-on-mobile { display:none; }
}



/* HEADER/NAVIGATION
**************************************************/
@media (max-width: 800px) {

    .header-nav .header-menu,
    .header-nav .header-cta {
        display: none;
    }
    .header-message {
        justify-content: left;
    }
    .header {
        background-color: #1E1B2766;
        border-bottom: 1px solid #EFEFEF24;
        backdrop-filter: blur(81.19999694824219px);
    }
    .header-nav,
    .hide-header-message .header {
        height: 70px !important;
    }

}




/* MAIN SECTION
**************************************************/
@media (max-width: 800px) {

    .section-main-inner {
        padding-bottom:50px;
    }
    .section-main h1 {
        font-size: 42px;
        line-height: 51px;
        letter-spacing: -2.1px;
        margin-right: 0;
    }
    /* disable 4-line height */
    .section-main h1.title-four-lines {
        margin-bottom: 0;
        min-height: auto;
    }
    .page-template-page-our-solution .section-main .pre-heading {
        font-size: 13px;
    }
    .page-template-page-our-solution .section-main h1,
    .page-template-page-industries .section-main h1,
    .page-template-page-about-us .section-main h1 {
        font-size: 38px;
        line-height:44px;
        letter-spacing: -1.9px;
    }
    
    .section-main p {
        max-width:425px;
        font-size: 19px;
        line-height: 28px;
        letter-spacing: -.2px;
    }

}
@media (max-width:350px) {
  
    .section-main-inner {
        padding-bottom:25px;
    }
    .section-main h1 {
        width:100%;
    }
    .section-main p {
        margin-top:15px;
        margin-bottom:30px;
    }
    
}



/* SECTION 02
**************************************************/
@media (max-width: 800px) {

    .section-02-inner {
        gap: 40px;
        padding-top: 90px;
        padding-bottom: 90px;
    }
    .section-02-image-container {
        width: 200px;
        height: 200px;
    }
    .section-02-inner h2 {
        font-size: 28px;
        line-height: 36px;
    }

}
@media (max-width: 650px) {

    .section-02-inner {
        flex-direction: column;
        padding-bottom: 75px;
    }

}
@media (max-width:350px) {
  
    .section-02-inner h2 {
        font-size: 26px;
        line-height: 34px;
    }
    
}




/* SECTION 03
**************************************************/
@media (max-width: 800px) {

    .section-03-inner {
        padding-top: 70px;
        padding-bottom: 65px;
    }
    .section-03-header {
        flex-direction: column;
    }
    .section-03-header > p {
        font-size: 13px;
    }
    .section-03-header h3 {
        font-size: 50px;
        line-height: 55px;
    }

    .section-03-accordion {
        margin-top: 30px;
    }
    .accordion-content {
        margin:0 0 0 50px;
    }
    .accordion-image {
        width: clamp(200px, calc(250px + (min(100vw, 1400px) - 800px) * 0.225), 315px);
    }

    .section-03-accordion .accordion-item h4 {
        font-size: 26px;
        letter-spacing: -1.25px;
    }
    .accordion-content span {
        font-size: 19px;
        letter-spacing: -0.6px;
    }
    .accordion-content span::before {
        top:4px;
        left:-27px;
    }
    .accordion-content p {
        font-size: 16px;
        line-height: 25px;
    }

}
@media (max-width: 600px) {
  
    .accordion-content-wrapper {
        flex-direction: column;
    }
    .accordion-content {
        margin-left: 27px;
    }
    .accordion-image {
        width: 100%;
    }

}
@media (max-width: 350px) {
  
    .section-03-header h3 {
        font-size: 45px;
        line-height: 50px;
    }

}




/* COUNTER SECTION
**************************************************/
@media (max-width: 800px) {

    .section-04 h3 {
        font-size: 50px;
        line-height: 55px;
        letter-spacing: -2.5px;
    }
    .section-04-content {
        max-width:450px;
    }
    .section-04-content p {
        font-size: 19px;
        line-height: 28px;
        letter-spacing: -.2px;
        margin-bottom: 30px;
    }


    .section-04-inner {
        padding-top: 80px;
        padding-bottom: 50px;
    }
    .section-04 .counter-wrapper-main {
        flex-direction: column;
    }
    .section-04 .counter-wrapper {
        width: 100%;
        aspect-ratio: auto;
        padding:20px;
    }
    .section-04 .counter-wrapper .counter {
        letter-spacing: -2.5px;
    
        font-size: 50px;
    }
    .section-04 .counter-wrapper .counter-top {
        font-size: 32px;
        letter-spacing: 0;
    }
    .section-04 .counter-wrapper .uptime {
        position: absolute;
        top:42px;
        left:145px;
        font-size: 35px;
    }
    .section-04 .counter-wrapper .desc {
        font-size: 18px;
        line-height: 27px;
        margin-top: 40px;
        min-height:auto;
    }

    .section-built-inner {
        margin-bottom: 0;
    }
    .built-main-wrapper {
        height: auto;
      padding: 0;
    }
    .built-mob-main-inner {
        position: relative;
        overflow: hidden;
        width: 100%;
        max-height: auto;
        flex: 1;
        margin-left: auto;
        padding-bottom:65px;
    }
    .built-mob-inner-wrapper {
        overflow: hidden;
        font-size: 19px;
        font-weight: 400;
        color: #ffffff;
    }
    .built-mob-inner-inner {
        transition: transform .75s cubic-bezier(.35, .9, .5, 1);
        will-change: transform;
    }
    .built-mob-inner-wrapper .built-mob-row {
        display: flex;
        padding:25px 0;
        display: flex;
        align-items: center;
        gap: clamp(20px, 4vw, 40px);
    }
    .built-mob-inner-wrapper .built-mob-block {
        display: block;
    
        display: flex;
        flex-direction: column;
        justify-content: center;
    
        transition: opacity .5s cubic-bezier(.35, .9, .5, 1);

        margin-top:20px;
        margin-bottom: 20px;
    }
    .built-mob-block span {
        font-weight: 500;
        letter-spacing: -0.75px;
        color: #B79BFB;
    
        font-size: clamp(11px, calc(11px + (min(100vw, 1400px) - 800px) * 0.0067), 15px);
    }
    .built-mob-block h3 {
        font-weight: 500;
        letter-spacing: -0.75px;
        color: #fff;
    
        font-size: clamp(18px, calc(18px + (min(100vw, 1400px) - 800px) * 0.0133), 26px);
        line-height: clamp(26px, calc(26px + (min(100vw, 1400px) - 800px) * 0.0167), 36px);
        margin-bottom: clamp(25px, calc(25px + (min(100vw, 1400px) - 800px) * 0.0417), 50px);
    }
    .built-mob-block p {
        font-weight: 300;
        letter-spacing: -0.75px;
        color: #fff;
        margin-top: 0;
    
        font-size: clamp(18px, calc(18px + (min(100vw, 1400px) - 800px) * 0.0133), 26px);
        line-height: clamp(26px, calc(26px + (min(100vw, 1400px) - 800px) * 0.0167), 36px);
    }
    .built-mob-block p:last-of-type {
        font-weight: 400;
        letter-spacing: 0;
        color: #D8D6EA;
    
        font-size: clamp(18px, calc(18px + (min(100vw, 1400px) - 800px) * 0.00667), 22px);
        line-height: clamp(26px, calc(26px + (min(100vw, 1400px) - 800px) * 0.0167), 31px);
    }
    
    .built-mob-block a {
        position: relative;
        display: inline-block;
        font-weight: 500;
        width: max-content;
    
        /* gradient text */
        background: linear-gradient(90deg, #D8C6FF 0%, #C4A9FF 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        color: transparent;
    
        letter-spacing: clamp(-0.5px, calc(-0.5px + (min(100vw, 1400px) - 800px) * 0.000357), -0.5px);
        font-size: 18px;
    }
    .built-mob-block a::before {
        content: '';
        position: absolute;
        height: 12px;
    
        background-image: url('images/arrow-section-05.svg');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transition: transform 0.2s ease;
    
        top: 6px;
        right: -16px;
        width: 10px;
    }
    .built-mob-block a:hover::before {
        transform:translateX(3px);
    }
    
    .built-mob-img-wrapper {
        display: flex;
        align-items: center;
        pointer-events: none;
    }
    .built-mob-img {
        border-radius: 8px;
        background-size: cover;
        background-position: center;
        margin-left: auto;
    
        width: clamp(150px, calc(150px + (min(100vw, 1400px) - 320px) * 0.3889), 570px);
        height: clamp(150px, calc(150px + (min(100vw, 1400px) - 320px) * 0.3889), 570px);
    }

}
@media (max-width: 550px) {

    .built-mob-inner-wrapper .built-mob-row {
        flex-direction: column;
    }
    .built-mob-img {
        width: calc(100vw - 50px);
        height: auto;
        aspect-ratio: 1 / 1;
    }

}
@media (max-width: 350px) {
  
    .section-04 h3 {
        font-size: 45px;
        line-height: 50px;
    }
    .section-04 .counter-wrapper .uptime {
        left:145px;
        font-size: 30px;
    }
  
}



/* SECTION 06
**************************************************/
@media (max-width: 800px) {

    .home .section-06-inner {
        padding-top: 0;
        padding-bottom:70px;
    }
    .section-06-sticky {
        position: relative;
        top: 0;
        transform: translateY(0);
        margin-top: 90px;
    }
    .section-06-sticky p:first-of-type {
        font-size: 13px;
    }
    .section-06-sticky h3 {
        font-size: 50px;
        line-height: 55px;
        letter-spacing: -2.5px;
        margin-bottom: 50px;
    }
    .section-06-sticky p {
        font-size: 19px;
        line-height: 28px;
    }
    .section-06-cards-wrapper {
        margin-top: 55px;
    }
    .section-06-card img {
        width: 40px;
    }
    .section-06-cards-wrapper .section-06-card h6 {
        font-size: 22px;
        line-height: 32px;
        padding-top: 20px;
        padding-bottom: 10px;
    }
    .section-06-cards-wrapper .section-06-card p {
        font-size: 16px;
        line-height: 25px;
    }

}
@media (max-width: 500px) {

    .section-06-cards-wrapper .section-06-card {
        width: 100%;
    }

}
@media (max-width: 350px) {

    .section-06-cards-wrapper .section-06-card h6 {
        font-size: 20px;
        padding-top: 20px;
        padding-bottom: 10px;
    }
    .section-06-cards-wrapper .section-06-card p {
        font-size: 14px;
        line-height: 22px;
    }

}




/* SECTION 08
**************************************************/
@media (max-width: 800px) {

    .section-07-inner {
        width:100%;
        padding: 60px 25px;
        background: #160F50;
    }
    .section-07 img.show-on-mobile {
        width:100%;
        height:auto;
        display:block;

        /* bottom line glitch on FF */
        margin-bottom:-2px;
    }

    .section-07-inner h3 {
        font-size: 26px;
        line-height: 32px;
        letter-spacing: -1.3px;
        margin-bottom: 25px;
    }
    .section-07-inner p {
        font-size: 18px;
        line-height: 27px;
        margin-bottom: 40px;
    }

    .section-07-inner .section-07-quote p {
        font-size: 24px;
        line-height: 32px;
        letter-spacing: -.7px;
    }
    .section-07-inner .section-07-quote p.quote-author {
        font-size: 16px;
        line-height: 25px;
    }

}
@media (max-width: 350px) {
  
    .section-07-inner h3 {
        font-size: 22px;
        line-height: 28px;
        letter-spacing: -1.3px;
        margin-bottom: 20px;
    }
    .section-07-inner p {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 35px;
    }

    .section-07-inner .section-07-quote p {
        font-size: 23px;
        line-height: 28px;
    }
    .section-07-inner .section-07-quote p.quote-author {
        font-size: 14px;
        line-height: 22px;
    }
  
}




/* SECTION 08
**************************************************/
@media (max-width: 800px) {

    .section-08 {
        padding-top: 50px;
        padding-bottom: 70px;
    }
    .section-08-title h2 {
        font-size: 26px;
        letter-spacing: -1.3px;
    }
    .post-meta {
        font-size: 13px;
        margin-top: 22px;
        margin-bottom: 8px;
    }
    .post-title {
        font-size: 18px;
        line-height: 25px;
        margin-bottom: 25px;
    }
    .post-readmore .read-more-link {
        font-size: 18px;
    }
    .post-readmore .read-more-link::after {
        top:6px;
    }

    .section-08-inner .show-on-mobile.button-blue {
        display: flex;
        width: max-content;
    }

}
@media (max-width: 700px) {

    .posts-grid .grid-container {
        grid-template-columns: 1fr;
    }

}





/* SECTION 09
**************************************************/
@media (max-width: 800px) {

    .section-09::before {
        background: linear-gradient(176.23deg, #080110 16.13%, rgba(57, 4, 118, 0) 63.81%);
    }
    .section-09-inner {
        flex-direction: column;
        gap:35px;

        padding-top: 50px;
        padding-bottom: 60px;
    }
    .section-09-title h2 {
        max-width: 100%;
        font-size: 38px;
        letter-spacing: -1.75px;
    }
    .section-09-inner p {
        font-size: 17px;
        line-height: 26px;
    }
    .section-09-content {
        margin-left: auto;
    }
    .contact-form-wrapper {
        padding: 20px 20px 50px 20px;
    }

}
@media (max-width: 350px) {

    .section-09-inner {
        gap:25px;
    }
    .section-09-title h2 {
        font-size: 34px;
    }
    .section-09-inner p {
        font-size: 16px;
        line-height: 22px;
    }

}



/* BASIC TEMPLATE
**************************************************/
@media (max-width: 800px) {

    .template-basic-main article h1 {
        letter-spacing: -2px;
        font-size: 40px;
    }

}
@media (max-width: 500px) {

    .template-basic-main article h1 {
        letter-spacing: -1.5px;
        font-size: 35px;
    }

}





/* CONTACT PAGE
**************************************************/
@media (max-width: 800px) {

    .section-contact {
        padding-bottom: 0;
    }
    .section-contact-title {
        margin-top: 100px;
    }
    .section-contact-title h2 {
        letter-spacing: -2px;
        font-size: 38px;
    }
    .section-contact-inner p {
        font-size: 17px;
        line-height: 26px;
    }

    .contact-form-tab {
        font-size: 16px;
        line-height: 19px;
        text-align: center;
        padding:0 20px;
    }

    .section-offices-inner {
        margin-top: 0;
        margin-bottom: 90px;
    }
    h2.offices-heading {
        font-weight: 300;
        letter-spacing: -5px;
        color: #0D0E20;
        margin: 0;
    
        font-size: 38px;
        letter-spacing: -2px;  
        padding-top: 60px;
        padding-bottom: 50px;
    }
    .office-mob-location .office-mob-txt p {
        font-size: 19px;
        line-height: 26px;
    }

}




/* FOOTER
**************************************************/
@media (max-width: 800px) {

    .section-footer {
        padding-top:60px;
    }
    .footer-linkedin img {
        margin-top: 15px;
        margin-bottom: 40px;
    }
    .footer-right,
    .footer-address-columns,
    .footer-bottom-inner {
        flex-direction: column;
    }
    .footer-bottom-left,
    .footer-bottom-right {
        margin-right:auto;
    }
    .footer-bottom {
        margin-top:40px;
    }
    .footer-bottom-inner {
        padding-top:30px;
    }
    .footer-menu-bottom ul.menu {
        margin-bottom: 40px;
    }
    .footer-menu-bottom ul.menu li {
        display:block;
        margin-bottom:7px;
    }

}
@media (max-width: 800px) {

    .section-footer img {
        max-width:200px;
    }

}




/****************************************
SECTION How it works
****************************************/
@media (max-width: 800px) {

    .section-how-it-works-inner {
        padding-top: 85px;
        padding-bottom: 80px;
    }
    .section-how-it-works h2 {
        letter-spacing: -4px;
        font-size: 50px;
    }
    .section-how-it-works p {
        font-size: 19px;
        line-height: 24px;
    }
    .section-how-it-works p span {
        font-size: 14px;
        line-height: 20px;
    }
}



/****************************************
PAGE /our-solution
****************************************/
@media (max-width: 800px) {

    .page-our-solution .section-04-05-wrapper h2 {
        margin-bottom: 30px;
    }
    .page-our-solution .section-07-inner {
        padding-bottom: 60px;
    }

}





/****************************************
PAGE /industries
****************************************/
@media (max-width: 800px) {

    .section-industries {
        padding-bottom:0;
    }
    .industries-intro {
        display:none;
    }
    .industries-right {
        display: none;
    }
    .page-industries .section-industries h2 {
        padding-top:90px;
        padding-bottom: 60px;
  
        font-size: 38px;
        line-height: 44px;
        letter-spacing: -2px;
    }
    .industries-left {
        min-height: 200px;
        padding-top: 0;
        padding-right: 0;
        text-align: center;
    }
    .industries-left .industries-content {
        height: auto;
        margin:0 auto;
        max-width: 550px;
        text-align: left;
    }
    .industries-left .industries-content:nth-of-type(1) {
        transform: translateY(0);
        margin-bottom: 0;
    }
    .industries-container {
        height: max-content !important;
    }
    .industries-content {
        font-size: 14px;
        line-height: 23px;
    }
    .industries-content > span {
        font-size: 22px;
        letter-spacing: -.5px;
    }
    .industries-content p:first-of-type {
        margin-top: 30px;
        font-size: 22px;
        line-height: 31px;
    }
    .industries-left img {
        max-width: 400px;
        width: 100%;
        height: auto;
        margin: 40px auto 70px auto;
    }

}





/****************************************
SECTION Logos
****************************************/
@media (max-width: 800px) {

    .section-logos-inner {
        padding-top: 60px; 
        padding-bottom: 55px;
    }
    .section-logos-inner h2 {
        font-weight: 500;
        font-size: 24px;
        line-height: 34px;
        letter-spacing: -1.25px;
        margin-bottom: 40px;
    }

}





/****************************************
SECTION Quote
****************************************/
@media (max-width: 800px) {

    .section-quote {
        padding-top: 115px;
        padding-bottom: 70px;
    }
    .section-quote h2::before {
        top: -55px;
    }
    .section-quote h2 {
        font-weight: 300;
        letter-spacing: -1.8px;

        font-size: 24px;
        line-height: 32px;
        margin-bottom: 20px;
    }
    .section-quote p {
        font-size: 16px;
        line-height: 25px;
    }

}




/****************************************
SECTION Our solution
****************************************/
@media (max-width: 800px) {

    .section-our-solution {
        background: transparent;
        background-color:#160F50;
        overflow: hidden;

        background: linear-gradient(104.68deg, rgba(8, 1, 16, 0.59) 11.93%, rgba(57, 4, 118, 0) 78.38%);
        background-color: #160F50;
    }
    .section-our-solution::before {
        content:'';
        position:absolute;
        z-index:-1;
        top:auto;
        bottom:0;
        left:0;
        width:100%;
        height:489px;
        opacity:1;
        background: radial-gradient(168.77% 168.77% at 50% 7.96%, rgba(74, 0, 255, 0) 0%, rgba(74, 0, 255, 0) 31.29%, rgba(134, 85, 255, 0.5464) 53.38%, #4A00FF 100%);

        width: 180vw;
        left: -40vw;
    }
    .section-our-solution-inner {
        padding-top: 80px;
        padding-bottom: 110px;
    }
    .our-solution-img {
        position: relative;
        max-width:450px;
        top: 50px;
        width: 95%;
        height: auto;
        margin: 0 auto;
    }
    .section-our-solution-inner .pre-heading {
        font-size: 13px;
    }
    .section-our-solution h3 {
        font-size: 34px;
        line-height: 42px;
        letter-spacing: -1.7px;
    }
    .section-our-solution p {
        max-width: 100%;      
        margin-top: 20px;
        margin-bottom: 30px;
        font-size: 19px;
        line-height: 28px;
        color: #D8D6EA;
    }

}




/****************************************
SECTION Who we are
****************************************/
@media (max-width: 800px) {

    .who-we-are {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
        gap: 35px;
        padding-top: 10px;
        padding-bottom: 50px;
    }
    .who-we-are:nth-of-type(2) {
        margin-bottom:0;
    }
    .who-we-are .text { order: 1; }
    .who-we-are .image { order: 2; }
    .who-we-are .image {
        margin: 0 auto;
        max-width:500px !important;
    }
    .who-we-are h3 {
        margin-bottom: 25px;
        font-size: 22px;
        line-height: 32px;
    }
    .who-we-are p {
        margin-bottom: 0;
        font-size: 22px;
        line-height: 31px;
    }
    .who-we-are p:nth-child(3) {
        font-size: 16px;
        line-height: 25px;
    }

}



/****************************************
PAGE About us
****************************************/
@media (max-width: 800px) {

    .page-about-us .section-06-sticky {
        top: 0;
        transform: translateY(0);
        margin-top: 40px;
    }
    .page-about-us .section-06-sticky-inner {
        margin-top: 0;
    }

    .page-about-us .section-07-inner {
        padding-bottom: 60px;
    }

    .section-our-team {
        padding-top: 90px;
        padding-bottom: 90px;
    }
    .team-text h2 {
        font-size: 38px;
        line-height: 44px;
        letter-spacing: -2px;
    }
    .team-text p {
        font-size: 19px;
        line-height: 28px;
        letter-spacing: -.2px;
    }
    .team-images {
        gap: 60px;
        align-items: center;
        flex-direction: column;
    }
    .team-member {
        pointer-events: none;
    }
    .team-member-info-mob {
        font-weight: 400;
        font-size: 16px;
        line-height: 25px;
        color: #37379B;
    }
    .team-member-info-mob p:first-of-type {
        margin-top: 30px;
    }

}
@media (max-width: 700px) {

    .section-across-industries {  
        padding-top: 90px;
        padding-bottom: 90px;
    }
    .section-across-industries .content {
        flex-direction: column;
        margin-top:20px;
    }
    .section-across-industries h2 {
        font-size: 50px;
        line-height: 55px;
        letter-spacing: -2.5px;
    }
    .section-across-industries .text p {
        max-width: 450px;
        font-size: 19px;
        line-height: 28px;
        letter-spacing: -.2px;
    }
    .section-across-industries .text {
        margin-top: 0;
    }
    .section-across-industries .image {
        margin-top:30px;
    }
    .section-across-industries .buttons {
        flex-direction: column;
        align-items: flex-start;
        margin-top: 30px;
    }
    
}





/****************************************
PAGE /resources
****************************************/
@media (max-width: 700px) {

    .resources-featured-content {
        padding: 40px 20px;
        margin-bottom: 50px;
    }
    .resources-featured-content article {
        flex-direction: column;
        gap: 20px;
    }
    .sticky-post-text {
        max-width: 100%;
    }
    .sticky-post-image-wrapper {
        width: 100%;
    }
    .sticky-post-text h2 a {
        font-size: 26px;
        line-height: 32px;
        letter-spacing: -1.3px;
    }
    .sticky-post-text p {
        margin-top: 20px;
    
        font-size: 16px;
        line-height: 25px;
    }
    .sticky-post-text a.button-white {
        margin-top:15px;
    }

    #post-filter-form {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        margin-top: 0;
    }
    #post-results .posts-grid {
        grid-template-columns: repeat(2, 1fr);
        margin-top: 10px;
    }

}
@media (max-width: 500px) {

    #post-filter-form {
        grid-template-columns: repeat(1, 1fr);
    }
    .filter-year-wrapper {
        grid-column: unset;
        margin-top: 25px;
    }
    #post-results .posts-grid {
        grid-template-columns: repeat(1, 1fr);
    }

}




/****************************************
PAGE /resources single story
****************************************/
@media (max-width: 700px) {

    .section-single-post-inner .breadcrumbs {
        margin-bottom: 75px;
    }
    .single-prev-post,
    .single-next-post,
    .entry-content-wrapper .share-wrapper {
        display: none;
    }
    .entry-content-wrapper {
        padding: 0;
    }
    .wp-block-quote p {
        font-size: 24px !important;
        line-height: 32px !important;
    }
    .section-single-post article p:not(.wp-block-quote p) {
        font-size: 17px;
    }

}