/* ======================================================================
   AI OPERATIONS
   02 — THE GROWTH GAP
   MOBILE
   ====================================================================== */


/* Mobile-only elements must never appear on desktop */

@media (min-width: 1024px) {

    .ai-page .ai-growth-gap__mobile-copy,
    .ai-page .ai-growth-mobile-result,
    .ai-page .ai-growth-gap__mobile-signoff {
        display: none !important;
    }

}


@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-growth-gap {
        position: relative;

        overflow: hidden;

        padding:
            42px 0
            34px;

        background: #ffffff;

        color: #090c17;
    }


    .ai-page .ai-growth-gap .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 28px;
        padding-right: 28px;
    }


    /* ================================================================
       DESKTOP ELEMENTS OFF
       ================================================================ */

    .ai-page .ai-growth-gap__desktop-copy,
    .ai-page .ai-growth-problems,
    .ai-page .ai-growth-reality--desktop {
        display: none !important;
    }


    /* ================================================================
       MAIN LAYOUT
       ================================================================ */

    .ai-page .ai-growth-gap__inner {
        display: block;

        padding-top: 0;
        padding-bottom: 0;
    }


    .ai-page .ai-growth-gap__copy {
        width: 100%;
        max-width: none;
    }


    /* ================================================================
       MOBILE COPY
       ================================================================ */

    .ai-page .ai-growth-gap__mobile-copy {
        display: block;
    }


    /* label */

    .ai-page .ai-growth-gap__mobile-copy .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        width: 100%;

        margin:
            0 0
            39px;
    }


    .ai-page .ai-growth-gap__mobile-copy .ai-section-label strong {
        flex: 0 0 auto;

        color: #5527e9;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;

        text-decoration: none;

        letter-spacing: 0;
    }


    .ai-page .ai-growth-gap__mobile-copy .ai-section-label > span {
        flex: 0 0 auto;

        display: block;

        width: 28px;
        height: 1px;

        background: #9399aa;
    }


    .ai-page .ai-growth-gap__mobile-copy .ai-section-label small {
        min-width: 0;

        color: #68718f;

        font-size: 9px;
        line-height: 1.35;

        font-weight: 800;

        letter-spacing: .16em;

        text-transform: uppercase;

        white-space: normal;
    }


    /* ================================================================
       HEADING
       ================================================================ */

    .ai-page .ai-growth-gap__mobile-copy h2 {
        max-width: 610px;

        margin: 0;

        color: #080b13;

        font-size: clamp(
            36px,
            8.4vw,
            49px
        );

        line-height: .96;

        font-weight: 900;

        letter-spacing: -.055em;
    }


    .ai-page .ai-growth-gap__mobile-copy h2 span {
        display: block;

        color: #5425e9;
    }


    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-growth-gap__mobile-copy > p {
        max-width: 530px;

        margin:
            23px 0
            0;

        color: #68718e;

        font-size: clamp(
            15px,
            3.5vw,
            18px
        );

        line-height: 1.38;

        font-weight: 400;

        letter-spacing: -.01em;
    }


    /* ================================================================
       GRAPH

       Complete graph should be uploaded as the MOBILE graph image.
       ================================================================ */

    .ai-page .ai-growth-chart {
        display: block;

        width: 100%;

        min-height: 0;

        margin:
            35px 0
            0;

        padding: 0;

        border: 0;

        border-radius: 0;

        background: transparent;

        box-shadow: none;
    }


    .ai-page picture.ai-growth-chart__picture {
        display: block;

        width: 100%;

        margin: 0;
    }


    .ai-page .ai-growth-chart__picture img,
    .ai-page img.ai-growth-chart__picture {
        display: block;

        width: 100%;
        height: auto;

        max-height: none;

        margin: 0 auto;

        object-fit: contain;

        object-position: center;
    }


    /* ================================================================
       MOBILE RESULT CARD
       ================================================================ */

    .ai-page .ai-growth-mobile-result {
        display: grid;

        grid-template-columns:
            93px
            minmax(0, 1fr);

        gap: 25px;

        align-items: center;

        margin-top: 31px;

        padding-top: 30px;
        padding-bottom: 30px;

        border:
            1px solid
            #eeecfa;

        border-radius: 12px;

        background:
            linear-gradient(
                135deg,
                #faf9ff 0%,
                #f5f3ff 100%
            );
    }


    /* icon side */

    .ai-page .ai-growth-mobile-result__icon {
        display: flex;

        align-items: center;
        justify-content: center;

        min-height: 100px;

        border-right:
            1px solid
            #dad8e7;
    }


    .ai-page .ai-growth-mobile-result__icon .ai-icon {
        display: grid;

        place-items: center;

        width: 72px;
        height: 72px;

        padding: 18px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #f0edff,
                #faf9ff
            );

        color: #5425ed;
    }


    .ai-page .ai-growth-mobile-result__icon .ai-icon svg {
        width: 100%;
        height: 100%;

        fill: none;

        stroke: currentColor;

        stroke-width: 1.8;

        stroke-linecap: round;
        stroke-linejoin: round;
    }


    /* result copy */

    .ai-page .ai-growth-mobile-result__copy {
        min-width: 0;
    }


    .ai-page .ai-growth-mobile-result__copy small {
        display: block;

        margin:
            0 0
            10px;

        color: #68708c;

        font-size: 10px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        text-transform: uppercase;
    }


    .ai-page .ai-growth-mobile-result__copy h3 {
        margin: 0;

        color: #0a0d16;

        font-size: clamp(
            24px,
            5.5vw,
            32px
        );

        line-height: 1;

        font-weight: 900;

        letter-spacing: -.045em;
    }


    .ai-page .ai-growth-mobile-result__copy h3 span {
        display: block;

        margin-top: 2px;

        color: #5425ed;
    }


    .ai-page .ai-growth-mobile-result__copy p {
        margin:
            14px 0
            0;

        color: #6b738f;

        font-size: 13px;
        line-height: 1.35;
    }


    /* ================================================================
       BOTTOM SIGN-OFF
       ================================================================ */

    .ai-page .ai-growth-gap__mobile-signoff {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 25px;

        margin-top: 66px;

        padding-bottom: 0;

        color: #68718c;
    }


    .ai-page .ai-growth-gap__mobile-signoff span {
        position: relative;

        padding-left: 39px;

        font-size: 10px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;
    }


    .ai-page .ai-growth-gap__mobile-signoff span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 27px;
        height: 1px;

        background: #949aaa;

        transform: translateY(-50%);
    }


    .ai-page .ai-growth-gap__mobile-signoff strong {
        color: #68718c;

        text-align: right;

        font-size: 9px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .16em;
    }

}


/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-growth-gap {
        padding-top: 35px;
    }


    .ai-page .ai-growth-gap .home-shell {
        padding-left: 21px;
        padding-right: 21px;
    }


    .ai-page .ai-growth-gap__mobile-copy .ai-section-label {
        margin-bottom: 31px;
    }


    .ai-page .ai-growth-gap__mobile-copy .ai-section-label small {
        font-size: 8px;
    }


    .ai-page .ai-growth-gap__mobile-copy h2 {
        font-size: 34px;
    }


    .ai-page .ai-growth-gap__mobile-copy > p {
        margin-top: 19px;

        font-size: 15px;
    }


    .ai-page .ai-growth-chart {
        margin-top: 29px;
    }


    .ai-page .ai-growth-mobile-result {
        grid-template-columns:
            72px
            minmax(0,1fr);

        gap: 17px;

        margin-top: 25px;

        padding-top: 22px;
        padding-bottom: 22px;
    }


    .ai-page .ai-growth-mobile-result__icon {
        min-height: 86px;
    }


    .ai-page .ai-growth-mobile-result__icon .ai-icon {
        width: 58px;
        height: 58px;

        padding: 14px;
    }


    .ai-page .ai-growth-mobile-result__copy h3 {
        font-size: 22px;
    }


    .ai-page .ai-growth-mobile-result__copy p {
        font-size: 11px;
    }


    .ai-page .ai-growth-gap__mobile-signoff {
        margin-top: 52px;
    }


    .ai-page .ai-growth-gap__mobile-signoff span,
    .ai-page .ai-growth-gap__mobile-signoff strong {
        font-size: 7px;
    }

}
/* ======================================================================
   AI OPERATIONS
   03 — THE FRANKENSTEIN SYSTEM
   MOBILE
   ====================================================================== */


/* Mobile-only elements hidden on desktop */

@media (min-width: 1024px) {

    .ai-page .ai-frankenstein-mobile-result,
    .ai-page .ai-frankenstein-mobile-signoff {
        display: none !important;
    }

}


@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-frankenstein {
        position: relative;

        overflow: hidden;

        margin: 0;

        padding: 0;

        background: #ffffff;

        color: #090c16;
    }


    /*
     * Unlike desktop, mobile needs to use almost the entire screen width
     * because the visual is the main part of this section.
     */

    .ai-page .ai-frankenstein > .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding: 0;
    }


    /* ================================================================
       MAIN LAYOUT
       ================================================================ */

    .ai-page .ai-frankenstein__inner {
        position: relative;

        display: block;

        min-height: 0;

        margin: 0;

        padding: 0;

        background: #ffffff;
    }


    /* ================================================================
       TOP COPY
       ================================================================ */

    .ai-page .ai-frankenstein__copy {
        position: relative;

        z-index: 4;

        width: 100%;
        max-width: none;

        margin: 0;

        padding:
            36px 28px
            15px;

        background:
            linear-gradient(
                180deg,
                #ffffff 0%,
                rgba(255,255,255,.97) 78%,
                rgba(255,255,255,.72) 100%
            );
    }


    /* ================================================================
       LABEL
       ================================================================ */

    .ai-page .ai-frankenstein .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        width: 100%;

        margin:
            0 0
            30px;
    }


    .ai-page .ai-frankenstein .ai-section-label strong {
        flex: 0 0 auto;

        color: #5526ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;

        letter-spacing: 0;
    }


    .ai-page .ai-frankenstein .ai-section-label > span {
        display: block;

        flex: 0 0 auto;

        width: 28px;
        height: 1px;

        background: #858c9e;
    }


    .ai-page .ai-frankenstein .ai-section-label small {
        min-width: 0;

        color: #606984;

        font-size: 8.5px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .18em;

        text-transform: uppercase;
    }


    /* ================================================================
       HEADING
       ================================================================ */

    .ai-page .ai-frankenstein__copy h2 {
        max-width: 600px;

        margin: 0;

        color: #080b12;

        font-size: clamp(
            39px,
            9vw,
            51px
        );

        line-height: .92;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-frankenstein__copy h2 span {
        display: block;

        color: #5424ef;
    }


    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-frankenstein__text {
        max-width: 590px;

        margin:
            15px 0
            0;
    }


    .ai-page .ai-frankenstein__text p {
        margin: 0;

        color: #626c89;

        font-size: clamp(
            14px,
            3.25vw,
            17px
        );

        line-height: 1.32;

        font-weight: 400;

        letter-spacing: -.01em;
    }


    /*
     * First and second paragraphs make one visual paragraph
     * like your reference.
     */

    .ai-page .ai-frankenstein__text p + p {
        margin-top: 2px;
    }


    /*
     * Paragraph 3 belongs at the BOTTOM on mobile.
     */

    .ai-page .ai-frankenstein__desktop-third {
        display: none !important;
    }


    /* ================================================================
       COMPLETE FRANKENSTEIN VISUAL
       ================================================================ */

    .ai-page .ai-frankenstein__background {
        position: relative;

        display: block;

        width: 100%;

        min-height: 0;

        margin: 0;

        overflow: hidden;

        background:
            #080c10;
    }


    .ai-page picture.ai-frankenstein__picture {
        display: block;

        width: 100%;

        margin: 0;
    }


    .ai-page .ai-frankenstein__picture img,
    .ai-page img.ai-frankenstein__picture {
        display: block;

        width: 100%;
        height: auto;

        margin: 0;

        object-fit: contain;

        object-position:
            center top;
    }


    /* ================================================================
       LOWER DARK GRADIENT

       Gives us readable result copy even when the uploaded image
       is a clean visual without this text baked into it.
       ================================================================ */

    .ai-page .ai-frankenstein__background::after {
        content: "";

        position: absolute;

        z-index: 2;

        left: 0;
        right: 0;
        bottom: 0;

        height: 38%;

        pointer-events: none;

        background:
            linear-gradient(
                180deg,
                rgba(6,10,13,0) 0%,
                rgba(6,10,13,.58) 20%,
                rgba(6,10,13,.94) 55%,
                #080c10 100%
            );
    }


    /* ================================================================
       MOBILE RESULT COPY
       ================================================================ */

    .ai-page .ai-frankenstein-mobile-result {
        position: absolute;

        z-index: 5;

        left: 28px;
        right: 28px;
        bottom: 73px;

        display: block;

        color: #ffffff;
    }


    .ai-page .ai-frankenstein-mobile-result h3 {
        max-width: 610px;

        margin: 0;

        color: #ffffff;

        font-size: clamp(
            38px,
            8.5vw,
            50px
        );

        line-height: .91;

        font-weight: 900;

        letter-spacing: -.058em;
    }


    .ai-page .ai-frankenstein-mobile-result h3 span {
        display: block;

        color: #6c2cff;
    }


    .ai-page .ai-frankenstein-mobile-result p {
        max-width: 580px;

        margin:
            14px 0
            0;

        color:
            rgba(226,231,239,.76);

        font-size: clamp(
            12px,
            2.8vw,
            15px
        );

        line-height: 1.34;

        font-weight: 400;
    }


    /* ================================================================
       BOTTOM SIGNOFF
       ================================================================ */

    .ai-page .ai-frankenstein-mobile-signoff {
        position: absolute;

        z-index: 6;

        left: 28px;
        right: 28px;
        bottom: 22px;

        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 20px;

        color:
            rgba(223,228,236,.70);
    }


    .ai-page .ai-frankenstein-mobile-signoff span {
        position: relative;

        padding-left: 39px;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .20em;

        white-space: nowrap;
    }


    .ai-page .ai-frankenstein-mobile-signoff span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 27px;
        height: 1px;

        transform:
            translateY(-50%);

        background:
            rgba(222,227,235,.56);
    }


    .ai-page .ai-frankenstein-mobile-signoff strong {
        color:
            rgba(223,228,236,.70);

        text-align: right;

        font-size: 7px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .17em;

        white-space: nowrap;
    }

}


/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-frankenstein > .home-shell {
        max-width: none;
    }


    .ai-page .ai-frankenstein__copy {
        padding:
            31px 20px
            13px;
    }


    .ai-page .ai-frankenstein .ai-section-label {
        margin-bottom: 26px;
    }


    .ai-page .ai-frankenstein .ai-section-label small {
        font-size: 7.5px;
    }


    .ai-page .ai-frankenstein__copy h2 {
        font-size: 35px;
    }


    .ai-page .ai-frankenstein__text {
        margin-top: 12px;
    }


    .ai-page .ai-frankenstein__text p {
        font-size: 13px;
    }


    .ai-page .ai-frankenstein-mobile-result {
        left: 20px;
        right: 20px;

        bottom: 63px;
    }


    .ai-page .ai-frankenstein-mobile-result h3 {
        font-size: 33px;
    }


    .ai-page .ai-frankenstein-mobile-result p {
        margin-top: 10px;

        font-size: 11px;
    }


    .ai-page .ai-frankenstein-mobile-signoff {
        left: 20px;
        right: 20px;

        bottom: 19px;
    }


    .ai-page .ai-frankenstein-mobile-signoff span {
        padding-left: 31px;

        font-size: 6.5px;
    }


    .ai-page .ai-frankenstein-mobile-signoff span::before {
        width: 22px;
    }


    .ai-page .ai-frankenstein-mobile-signoff strong {
        font-size: 5.8px;
    }

}
/* ======================================================================
   AI OPERATIONS
   04 — THE REAL COST
   MOBILE
   ====================================================================== */

@media (min-width: 1024px) {

    .ai-page .ai-real-cost__copy--mobile,
    .ai-page .ai-real-cost-mobile-impact,
    .ai-page .ai-real-cost-mobile-signoff {
        display: none !important;
    }

}


@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-real-cost {
        position: relative;

        overflow: hidden;

        margin: 0;
        padding: 0;

        background: #071924;

        color: #ffffff;
    }


    .ai-page .ai-real-cost > .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding: 0;
    }


    /* ================================================================
       DESKTOP CONTENT OFF
       ================================================================ */

    .ai-page .ai-real-cost__copy--desktop,
    .ai-page .ai-real-cost__impact {
        display: none !important;
    }


    /* ================================================================
       MAIN MOBILE STAGE
       ================================================================ */

    .ai-page .ai-real-cost__inner {
        position: relative;

        display: block;

        min-height: 0;

        margin: 0;
        padding: 0;

        background: #071924;
    }


    /* ================================================================
       MOBILE COPY OVER IMAGE
       ================================================================ */

    .ai-page .ai-real-cost__copy--mobile {
        position: absolute;

        z-index: 6;

        top: 0;
        left: 0;
        right: 0;

        display: block;

        width: 100%;

        padding:
            34px 28px
            0;

        background: transparent;

        color: #0a0d16;

        pointer-events: none;
    }


    /* label */

    .ai-page .ai-real-cost__copy--mobile .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        margin:
            0 0
            28px;
    }


    .ai-page .ai-real-cost__copy--mobile .ai-section-label strong {
        color: #5625ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page .ai-real-cost__copy--mobile .ai-section-label > span {
        display: block;

        width: 28px;
        height: 1px;

        background: #838a9e;
    }


    .ai-page .ai-real-cost__copy--mobile .ai-section-label small {
        color: #606983;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .17em;

        text-transform: uppercase;
    }


    /* ================================================================
       TITLE
       ================================================================ */

    .ai-page .ai-real-cost__copy--mobile h2 {
        max-width: 610px;

        margin: 0;

        color: #090c14;

        font-size: clamp(
            39px,
            9vw,
            51px
        );

        line-height: .92;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-real-cost__copy--mobile h2 span {
        display: block;

        color: #5424ef;
    }


    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-real-cost__copy--mobile > p {
        max-width: 500px;

        margin:
            14px 0
            0;

        color: #616b88;

        font-size: clamp(
            14px,
            3.2vw,
            17px
        );

        line-height: 1.32;

        font-weight: 400;
    }


    /* ================================================================
       ICEBERG IMAGE
       ================================================================ */

    .ai-page .ai-real-cost__background {
        position: relative;

        display: block;

        width: 100%;
        height: auto;

        min-height: 0;

        margin: 0;

        overflow: hidden;

        background: #071924;
    }


    .ai-page picture.ai-real-cost__picture {
        display: block;

        width: 100%;
        height: auto;

        margin: 0;
    }


    .ai-page .ai-real-cost__picture img,
    .ai-page img.ai-real-cost__picture {
        display: block;

        width: 100%;
        height: auto;

        margin: 0;

        object-fit: contain;

        object-position: center top;
    }


    /* ================================================================
       MOBILE BOTTOM-LINE CARD
       ================================================================ */

    .ai-page .ai-real-cost-mobile-impact {
        position: absolute;

        z-index: 7;

        left: 22px;
        right: 22px;
        bottom: 70px;

        display: grid;

        grid-template-columns:
            82px
            minmax(0,1fr);

        gap: 20px;

        align-items: center;

        min-height: 116px;

        padding:
            17px 21px;

        border:
            1px solid
            rgba(108, 53, 255, .46);

        border-radius: 10px;

        background:
            linear-gradient(
                135deg,
                rgba(30,31,73,.94),
                rgba(15,20,46,.96)
            );

        box-shadow:
            0 12px 30px
            rgba(0,0,0,.18);

        color: #ffffff;
    }


    /* icon */

    .ai-page .ai-real-cost-mobile-impact__icon {
        display: flex;

        align-items: center;
        justify-content: center;

        height: 78px;

        border-right:
            1px solid
            rgba(255,255,255,.22);
    }


    .ai-page .ai-real-cost-mobile-impact__icon .ai-icon {
        display: grid;

        place-items: center;

        width: 64px;
        height: 64px;

        padding: 16px;

        border-radius: 50%;

        background:
            rgba(107,44,255,.14);

        color: #7534ff;
    }


    /* copy */

    .ai-page .ai-real-cost-mobile-impact__copy {
        min-width: 0;
    }


    .ai-page .ai-real-cost-mobile-impact__copy small {
        display: block;

        margin:
            0 0
            8px;

        color:
            rgba(224,228,240,.76);

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .16em;

        text-transform: uppercase;
    }


    .ai-page .ai-real-cost-mobile-impact__copy h3 {
        margin: 0;

        color: #ffffff;

        font-size: clamp(
            24px,
            5.5vw,
            31px
        );

        line-height: 1;

        font-weight: 900;

        letter-spacing: -.045em;
    }


    .ai-page .ai-real-cost-mobile-impact__copy h3 span {
        color: #702cff;
    }


    .ai-page .ai-real-cost-mobile-impact__copy p {
        margin:
            8px 0
            0;

        color:
            rgba(222,227,238,.73);

        font-size: 10px;
        line-height: 1.32;
    }


    /* ================================================================
       SIGNOFF
       ================================================================ */

    .ai-page .ai-real-cost-mobile-signoff {
        position: absolute;

        z-index: 8;

        left: 28px;
        right: 28px;
        bottom: 22px;

        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 18px;

        color:
            rgba(220,226,236,.70);
    }


    .ai-page .ai-real-cost-mobile-signoff span {
        position: relative;

        padding-left: 38px;

        font-size: 7px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        white-space: nowrap;
    }


    .ai-page .ai-real-cost-mobile-signoff span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 28px;
        height: 1px;

        transform: translateY(-50%);

        background:
            rgba(221,226,236,.58);
    }


    .ai-page .ai-real-cost-mobile-signoff strong {
        color:
            rgba(220,226,236,.70);

        text-align: right;

        font-size: 6px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .16em;

        white-space: nowrap;
    }

}


/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-real-cost > .home-shell {
        max-width: none;
    }


    .ai-page .ai-real-cost__copy--mobile {
        padding:
            29px 20px
            0;
    }


    .ai-page .ai-real-cost__copy--mobile .ai-section-label {
        margin-bottom: 24px;
    }


    .ai-page .ai-real-cost__copy--mobile h2 {
        font-size: 35px;
    }


    .ai-page .ai-real-cost__copy--mobile > p {
        margin-top: 11px;

        font-size: 13px;
    }


    .ai-page .ai-real-cost-mobile-impact {
        left: 14px;
        right: 14px;

        bottom: 58px;

        grid-template-columns:
            68px
            minmax(0,1fr);

        gap: 14px;

        min-height: 100px;

        padding:
            14px 16px;
    }


    .ai-page .ai-real-cost-mobile-impact__icon {
        height: 67px;
    }


    .ai-page .ai-real-cost-mobile-impact__icon .ai-icon {
        width: 54px;
        height: 54px;

        padding: 13px;
    }


    .ai-page .ai-real-cost-mobile-impact__copy h3 {
        font-size: 22px;
    }


    .ai-page .ai-real-cost-mobile-impact__copy p {
        font-size: 8.5px;
    }


    .ai-page .ai-real-cost-mobile-signoff {
        left: 20px;
        right: 20px;

        bottom: 18px;
    }


    .ai-page .ai-real-cost-mobile-signoff span {
        padding-left: 31px;

        font-size: 6px;
    }


    .ai-page .ai-real-cost-mobile-signoff span::before {
        width: 22px;
    }


    .ai-page .ai-real-cost-mobile-signoff strong {
        font-size: 5px;
    }

}
/* ======================================================================
   AI OPERATIONS
   05 — A DIFFERENT APPROACH
   MOBILE
   ====================================================================== */


/* ======================================================================
   DESKTOP VISIBILITY
   ====================================================================== */

@media (min-width: 1024px) {

    .ai-page .ai-approach__steps--mobile,
    .ai-page .ai-approach-mobile-signoff {
        display: none !important;
    }

}


/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-approach {
        position: relative;

        overflow: hidden;

        margin: 0;
        padding: 0;

        background: #070b0f;

        color: #ffffff;
    }


    .ai-page .ai-approach > .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 28px;
        padding-right: 28px;
    }



    /* ================================================================
       MAIN CONTENT
       ================================================================ */

    .ai-page .ai-approach__inner {
        position: relative;

        display: flex;
        flex-direction: column;

        margin: 0;

        padding-top: 35px;
        padding-bottom: 0;

        background: #070b0f;
    }



    /* ================================================================
       DESKTOP STEPS OFF
       ================================================================ */

    .ai-page .ai-approach__steps--desktop {
        display: none !important;
    }



    /* ================================================================
       COPY
       ================================================================ */

    .ai-page .ai-approach__copy {
        position: relative;

        z-index: 4;

        width: 100%;
        max-width: none;

        margin: 0;

        padding: 0;

        color: #ffffff;
    }



    /* ================================================================
       LABEL
       ================================================================ */

    .ai-page .ai-approach .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        width: 100%;

        margin:
            0 0
            25px;
    }


    .ai-page .ai-approach .ai-section-label strong {
        color: #d7d9e0;

        font-size: 12px;
        line-height: 1;

        font-weight: 500;

        letter-spacing: .04em;
    }


    .ai-page .ai-approach .ai-section-label > span {
        display: block;

        width: 31px;
        height: 1px;

        background:
            rgba(255,255,255,.54);
    }


    .ai-page .ai-approach .ai-section-label small {
        color:
            rgba(237,239,243,.73);

        font-size: 9px;
        line-height: 1;

        font-weight: 500;

        letter-spacing: .08em;

        text-transform: uppercase;
    }



    /* ================================================================
       TITLE
       ================================================================ */

    .ai-page .ai-approach__copy h2 {
        max-width: 580px;

        margin: 0;

        color: #ffffff;

        font-size: clamp(
            43px,
            9.8vw,
            57px
        );

        line-height: .91;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-approach__copy h2 span {
        display: block;

        color: #742cff;
    }



    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-approach__copy > p {
        max-width: 535px;

        margin:
            15px 0
            0;

        color:
            rgba(239,241,245,.84);

        font-size: clamp(
            14px,
            3.3vw,
            17px
        );

        line-height: 1.35;

        font-weight: 400;
    }


    .ai-page .ai-approach__copy > p + p {
        margin-top: 15px;
    }



    /* ================================================================
       CHAOS → CLARITY IMAGE
       ================================================================ */

    .ai-page .ai-approach__background {
        position: relative;

        display: block;

        order: 2;

        width:
            calc(
                100% +
                56px
            );

        min-height: 0;

        margin:
            2px -28px
            0;

        overflow: hidden;

        background: #070b0f;
    }


    .ai-page picture.ai-approach__picture {
        display: block;

        width: 100%;

        margin: 0;
    }


    .ai-page .ai-approach__picture img,
    .ai-page img.ai-approach__picture {
        display: block;

        width: 100%;
        height: auto;

        margin: 0;

        object-fit: contain;

        object-position:
            center center;
    }



    /* ================================================================
       MOBILE STEPS
       ================================================================ */

    .ai-page .ai-approach__steps--mobile {
        order: 3;

        display: grid;

        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );

        width: 100%;

        margin:
            18px 0
            0;

        padding:
            0 0
            22px;

        border-bottom:
            1px solid
            rgba(255,255,255,.22);
    }



    /* ================================================================
       INDIVIDUAL STEP
       ================================================================ */

    .ai-page .ai-approach__steps--mobile
    .ai-approach-step {
        position: relative;

        display: block;

        min-width: 0;

        margin: 0;

        padding:
            0 18px;

        border: 0;

        background: transparent;

        color: #ffffff;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step:first-child {
        padding-left: 0;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step:last-child {
        padding-right: 0;
    }


    /*
     * separators between the three steps
     */

    .ai-page .ai-approach__steps--mobile
    .ai-approach-step + .ai-approach-step {
        border-left:
            1px solid
            rgba(255,255,255,.20);
    }



    /* step number */

    .ai-page .ai-approach__steps--mobile
    .ai-approach-step > strong {
        position: relative;

        display: flex;

        align-items: center;

        gap: 11px;

        width: auto;
        height: auto;

        margin:
            0 0
            11px;

        padding: 0;

        border: 0;
        border-radius: 0;

        background: transparent;

        color: #7a31ff;

        font-size: 19px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step > strong::after {
        content: "";

        display: block;

        width: 31px;
        height: 1px;

        background: #7431f7;
    }



    /* title */

    .ai-page .ai-approach__steps--mobile
    .ai-approach-step h3 {
        margin: 0;

        color: #ffffff;

        font-size: 14px;
        line-height: 1.15;

        font-weight: 500;

        letter-spacing: -.01em;
    }



    /* description */

    .ai-page .ai-approach__steps--mobile
    .ai-approach-step p {
        margin:
            3px 0
            0;

        color:
            rgba(244,245,247,.90);

        font-size: 13px;
        line-height: 1.28;

        font-weight: 400;
    }



    /* ================================================================
       BOTTOM LINE
       ================================================================ */

    .ai-page .ai-approach__bottom {
        position: relative;

        display: block;

        margin: 0;

        padding: 0;

        border: 0;

        background: #070b0f;

        color: #ffffff;
    }


    .ai-page .ai-approach__bottom-inner {
        display: block;

        width: 100%;
        max-width: 690px;

        margin:
            0 auto;

        padding:
            20px 28px
            15px;
    }



    /* hide desktop bottom label */

    .ai-page .ai-approach__bottom-inner small {
        display: none;
    }



    /* bottom title */

    .ai-page .ai-approach__bottom-inner h3 {
        max-width: 510px;

        margin: 0;

        color: #ffffff;

        font-size: clamp(
            25px,
            5.8vw,
            33px
        );

        line-height: 1.02;

        font-weight: 500;

        letter-spacing: -.03em;
    }


    .ai-page .ai-approach__bottom-inner h3 span {
        display: block;

        color: #7430ff;

        font-weight: 800;
    }



    /*
     * supporting desktop paragraph is not shown
     * in your mobile reference
     */

    .ai-page .ai-approach__bottom-inner > p {
        display: none;
    }



    /* ================================================================
       MOBILE SIGNOFF
       ================================================================ */

    .ai-page .ai-approach-mobile-signoff {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 20px;

        max-width: 690px;

        margin:
            0 auto;

        padding:
            24px 28px
            31px;

        color:
            rgba(217,222,232,.72);
    }


    .ai-page .ai-approach-mobile-signoff span {
        font-size: 7px;
        line-height: 1;

        font-weight: 700;

        letter-spacing: .18em;

        white-space: nowrap;
    }


    .ai-page .ai-approach-mobile-signoff strong {
        color:
            rgba(217,222,232,.72);

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .11em;

        white-space: nowrap;
    }

}



/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-approach > .home-shell {
        padding-left: 20px;
        padding-right: 20px;
    }


    .ai-page .ai-approach__inner {
        padding-top: 31px;
    }


    .ai-page .ai-approach .ai-section-label {
        margin-bottom: 21px;
    }


    .ai-page .ai-approach__copy h2 {
        font-size: 38px;
    }


    .ai-page .ai-approach__copy > p {
        font-size: 13px;
    }


    .ai-page .ai-approach__background {
        width:
            calc(
                100% +
                40px
            );

        margin-left: -20px;
        margin-right: -20px;
    }


    .ai-page .ai-approach__steps--mobile {
        margin-top: 15px;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step {
        padding:
            0 12px;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step > strong {
        font-size: 17px;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step > strong::after {
        width: 25px;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step h3 {
        font-size: 12px;
    }


    .ai-page .ai-approach__steps--mobile
    .ai-approach-step p {
        font-size: 11px;
    }


    .ai-page .ai-approach__bottom-inner {
        padding:
            18px 20px
            12px;
    }


    .ai-page .ai-approach__bottom-inner h3 {
        font-size: 24px;
    }


    .ai-page .ai-approach-mobile-signoff {
        padding:
            22px 20px
            27px;
    }


    .ai-page .ai-approach-mobile-signoff span {
        font-size: 5.7px;
    }


    .ai-page .ai-approach-mobile-signoff strong {
        font-size: 6.8px;
    }

}
/* ======================================================================
   AI OPERATIONS
   06 — THE OPERATING SYSTEM
   MOBILE
   ====================================================================== */


/* ======================================================================
   DESKTOP VISIBILITY
   ====================================================================== */

@media (min-width: 1024px) {

    .ai-page .ai-operating-system__copy--mobile,
    .ai-page .ai-operating-system-mobile-result,
    .ai-page .ai-operating-system-mobile-signoff {
        display: none !important;
    }

}


/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-operating-system {
        position: relative;

        overflow: hidden;

        margin: 0;

        padding:
            36px 0
            30px;

        background: #ffffff;

        color: #090c16;
    }


    .ai-page .ai-operating-system > .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 28px;
        padding-right: 28px;
    }



    /* ================================================================
       DESKTOP ELEMENTS OFF
       ================================================================ */

    .ai-page .ai-operating-system__copy--desktop,
    .ai-page .ai-operating-system__result {
        display: none !important;
    }



    /* ================================================================
       MAIN LAYOUT
       ================================================================ */

    .ai-page .ai-operating-system__inner {
        display: block;

        min-height: 0;

        padding-top: 0;
        padding-bottom: 0;
    }



    /* ================================================================
       MOBILE COPY
       ================================================================ */

    .ai-page .ai-operating-system__copy--mobile {
        display: block;

        width: 100%;
        max-width: none;

        margin: 0;
        padding: 0;
    }



    /* ================================================================
       LABEL
       ================================================================ */

    .ai-page
    .ai-operating-system__copy--mobile
    .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        margin:
            0 0
            35px;
    }


    .ai-page
    .ai-operating-system__copy--mobile
    .ai-section-label strong {
        color: #5727ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page
    .ai-operating-system__copy--mobile
    .ai-section-label > span {
        display: block;

        width: 28px;
        height: 1px;

        background: #9399a8;
    }


    .ai-page
    .ai-operating-system__copy--mobile
    .ai-section-label small {
        color: #606a85;

        font-size: 8px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .17em;

        text-transform: uppercase;
    }



    /* ================================================================
       TITLE
       ================================================================ */

    .ai-page .ai-operating-system__copy--mobile h2 {
        max-width: 600px;

        margin: 0;

        color: #080b13;

        font-size: clamp(
            39px,
            9vw,
            50px
        );

        line-height: .91;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-operating-system__copy--mobile h2 span {
        display: block;

        color: #080b13;
    }



    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-operating-system__copy--mobile > p {
        max-width: 580px;

        margin:
            14px 0
            0;

        color: #67718d;

        font-size: clamp(
            14px,
            3.3vw,
            17px
        );

        line-height: 1.32;

        font-weight: 400;
    }



    /* ================================================================
       OPERATING MODEL IMAGE
       ================================================================ */

    .ai-page .ai-operating-model {
        position: relative;

        display: block;

        width: 100%;

        margin:
            11px 0
            0;

        padding: 0;

        min-height: 0;

        border: 0;

        background: transparent;

        box-shadow: none;
    }


    .ai-page picture.ai-operating-model__picture {
        display: block;

        width: 100%;

        margin: 0;
    }


    .ai-page .ai-operating-model__picture img,
    .ai-page img.ai-operating-model__picture {
        display: block;

        width: 100%;
        height: auto;

        margin: 0 auto;

        object-fit: contain;

        object-position:
            center center;
    }



    /* ================================================================
       RESULT DIVIDER
       ================================================================ */

    .ai-page .ai-operating-system-mobile-result {
        display: grid;

        grid-template-columns:
            88px
            minmax(0,1fr);

        gap: 22px;

        align-items: center;

        margin-top: 17px;

        padding:
            27px 0
            4px;

        border-top:
            1px solid
            #dddfe7;
    }



    /* ================================================================
       RESULT ICON
       ================================================================ */

    .ai-page
    .ai-operating-system-mobile-result__icon {
        display: flex;

        align-items: center;
        justify-content: center;

        min-height: 90px;

        border-right:
            1px solid
            #d9dbe5;
    }


    .ai-page
    .ai-operating-system-mobile-result__icon
    .ai-icon {
        display: grid;

        place-items: center;

        width: 66px;
        height: 66px;

        padding: 16px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #f1efff,
                #faf9ff
            );

        color: #4d5266;
    }



    /* ================================================================
       RESULT TEXT
       ================================================================ */

    .ai-page .ai-operating-system-mobile-result > p {
        max-width: 490px;

        margin: 0;

        color: #10131b;

        font-size: clamp(
            20px,
            4.7vw,
            27px
        );

        line-height: 1.09;

        font-weight: 600;

        letter-spacing: -.035em;
    }


    .ai-page .ai-operating-system-mobile-result > p strong {
        color: #5425ed;

        font-weight: 800;
    }



    /* ================================================================
       SIGNOFF
       ================================================================ */

    .ai-page .ai-operating-system-mobile-signoff {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 20px;

        margin-top: 65px;

        color: #68718c;
    }


    .ai-page .ai-operating-system-mobile-signoff span {
        position: relative;

        padding-left: 39px;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        white-space: nowrap;
    }


    .ai-page
    .ai-operating-system-mobile-signoff
    span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 28px;
        height: 1px;

        transform: translateY(-50%);

        background: #959bab;
    }


    .ai-page .ai-operating-system-mobile-signoff strong {
        color: #68718c;

        text-align: right;

        font-size: 7px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .16em;

        white-space: nowrap;
    }

}


/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-operating-system {
        padding:
            31px 0
            27px;
    }


    .ai-page .ai-operating-system > .home-shell {
        padding-left: 20px;
        padding-right: 20px;
    }


    .ai-page
    .ai-operating-system__copy--mobile
    .ai-section-label {
        margin-bottom: 29px;
    }


    .ai-page
    .ai-operating-system__copy--mobile
    .ai-section-label small {
        font-size: 7px;
    }


    .ai-page .ai-operating-system__copy--mobile h2 {
        font-size: 35px;
    }


    .ai-page .ai-operating-system__copy--mobile > p {
        margin-top: 11px;

        font-size: 13px;
    }


    .ai-page .ai-operating-model {
        margin-top: 8px;
    }


    .ai-page .ai-operating-system-mobile-result {
        grid-template-columns:
            68px
            minmax(0,1fr);

        gap: 16px;

        margin-top: 13px;

        padding-top: 22px;
    }


    .ai-page
    .ai-operating-system-mobile-result__icon {
        min-height: 76px;
    }


    .ai-page
    .ai-operating-system-mobile-result__icon
    .ai-icon {
        width: 55px;
        height: 55px;

        padding: 13px;
    }


    .ai-page .ai-operating-system-mobile-result > p {
        font-size: 19px;
    }


    .ai-page .ai-operating-system-mobile-signoff {
        margin-top: 50px;
    }


    .ai-page .ai-operating-system-mobile-signoff span {
        padding-left: 31px;

        font-size: 6px;
    }


    .ai-page
    .ai-operating-system-mobile-signoff
    span::before {
        width: 22px;
    }


    .ai-page .ai-operating-system-mobile-signoff strong {
        font-size: 5.5px;
    }

}
/* ======================================================================
   AI OPERATIONS
   07 — THE METHODOLOGY
   MOBILE
   ====================================================================== */


/* ======================================================================
   DESKTOP VISIBILITY
   ====================================================================== */

@media (min-width: 1024px) {

    .ai-page .ai-methodology__heading--mobile,
    .ai-page .ai-methodology__steps--mobile,
    .ai-page .ai-methodology-mobile-result,
    .ai-page .ai-methodology-mobile-signoff {
        display: none !important;
    }

}


/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-methodology {
        position: relative;

        overflow: hidden;

        margin: 0;

        padding:
            34px 0
            28px;

        background: #ffffff;

        color: #090c15;
    }


    .ai-page .ai-methodology > .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 28px;
        padding-right: 28px;
    }



    /* ================================================================
       DESKTOP ELEMENTS OFF
       ================================================================ */

    .ai-page .ai-methodology__heading--desktop,
    .ai-page .ai-methodology__steps--desktop,
    .ai-page .ai-methodology__result--desktop {
        display: none !important;
    }



    /* ================================================================
       MAIN INNER
       ================================================================ */

    .ai-page .ai-methodology__inner {
        display: block;

        padding-top: 0;
        padding-bottom: 0;
    }



    /* ================================================================
       MOBILE HEADING
       ================================================================ */

    .ai-page .ai-methodology__heading--mobile {
        display: block;

        width: 100%;

        margin: 0;
    }



    /* ================================================================
       SECTION LABEL
       ================================================================ */

    .ai-page
    .ai-methodology__heading--mobile
    .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        margin:
            0 0
            27px;
    }


    .ai-page
    .ai-methodology__heading--mobile
    .ai-section-label strong {
        color: #5527eb;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page
    .ai-methodology__heading--mobile
    .ai-section-label > span {
        display: block;

        width: 28px;
        height: 1px;

        background: #9399aa;
    }


    .ai-page
    .ai-methodology__heading--mobile
    .ai-section-label small {
        color: #65708b;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        text-transform: uppercase;
    }



    /* ================================================================
       HEADING
       ================================================================ */

    .ai-page .ai-methodology__heading--mobile h2 {
        max-width: 590px;

        margin: 0;

        color: #070a12;

        font-size: clamp(
            40px,
            9.3vw,
            52px
        );

        line-height: .90;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-methodology__heading--mobile h2 span {
        display: block;

        color: #5423ed;
    }



    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-methodology__heading--mobile > p {
        max-width: 560px;

        margin:
            13px 0
            0;

        color: #68718e;

        font-size: clamp(
            14px,
            3.25vw,
            17px
        );

        line-height: 1.32;

        font-weight: 400;
    }



    /* ================================================================
       MOBILE STEP LIST
       ================================================================ */

    .ai-page .ai-methodology__steps--mobile {
        position: relative;

        display: grid;

        gap: 9px;

        width: 100%;

        margin-top: 18px;
    }



    /*
     * vertical timeline running through the numbered circles
     */

    .ai-page .ai-methodology__steps--mobile::before {
        content: "";

        position: absolute;

        z-index: 0;

        left: 23px;
        top: 33px;
        bottom: 33px;

        width: 1px;

        background: #aeb3bf;
    }



    /* ================================================================
       STEP CARD
       ================================================================ */

    .ai-page .ai-method-step-mobile {
        position: relative;

        z-index: 1;

        display: grid;

        grid-template-columns:
            47px
            72px
            minmax(0,1fr);

        align-items: center;

        min-height: 69px;

        padding:
            8px 17px
            8px 0;

        border:
            1px solid
            #f1f0f7;

        border-radius: 9px;

        background:
            linear-gradient(
                90deg,
                #faf9ff 0%,
                #fdfcff 100%
            );

        box-shadow:
            0 3px 13px
            rgba(62,55,110,.028);
    }



    /* ================================================================
       STEP NUMBER
       ================================================================ */

    .ai-page .ai-method-step-mobile__number {
        position: relative;

        z-index: 2;

        display: grid;

        place-items: center;

        width: 39px;
        height: 39px;

        margin-left: 4px;

        border-radius: 50%;

        background: #f2efff;

        color: #5425ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }



    /* ================================================================
       STEP ICON
       ================================================================ */

    .ai-page .ai-method-step-mobile__icon {
        display: flex;

        align-items: center;
        justify-content: center;

        min-height: 50px;

        border-right:
            1px solid
            #d9dbe5;
    }


    .ai-page .ai-method-step-mobile__icon .ai-icon {
        display: grid;

        place-items: center;

        width: 46px;
        height: 46px;

        padding: 11px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #f1efff,
                #fbfaff
            );

        color: #111522;
    }


    .ai-page
    .ai-method-step-mobile__icon
    .ai-icon svg {
        width: 100%;
        height: 100%;

        fill: none;

        stroke: currentColor;

        stroke-width: 1.7;

        stroke-linecap: round;
        stroke-linejoin: round;
    }



    /* ================================================================
       STEP COPY
       ================================================================ */

    .ai-page .ai-method-step-mobile__copy {
        min-width: 0;

        padding-left: 18px;
    }


    .ai-page .ai-method-step-mobile__copy h3 {
        margin: 0;

        color: #090c14;

        font-size: 15px;
        line-height: 1.08;

        font-weight: 900;

        letter-spacing: -.025em;
    }


    .ai-page .ai-method-step-mobile__copy p {
        margin:
            4px 0
            0;

        color: #707993;

        font-size: 11px;
        line-height: 1.28;

        font-weight: 400;
    }



    /* ================================================================
       MOBILE RESULT PANEL
       ================================================================ */

    .ai-page .ai-methodology-mobile-result {
        display: grid;

        grid-template-columns:
            minmax(0,1fr)
            22px
            minmax(0,1fr)
            22px
            minmax(0,1fr);

        align-items: center;

        gap: 4px;

        margin-top: 14px;

        padding:
            20px 10px;

        border:
            1px solid
            #efedf9;

        border-radius: 10px;

        background:
            linear-gradient(
                135deg,
                #faf9ff,
                #f5f3ff
            );
    }



    /* arrows */

    .ai-page .ai-methodology-mobile-result > b {
        color: #68718c;

        text-align: center;

        font-size: 20px;
        line-height: 1;

        font-weight: 400;
    }



    /* each result */

    .ai-page .ai-methodology-mobile-result__item {
        min-width: 0;

        text-align: center;
    }


    .ai-page .ai-methodology-mobile-result__icon {
        display: grid;

        place-items: center;

        width: 53px;
        height: 53px;

        margin:
            0 auto
            8px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #eeebff,
                #fbfaff
            );

        color: #151925;
    }


    .ai-page
    .ai-methodology-mobile-result__icon
    .ai-icon {
        width: 29px;
        height: 29px;

        padding: 0;

        color: inherit;
    }


    .ai-page
    .ai-methodology-mobile-result__icon
    .ai-icon svg {
        width: 100%;
        height: 100%;

        fill: none;

        stroke: currentColor;

        stroke-width: 1.7;
    }



    /* economics arrow */

    .ai-page .ai-methodology-mobile-result__trend {
        display: block;

        color: #151925;

        font-size: 35px;
        line-height: 1;

        font-weight: 300;

        transform: translateY(-1px);
    }



    /* Better */

    .ai-page .ai-methodology-mobile-result__item > span {
        display: block;

        color: #0a0d15;

        font-size: 14px;
        line-height: 1;

        font-weight: 900;

        letter-spacing: -.025em;
    }



    /* Process / Technology / Economics */

    .ai-page .ai-methodology-mobile-result__item > strong {
        display: block;

        margin-top: 1px;

        color: #5424ef;

        font-size: 14px;
        line-height: 1;

        font-weight: 900;

        letter-spacing: -.035em;
    }



    /* ================================================================
       MOBILE SIGNOFF
       ================================================================ */

    .ai-page .ai-methodology-mobile-signoff {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 20px;

        margin-top: 28px;

        color: #68718c;
    }


    .ai-page .ai-methodology-mobile-signoff span {
        position: relative;

        padding-left: 39px;

        font-size: 7px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        white-space: nowrap;
    }


    .ai-page
    .ai-methodology-mobile-signoff
    span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 28px;
        height: 1px;

        transform: translateY(-50%);

        background: #959bab;
    }


    .ai-page .ai-methodology-mobile-signoff strong {
        color: #68718c;

        text-align: right;

        font-size: 6px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .16em;

        white-space: nowrap;
    }

}



/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-methodology {
        padding:
            30px 0
            24px;
    }


    .ai-page .ai-methodology > .home-shell {
        padding-left: 20px;
        padding-right: 20px;
    }


    .ai-page
    .ai-methodology__heading--mobile
    .ai-section-label {
        margin-bottom: 23px;
    }


    .ai-page .ai-methodology__heading--mobile h2 {
        font-size: 35px;
    }


    .ai-page .ai-methodology__heading--mobile > p {
        margin-top: 10px;

        font-size: 13px;
    }


    .ai-page .ai-methodology__steps--mobile {
        gap: 7px;

        margin-top: 16px;
    }


    .ai-page .ai-method-step-mobile {
        grid-template-columns:
            43px
            60px
            minmax(0,1fr);

        min-height: 62px;

        padding-right: 12px;
    }


    .ai-page .ai-methodology__steps--mobile::before {
        left: 20px;
    }


    .ai-page .ai-method-step-mobile__number {
        width: 35px;
        height: 35px;

        font-size: 11px;
    }


    .ai-page .ai-method-step-mobile__icon {
        min-height: 45px;
    }


    .ai-page .ai-method-step-mobile__icon .ai-icon {
        width: 40px;
        height: 40px;

        padding: 10px;
    }


    .ai-page .ai-method-step-mobile__copy {
        padding-left: 13px;
    }


    .ai-page .ai-method-step-mobile__copy h3 {
        font-size: 13px;
    }


    .ai-page .ai-method-step-mobile__copy p {
        font-size: 9.5px;
    }


    .ai-page .ai-methodology-mobile-result {
        grid-template-columns:
            minmax(0,1fr)
            17px
            minmax(0,1fr)
            17px
            minmax(0,1fr);

        padding:
            17px 5px;
    }


    .ai-page .ai-methodology-mobile-result__icon {
        width: 44px;
        height: 44px;
    }


    .ai-page
    .ai-methodology-mobile-result__icon
    .ai-icon {
        width: 24px;
        height: 24px;
    }


    .ai-page .ai-methodology-mobile-result__trend {
        font-size: 29px;
    }


    .ai-page .ai-methodology-mobile-result__item > span,
    .ai-page .ai-methodology-mobile-result__item > strong {
        font-size: 11px;
    }


    .ai-page .ai-methodology-mobile-result > b {
        font-size: 15px;
    }


    .ai-page .ai-methodology-mobile-signoff {
        margin-top: 25px;
    }


    .ai-page .ai-methodology-mobile-signoff span {
        padding-left: 31px;

        font-size: 5.5px;
    }


    .ai-page
    .ai-methodology-mobile-signoff
    span::before {
        width: 22px;
    }


    .ai-page .ai-methodology-mobile-signoff strong {
        font-size: 5px;
    }

}
/* ======================================================================
   AI OPERATIONS
   09 — WHAT WE BUILD
   COMPLETE CSS
   ====================================================================== */


/* ======================================================================
   BASE
   ====================================================================== */

.ai-page .ai-what-we-build {
    position: relative;
    overflow: hidden;

    background: #ffffff;
    color: #080b13;
}


.ai-page .ai-what-we-build__inner {
    position: relative;
}



/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {

    .ai-page .ai-what-we-build {
        padding:
            32px 0
            26px;
    }


    .ai-page .ai-what-we-build > .home-shell {
        width: 100%;
        max-width: 680px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 22px;
        padding-right: 22px;
    }


    /* --------------------------------------------------------------
       label
       -------------------------------------------------------------- */

    .ai-page .ai-what-we-build .ai-section-label {
        display: flex;

        align-items: center;

        gap: 12px;

        margin:
            0 0
            24px;
    }


    .ai-page .ai-what-we-build .ai-section-label strong {
        color: #5424ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page .ai-what-we-build .ai-section-label > span {
        width: 29px;
        height: 1px;

        background: #949baa;
    }


    .ai-page .ai-what-we-build .ai-section-label small {
        color: #65708c;

        font-size: 8px;

        font-weight: 800;

        letter-spacing: .17em;

        text-transform: uppercase;
    }


    /* --------------------------------------------------------------
       heading
       -------------------------------------------------------------- */

    .ai-page .ai-what-we-build__heading h2 {
        margin: 0;

        color: #070a11;

        font-size: clamp(
            39px,
            9vw,
            52px
        );

        line-height: .89;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-what-we-build__heading h2 span {
        display: block;

        color: #5020ed;
    }


    .ai-page .ai-what-we-build__heading > p {
        margin:
            14px 0
            0;

        color: #68728e;

        font-size: 14px;
        line-height: 1.32;
    }


    /* --------------------------------------------------------------
       cards stacked
       -------------------------------------------------------------- */

    .ai-page .ai-build-grid {
        display: grid;

        grid-template-columns: 1fr;

        gap: 9px;

        margin-top: 19px;
    }


    .ai-page .ai-build-card {
        display: grid;

        grid-template-columns:
            60px
            minmax(115px,.9fr)
            minmax(160px,1.2fr);

        align-items: center;

        gap: 11px;

        min-height: 90px;

        padding:
            9px 11px;

        border:
            1px solid
            #ededf5;

        border-radius: 10px;

        background: #ffffff;

        box-shadow:
            0 4px 16px
            rgba(48,38,102,.04);
    }


    .ai-page .ai-build-card__icon {
        display: grid;

        place-items: center;

        width: 55px;
        height: 55px;

        margin: 0;

        border-radius: 9px;

        background: #f1efff;

        color: #4e21ec;
    }


    .ai-page .ai-build-card__icon .ai-icon,
    .ai-page .ai-build-card__icon svg {
        width: 30px;
        height: 30px;
    }


    .ai-page .ai-build-card__copy h3 {
        margin: 0;

        font-size: 14px;
        line-height: 1.05;

        font-weight: 900;
    }


    .ai-page .ai-build-card__copy p {
        margin:
            4px 0
            0;

        color: #626e89;

        font-size: 9px;
        line-height: 1.2;
    }


    /* --------------------------------------------------------------
       automation
       -------------------------------------------------------------- */

    .ai-page .ai-build-card--automation
    .ai-build-workflow {
        display: flex;

        align-items: center;

        gap: 4px;

        margin: 0;
        padding: 0;
    }


    .ai-page .ai-build-card--automation
    .ai-build-workflow__row {
        display: flex;

        flex: 1 1 0;

        flex-direction: column;

        align-items: center;
        justify-content: center;

        min-width: 0;
        height: 57px;

        padding: 4px;

        border:
            1px solid
            #eeeeF6;

        border-radius: 7px;

        background: #ffffff;
    }


    .ai-page .ai-build-card--automation
    .ai-build-workflow__row .ai-icon,
    .ai-page .ai-build-card--automation
    .ai-build-workflow__row svg {
        width: 20px;
        height: 20px;

        color: #5020ed;
    }


    .ai-page .ai-build-card--automation
    .ai-build-workflow__row span {
        margin-top: 3px;

        color: #59647f;

        text-align: center;

        font-size: 5.8px;
        line-height: 1;
    }


    .ai-page .ai-build-card--automation
    .ai-build-workflow__arrow {
        transform: rotate(-90deg);

        color: #5120ec;

        font-size: 11px;
    }


    /* --------------------------------------------------------------
       integrations
       ORIGINAL CLASSES
       -------------------------------------------------------------- */

    .ai-page .ai-build-card--integrations
    .ai-integration-grid {
        display: grid;

        grid-template-columns:
            repeat(
                6,
                minmax(0,1fr)
            );

        gap: 4px;

        margin: 0;
        padding: 0;
    }


    .ai-page .ai-build-card--integrations
    .ai-integration-logo {
        display: grid;

        place-items: center;

        height: 40px;

        padding: 3px;

        border:
            1px solid
            #ededf5;

        border-radius: 6px;

        background: #ffffff;
    }


    .ai-page .ai-build-card--integrations
    .ai-integration-logo img {
        max-width: 27px;
        max-height: 27px;

        object-fit: contain;
    }


    /* --------------------------------------------------------------
       SOP
       -------------------------------------------------------------- */

    .ai-page .ai-build-card--sops
    .ai-build-list {
        display: grid;

        gap: 4px;

        margin: 0;
        padding: 0;
    }


    .ai-page .ai-build-card--sops
    .ai-build-list__row {
        display: flex;

        align-items: center;

        gap: 5px;

        min-height: 19px;

        margin: 0;
        padding: 0;

        border: 0;

        background: transparent;
    }


    .ai-page .ai-build-card--sops
    .ai-build-list__row .ai-icon,
    .ai-page .ai-build-card--sops
    .ai-build-list__row svg {
        width: 12px;
        height: 12px;

        color: #5020ed;
    }


    .ai-page .ai-build-card--sops
    .ai-build-list__row span {
        color: #59647f;

        font-size: 6.5px;
    }


    /* --------------------------------------------------------------
       dashboard
       -------------------------------------------------------------- */

    .ai-page .ai-dashboard-mini {
        display: grid;

        grid-template-columns:
            minmax(0,1.25fr)
            minmax(62px,.75fr);

        gap: 6px;

        margin: 0;
        padding: 0;
    }


    .ai-page .ai-dashboard-mini__chart {
        height: 64px;
    }


    .ai-page .ai-dashboard-mini__chart img {
        width: 100%;
        height: 64px;

        object-fit: contain;
    }


    .ai-page .ai-dashboard-mini__metrics {
        display: grid;

        align-content: center;

        gap: 4px;
    }


    .ai-page .ai-dashboard-mini__metric {
        display: flex;

        align-items: center;

        gap: 4px;
    }


    .ai-page .ai-dashboard-mini__metric .ai-icon,
    .ai-page .ai-dashboard-mini__metric svg {
        width: 12px;
        height: 12px;

        color: #5020ed;
    }


    .ai-page .ai-dashboard-mini__metric span {
        color: #59647f;

        font-size: 6px;
    }


    /* --------------------------------------------------------------
       team
       -------------------------------------------------------------- */

    .ai-page .ai-build-card--team
    .ai-build-list {
        display: grid;

        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );

        gap: 4px;

        margin: 0;
        padding: 0;
    }


    .ai-page .ai-build-card--team
    .ai-build-list__row {
        display: flex;

        flex-direction: column;

        align-items: center;
        justify-content: center;

        height: 57px;

        padding: 4px;

        border:
            1px solid
            #eeeeF6;

        border-radius: 7px;

        background: #fff;
    }


    .ai-page .ai-build-card--team
    .ai-build-list__row .ai-icon,
    .ai-page .ai-build-card--team
    .ai-build-list__row svg {
        width: 20px;
        height: 20px;

        color: #5020ed;
    }


    .ai-page .ai-build-card--team
    .ai-build-list__row span {
        margin-top: 3px;

        color: #59647f;

        text-align: center;

        font-size: 5.8px;
    }


    /* --------------------------------------------------------------
       bottom band
       -------------------------------------------------------------- */

    .ai-page .ai-build-bottom {
        display: grid;

        grid-template-columns:
            76px
            1px
            minmax(0,1fr);

        align-items: center;

        gap: 17px;

        margin-top: 12px;

        padding:
            14px 18px;

        border:
            1px solid
            #eceafb;

        border-radius: 10px;

        background:
            linear-gradient(
                120deg,
                #f8f6ff,
                #f0edff
            );
    }


    .ai-page .ai-build-bottom__icon {
        display: grid;

        place-items: center;

        width: 67px;
        height: 67px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #3510df,
                #671cff
            );

        color: #ffffff;
    }


    .ai-page .ai-build-bottom__icon .ai-icon,
    .ai-page .ai-build-bottom__icon svg {
        width: 36px;
        height: 36px;
    }


    .ai-page .ai-build-bottom__divider {
        align-self: stretch;

        width: 1px;

        background:
            rgba(
                79,
                34,
                237,
                .40
            );
    }


    .ai-page .ai-build-bottom__copy h3 {
        margin: 0;

        font-size: 23px;
        line-height: .96;

        font-weight: 900;

        letter-spacing: -.045em;
    }


    .ai-page .ai-build-bottom__copy h3 span {
        display: block;

        color: #5020ed;
    }


    .ai-page .ai-build-bottom__copy p {
        margin:
            6px 0
            0;

        color: #66708b;

        font-size: 10px;
        line-height: 1.2;
    }

}
/* ======================================================================
   AI OPERATIONS
   10 — THE OUTCOME
   MOBILE ONLY
   ====================================================================== */


@media (min-width: 1024px) {

    .ai-page .ai-outcome__copy--mobile,
    .ai-page .ai-outcome-mobile-benefits,
    .ai-page .ai-outcome-mobile-signoff {
        display: none !important;
    }

}



@media (max-width: 1023px) {


    /* ==================================================================
       SECTION
       ================================================================== */

    .ai-page .ai-outcome {
        position: relative;

        overflow: hidden;

        min-height: 1030px;

        margin: 0;

        padding:
            34px 0
            28px;

        background: #f8f9fc;

        color: #080b13;
    }


    .ai-page .ai-outcome > .home-shell {
        width: 100%;
        max-width: 690px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 28px;
        padding-right: 28px;
    }



    /* ==================================================================
       DESKTOP ELEMENTS OFF
       ================================================================== */

    .ai-page .ai-outcome__copy--desktop,
    .ai-page .ai-outcome__milestones,
    .ai-page .ai-outcome__benefits {
        display: none !important;
    }



    /* ==================================================================
       MOUNTAIN BACKGROUND
       ================================================================== */

    .ai-page .ai-outcome__background {
        position: absolute;

        z-index: 0;

        inset: 0;

        display: block;

        width: 100%;
        height: 100%;

        overflow: hidden;

        pointer-events: none;
    }


    .ai-page picture.ai-outcome__picture {
        display: block;

        width: 100%;
        height: 100%;
    }


    .ai-page .ai-outcome__picture img,
    .ai-page img.ai-outcome__picture {
        display: block;

        width: 100%;
        height: 100%;

        object-fit: cover;

        object-position:
            center top;
    }



    /* ==================================================================
       CONTENT LAYER
       ================================================================== */

    .ai-page .ai-outcome__inner {
        position: relative;

        z-index: 2;

        display: block;

        min-height: 760px;

        padding: 0;
    }



    /* ==================================================================
       MOBILE HEADING
       ================================================================== */

    .ai-page .ai-outcome__copy--mobile {
        display: block;

        width: 100%;
        max-width: 570px;

        margin: 0;

        padding: 0;
    }



    /* label */

    .ai-page
    .ai-outcome__copy--mobile
    .ai-section-label {
        display: flex;

        align-items: center;

        gap: 13px;

        margin:
            0 0
            26px;
    }


    .ai-page
    .ai-outcome__copy--mobile
    .ai-section-label strong {
        color: #5223eb;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page
    .ai-outcome__copy--mobile
    .ai-section-label > span {
        width: 28px;
        height: 1px;

        background: #878fa3;
    }


    .ai-page
    .ai-outcome__copy--mobile
    .ai-section-label small {
        color: #626d87;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        text-transform: uppercase;
    }



    /* ==================================================================
       TITLE
       ================================================================== */

    .ai-page .ai-outcome__copy--mobile h2 {
        max-width: 570px;

        margin: 0;

        color: #060910;

        font-size: clamp(
            43px,
            9.7vw,
            55px
        );

        line-height: .91;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-outcome__copy--mobile h2 strong {
        display: block;

        color: #5120ef;

        font-weight: inherit;
    }


    .ai-page .ai-outcome__copy--mobile h2 span {
        display: block;

        color: #060910;
    }



    /* ==================================================================
       INTRO
       ================================================================== */

    .ai-page .ai-outcome__copy--mobile > p {
        max-width: 460px;

        margin:
            14px 0
            0;

        color: #66718e;

        font-size: clamp(
            14px,
            3.25vw,
            17px
        );

        line-height: 1.3;
    }



    /* ==================================================================
       MOBILE BENEFITS
       ================================================================== */

    .ai-page .ai-outcome-mobile-benefits {
        display: grid;

        gap: 26px;

        width: 58%;
        max-width: 350px;

        margin-top: 34px;
    }


    .ai-page .ai-outcome-mobile-benefit {
        display: grid;

        grid-template-columns:
            58px
            minmax(0,1fr);

        align-items: center;

        gap: 16px;

        min-width: 0;
    }



    /* benefit icon */

    .ai-page
    .ai-outcome-mobile-benefit__icon {
        display: grid;

        place-items: center;

        width: 52px;
        height: 52px;

        border-radius: 50%;

        background:
            rgba(
                242,
                239,
                255,
                .92
            );

        color: #5422ed;
    }


    .ai-page
    .ai-outcome-mobile-benefit__icon
    .ai-icon,
    .ai-page
    .ai-outcome-mobile-benefit__icon
    svg {
        width: 27px;
        height: 27px;
    }



    /* benefit copy */

    .ai-page .ai-outcome-mobile-benefit h3 {
        margin: 0;

        color: #090c13;

        font-size: 15px;
        line-height: 1.08;

        font-weight: 900;

        letter-spacing: -.025em;
    }


    .ai-page .ai-outcome-mobile-benefit p {
        max-width: 205px;

        margin:
            4px 0
            0;

        color: #66718d;

        font-size: 10px;
        line-height: 1.25;
    }



    /* ==================================================================
       FINAL WHITE CARD
       ================================================================== */

    .ai-page .ai-outcome__final {
        position: relative;

        z-index: 4;

        display: block;

        width:
            calc(100% - 56px);

        max-width: 634px;

        margin:
            -12px auto
            0;

        padding:
            27px 22px;

        border:
            1px solid
            rgba(230,232,240,.8);

        border-radius: 10px;

        background:
            rgba(255,255,255,.94);

        box-shadow:
            0 8px 28px
            rgba(34,39,62,.06);

        backdrop-filter:
            blur(4px);
    }


    /*
     * desktop decorative lines
     */

    .ai-page .ai-outcome__final > span {
        display: none;
    }


    .ai-page .ai-outcome__final h3 {
        margin: 0;

        color: #080b12;

        text-align: center;

        font-size: clamp(
            27px,
            6vw,
            34px
        );

        line-height: 1.04;

        font-weight: 900;

        letter-spacing: -.04em;
    }


    .ai-page .ai-outcome__final h3 strong {
        display: block;

        margin-top: 3px;

        color: #5020ed;

        font-weight: 900;
    }



    /* ==================================================================
       SIGNOFF
       ================================================================== */

    .ai-page .ai-outcome-mobile-signoff {
        position: relative;

        z-index: 5;

        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 18px;

        margin-top: 39px;

        color: #68718b;
    }


    .ai-page .ai-outcome-mobile-signoff span {
        position: relative;

        padding-left: 39px;

        font-size: 7px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .18em;

        white-space: nowrap;
    }


    .ai-page
    .ai-outcome-mobile-signoff
    span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 28px;
        height: 1px;

        transform:
            translateY(-50%);

        background: #969cab;
    }


    .ai-page .ai-outcome-mobile-signoff strong {
        color: #68718b;

        text-align: right;

        font-size: 6px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .15em;

        white-space: nowrap;
    }

}



/* ======================================================================
   SMALL MOBILE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-outcome {
        min-height: 950px;

        padding:
            29px 0
            24px;
    }


    .ai-page .ai-outcome > .home-shell {
        padding-left: 20px;
        padding-right: 20px;
    }


    .ai-page
    .ai-outcome__copy--mobile
    .ai-section-label {
        margin-bottom: 23px;
    }


    .ai-page .ai-outcome__copy--mobile h2 {
        font-size: 37px;
    }


    .ai-page .ai-outcome__copy--mobile > p {
        font-size: 12.5px;
    }


    .ai-page .ai-outcome-mobile-benefits {
        gap: 22px;

        width: 62%;

        margin-top: 29px;
    }


    .ai-page .ai-outcome-mobile-benefit {
        grid-template-columns:
            47px
            minmax(0,1fr);

        gap: 12px;
    }


    .ai-page
    .ai-outcome-mobile-benefit__icon {
        width: 43px;
        height: 43px;
    }


    .ai-page
    .ai-outcome-mobile-benefit__icon
    .ai-icon,
    .ai-page
    .ai-outcome-mobile-benefit__icon
    svg {
        width: 23px;
        height: 23px;
    }


    .ai-page .ai-outcome-mobile-benefit h3 {
        font-size: 12px;
    }


    .ai-page .ai-outcome-mobile-benefit p {
        font-size: 8.5px;
    }


    .ai-page .ai-outcome__inner {
        min-height: 705px;
    }


    .ai-page .ai-outcome__final {
        width:
            calc(100% - 40px);

        padding:
            24px 15px;
    }


    .ai-page .ai-outcome__final h3 {
        font-size: 25px;
    }


    .ai-page .ai-outcome-mobile-signoff {
        margin-top: 34px;
    }


    .ai-page .ai-outcome-mobile-signoff span {
        padding-left: 31px;

        font-size: 5.5px;
    }


    .ai-page
    .ai-outcome-mobile-signoff
    span::before {
        width: 22px;
    }


    .ai-page .ai-outcome-mobile-signoff strong {
        font-size: 5px;
    }

}
/* ======================================================================
   AI OPERATIONS
   11 — HOW WE WORK TOGETHER
   MOBILE
   ====================================================================== */


/* mobile-only pieces hidden on desktop */

@media (min-width: 1024px) {

    .ai-page .ai-work-together__heading--mobile,
    .ai-page .ai-work-step__text--mobile,
    .ai-page .ai-work-choice__text--mobile,
    .ai-page .ai-work-choice-icon--mobile,
    .ai-page .ai-work-mobile-signoff {
        display: none !important;
    }

}



/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {

    .ai-page .ai-work-together {
        position: relative;

        overflow: hidden;

        padding:
            30px 0
            20px;

        background:
            linear-gradient(
                150deg,
                #ffffff 0%,
                #faf8f4 100%
            );

        color: #080b14;
    }


    .ai-page .ai-work-together > .home-shell {
        width: 100%;
        max-width: 680px;

        margin-left: auto;
        margin-right: auto;

        padding-left: 26px;
        padding-right: 26px;
    }


    /* --------------------------------------------------------------
       desktop content variants off
       -------------------------------------------------------------- */

    .ai-page .ai-work-together__heading--desktop,
    .ai-page .ai-work-step__text--desktop,
    .ai-page .ai-work-choice__text--desktop,
    .ai-page .ai-work-choice-icon--desktop {
        display: none !important;
    }


    .ai-page .ai-work-together__heading--mobile,
    .ai-page .ai-work-step__text--mobile,
    .ai-page .ai-work-choice__text--mobile {
        display: block;
    }



    /* ==================================================================
       SECTION LABEL
       ================================================================== */

    .ai-page
    .ai-work-together
    .ai-section-label {
        display: flex;

        align-items: center;

        gap: 12px;

        margin:
            0 0
            22px;
    }


    .ai-page
    .ai-work-together
    .ai-section-label strong {
        color: #5420ed;

        font-size: 12px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page
    .ai-work-together
    .ai-section-label > span {
        width: 30px;
        height: 1px;

        background: #8b93a4;
    }


    .ai-page
    .ai-work-together
    .ai-section-label small {
        color: #59637c;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .14em;

        text-transform: uppercase;
    }



    /* ==================================================================
       HEADING
       ================================================================== */

    .ai-page .ai-work-together__heading--mobile {
        max-width: 530px;

        margin-bottom: 24px;
    }


    .ai-page
    .ai-work-together__heading--mobile h2 {
        margin: 0;

        color: #060912;

        font-size: clamp(
            39px,
            9.4vw,
            51px
        );

        line-height: .88;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page
    .ai-work-together__heading--mobile h2 strong {
        display: block;

        color: #5420ee;

        font-weight: inherit;
    }


    .ai-page
    .ai-work-together__heading--mobile h2 span {
        display: block;

        color: #060912;
    }


    .ai-page
    .ai-work-together__heading--mobile p {
        max-width: 410px;

        margin:
            12px 0
            0;

        color: #535d78;

        font-size: 14px;
        line-height: 1.28;
    }



    /* ==================================================================
       MAIN FLOW
       ================================================================== */

    .ai-page .ai-work-flow {
        position: relative;

        display: flex;

        flex-direction: column;

        gap: 0;

        margin-top: 20px;
    }


    /*
     * Desktop horizontal arrows are not used on mobile.
     */

    .ai-page .ai-work-flow > .ai-work-arrow {
        display: none !important;
    }



    /* ==================================================================
       STEPS 01 / 02 / 03
       ================================================================== */

    .ai-page .ai-work-step {
        position: relative;

        display: grid;

        grid-template-columns:
            62px
            minmax(0,1fr);

        grid-template-areas:
            "number content"
            "number content";

        column-gap: 18px;

        width: 100%;

        min-height: 94px;

        padding:
            0 0
            23px;

        border: 0;

        border-radius: 0;

        background: transparent;

        box-shadow: none;
    }


    /*
     * vertical timeline
     */

    .ai-page .ai-work-step::after {
        content: "";

        position: absolute;

        left: 30px;
        top: 53px;
        bottom: 0;

        width: 1px;

        background: #d3cee2;
    }


    .ai-page .ai-work-step--3::after {
        display: none;
    }



    /* top number + badge */

    .ai-page .ai-work-step__top {
        display: contents;
    }


    .ai-page .ai-work-step__top strong {
        grid-area: number;

        display: grid;

        place-items: center;

        align-self: start;

        width: 55px;
        height: 55px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #f1ebff,
                #f8f5ff
            );

        color: #5420ed;

        font-size: 22px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page .ai-work-step__top small {
        grid-column: 2;

        display: block;

        align-self: end;

        margin:
            1px 0
            6px;

        color: #5621ef;

        font-size: 9px;
        line-height: 1;

        font-weight: 900;

        letter-spacing: .1em;

        text-transform: uppercase;
    }



    /* hide the desktop step icons */

    .ai-page .ai-work-step > .ai-icon,
    .ai-page .ai-work-step > svg {
        display: none !important;
    }


    .ai-page .ai-work-step h3 {
        grid-column: 2;

        margin: 0;

        color: #070a13;

        font-size: 19px;
        line-height: 1.02;

        font-weight: 900;

        letter-spacing: -.035em;
    }


    .ai-page .ai-work-step > p {
        grid-column: 2;

        max-width: 390px;

        margin:
            5px 0
            0;

        color: #58637e;

        font-size: 11.5px;
        line-height: 1.28;
    }



    /* ==================================================================
       CHOICE BLOCK
       ================================================================== */

    .ai-page .ai-work-choice {
        position: relative;

        width: 100%;

        margin:
            -2px 0
            23px;

        padding-left: 0;
    }


    /*
     * "THEN YOU CHOOSE" is not shown in the mobile reference.
     */

    .ai-page .ai-work-choice__label {
        display: none;
    }


    .ai-page .ai-work-choice__cards {
        position: relative;

        display: grid;

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr);

        gap: 24px;

        width: 100%;
    }



    /* OR badge */

    .ai-page .ai-work-choice__or {
        position: absolute;

        z-index: 5;

        left: 50%;
        top: 50%;

        display: grid;

        place-items: center;

        width: 37px;
        height: 37px;

        transform:
            translate(
                -50%,
                -50%
            );

        border:
            1px solid
            #9494a5;

        border-radius: 50%;

        background: #ffffff;

        color: #1a1d28;

        font-size: 10px;
        line-height: 1;

        font-weight: 900;
    }



    /* cards */

    .ai-page .ai-work-choice-card {
        display: block;

        min-height: 145px;

        padding:
            17px 18px
            16px;

        border: 0;

        border-radius: 8px;

        box-shadow: none;
    }


    .ai-page .ai-work-choice-card--dark {
        background:
            linear-gradient(
                145deg,
                #3420a6,
                #4724bf
            );

        color: #ffffff;
    }


    .ai-page .ai-work-choice-card--light {
        background:
            linear-gradient(
                145deg,
                #efebff,
                #e9e5fb
            );

        color: #14102d;
    }



    /* icons */

    .ai-page .ai-work-choice-card > .ai-icon,
    .ai-page .ai-work-choice-icon {
        display: block;

        width: 30px;
        height: 30px;

        margin:
            0 0
            11px;
    }


    .ai-page
    .ai-work-choice-card--dark
    .ai-icon {
        color: #bba7ff;
    }


    .ai-page
    .ai-work-choice-card--light
    .ai-icon {
        color: #5620ef;
    }


    .ai-page
    .ai-work-choice-icon--mobile {
        display: block !important;
    }



    /* titles */

    .ai-page .ai-work-choice-card h3 {
        max-width: 160px;

        margin: 0;

        font-size: 16px;
        line-height: 1.02;

        font-weight: 900;

        letter-spacing: -.025em;
    }


    .ai-page
    .ai-work-choice-card--dark h3 {
        color: #ffffff;
    }


    .ai-page
    .ai-work-choice-card--light h3 {
        color: #1d1740;
    }



    /* copy */

    .ai-page .ai-work-choice-card p {
        max-width: 175px;

        margin:
            7px 0
            0;

        font-size: 10px;
        line-height: 1.25;
    }


    .ai-page
    .ai-work-choice-card--dark p {
        color: rgba(255,255,255,.78);
    }


    .ai-page
    .ai-work-choice-card--light p {
        color: #514b70;
    }



    /* ==================================================================
       STEP 03 AFTER CHOICE
       ================================================================== */

    .ai-page .ai-work-step--3 {
        margin-top: 0;

        padding-bottom: 8px;
    }



    /* ==================================================================
       BOTTOM BOX
       ================================================================== */

    .ai-page .ai-work-together__bottom {
        display: block;

        margin:
            9px 0
            0;

        padding:
            17px 15px;

        border-radius: 8px;

        background: #f1ede9;

        text-align: center;
    }


    .ai-page
    .ai-work-together__bottom
    > span {
        display: none;
    }


    .ai-page .ai-work-together__bottom h3 {
        margin: 0;

        color: #090b12;

        font-size: 15px;
        line-height: 1.15;

        font-weight: 900;
    }


    .ai-page .ai-work-together__bottom h3 strong {
        display: block;

        margin-top: 7px;

        color: #555e79;

        font-size: 12px;
        line-height: 1.15;

        font-weight: 500;
    }



    /* ==================================================================
       MOBILE SIGNOFF
       ================================================================== */

    .ai-page .ai-work-mobile-signoff {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 20px;

        margin-top: 23px;

        padding:
            0 2px;
    }


    .ai-page .ai-work-mobile-signoff strong {
        color: #11131d;

        font-size: 10px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page .ai-work-mobile-signoff strong::first-letter {
        color: #5520ef;
    }


    .ai-page .ai-work-mobile-signoff span {
        color: #69718a;

        text-align: right;

        font-size: 6px;
        line-height: 1.15;

        font-weight: 800;

        letter-spacing: .14em;

        white-space: nowrap;
    }

}



/* ======================================================================
   SMALL MOBILE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-work-together {
        padding:
            27px 0
            18px;
    }


    .ai-page .ai-work-together > .home-shell {
        padding-left: 20px;
        padding-right: 20px;
    }


    .ai-page
    .ai-work-together__heading--mobile h2 {
        font-size: 37px;
    }


    .ai-page
    .ai-work-together__heading--mobile p {
        font-size: 12px;
    }


    .ai-page .ai-work-step {
        grid-template-columns:
            54px
            minmax(0,1fr);

        column-gap: 14px;
    }


    .ai-page .ai-work-step__top strong {
        width: 47px;
        height: 47px;

        font-size: 19px;
    }


    .ai-page .ai-work-step::after {
        left: 23px;
        top: 47px;
    }


    .ai-page .ai-work-step h3 {
        font-size: 17px;
    }


    .ai-page .ai-work-step > p {
        font-size: 10px;
    }


    .ai-page .ai-work-choice__cards {
        gap: 17px;
    }


    .ai-page .ai-work-choice-card {
        min-height: 137px;

        padding:
            15px 13px;
    }


    .ai-page .ai-work-choice-card h3 {
        font-size: 14px;
    }


    .ai-page .ai-work-choice-card p {
        font-size: 8.5px;
    }


    .ai-page .ai-work-choice__or {
        width: 32px;
        height: 32px;

        font-size: 9px;
    }


    .ai-page .ai-work-together__bottom h3 {
        font-size: 13px;
    }


    .ai-page
    .ai-work-together__bottom
    h3 strong {
        font-size: 10px;
    }

}
/* ======================================================================
   AI OPERATIONS
   12 — FREE OPERATIONS DIAGNOSTIC
   MOBILE
   ====================================================================== */


/* mobile version hidden on desktop */

@media (min-width: 1024px) {

    .ai-page .ai-diagnostic-mobile {
        display: none !important;
    }

}



/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-diagnostic {
        position: relative;

        overflow: hidden;

        margin: 0;
        padding: 0;

        background: #ffffff;
    }


    /*
     * Existing desktop diagnostic is completely hidden on mobile.
     */

    .ai-page .ai-diagnostic > .ai-diagnostic__inner {
        display: none !important;
    }



    /* ================================================================
       MOBILE WRAPPER
       ================================================================ */

    .ai-page .ai-diagnostic-mobile {
        position: relative;

        display: block;

        width: 100%;
        min-height: 970px;

        overflow: hidden;

        background:
            linear-gradient(
                180deg,
                #ffffff 0%,
                #ffffff 48%,
                #f4f5f7 100%
            );
    }



    /* ================================================================
       BACKGROUND IMAGE
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__background {
        position: absolute;

        z-index: 0;

        left: 0;
        right: 0;
        bottom: 0;

        width: 100%;
        height: 59%;

        overflow: hidden;
    }


    .ai-page .ai-diagnostic-mobile__background img {
        display: block;

        width: 100%;
        height: 100%;

        object-fit: cover;

        object-position:
            center center;
    }



    /* ================================================================
       WHITE → PHOTO FADE
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__fade {
        position: absolute;

        z-index: 1;

        inset: 0;

        pointer-events: none;

        background:
            linear-gradient(
                180deg,

                #ffffff 0%,
                #ffffff 31%,

                rgba(255,255,255,.99) 38%,
                rgba(255,255,255,.92) 43%,
                rgba(255,255,255,.63) 49%,
                rgba(255,255,255,.18) 56%,

                rgba(255,255,255,0) 64%
            );
    }



    /* ================================================================
       CONTENT
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__content {
        position: relative;

        z-index: 2;

        display: flex;

        flex-direction: column;

        width: 100%;
        max-width: 680px;

        min-height: 970px;

        margin:
            0 auto;

        padding:
            28px 27px
            24px;
    }



    /* ================================================================
       TOP ROW
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__top {
        display: flex;

        align-items: flex-start;
        justify-content: space-between;

        gap: 20px;
    }



    /* section label */

    .ai-page
    .ai-diagnostic-mobile
    .ai-section-label {
        display: flex;

        align-items: center;

        gap: 12px;

        margin: 0;
    }


    .ai-page
    .ai-diagnostic-mobile
    .ai-section-label strong {
        color: #5421ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page
    .ai-diagnostic-mobile
    .ai-section-label > span {
        width: 29px;
        height: 1px;

        background: #9299aa;
    }


    .ai-page
    .ai-diagnostic-mobile
    .ai-section-label small {
        color: #626d88;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .17em;

        text-transform: uppercase;
    }



    /* top right */

    .ai-page .ai-diagnostic-mobile__top-signoff {
        max-width: 95px;

        color: #636d88;

        font-size: 6px;
        line-height: 1.65;

        font-weight: 800;

        letter-spacing: .18em;

        text-transform: uppercase;
    }



    /* ================================================================
       SMALL CENTER NOTE
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__note {
        max-width: 180px;

        margin:
            44px auto
            0;

        color: #6c7590;

        text-align: center;

        font-size: 7px;
        line-height: 1.35;

        font-weight: 800;

        letter-spacing: .23em;

        text-transform: uppercase;
    }



    /* ================================================================
       MAIN CONTENT
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__main {
        width: 100%;

        margin-top: 50px;

        text-align: center;
    }



    /* ================================================================
       HEADING
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__main h2 {
        max-width: 610px;

        margin:
            0 auto;

        color: #050810;

        font-size: clamp(
            43px,
            9.4vw,
            55px
        );

        line-height: .92;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page .ai-diagnostic-mobile__main h2 span {
        display: block;

        color: #4e20ed;
    }



    /* ================================================================
       INTRO
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__intro {
        max-width: 470px;

        margin:
            24px auto
            0;

        color: #606b87;

        font-size: 20px;
        line-height: 1.28;

        font-weight: 500;
    }


    /*
     * Gives the first sentence extra emphasis,
     * matching "30 minutes. No pressure."
     */

    .ai-page .ai-diagnostic-mobile__intro::first-line {
        font-weight: 800;
    }



    /* ================================================================
       CTA
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__cta {
        display: flex;

        align-items: center;
        justify-content: center;

        gap: 27px;

        width: min(
            100%,
            390px
        );

        min-height: 57px;

        margin:
            30px auto
            0;

        padding:
            14px 23px;

        border-radius: 7px;

        background:
            linear-gradient(
                105deg,
                #ffc548,
                #ffc13d
            );

        box-shadow:
            0 10px 25px
            rgba(218,158,31,.22);

        color: #0c0d10;

        text-decoration: none;
    }


    .ai-page .ai-diagnostic-mobile__cta span {
        font-size: 16px;
        line-height: 1;

        font-weight: 800;
    }


    .ai-page .ai-diagnostic-mobile__cta b {
        font-size: 26px;
        line-height: 1;

        font-weight: 400;
    }



    /* ================================================================
       TRUST
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__trust {
        display: flex;

        align-items: center;
        justify-content: center;

        gap: 9px;

        margin-top: 19px;

        color: #68718c;
    }


    .ai-page .ai-diagnostic-mobile__trust span {
        font-size: 7px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .16em;

        text-transform: uppercase;

        white-space: nowrap;
    }


    .ai-page .ai-diagnostic-mobile__trust b {
        color: #8c93a7;

        font-size: 8px;
        line-height: 1;
    }



    /* ================================================================
       BOTTOM SIGNOFF
       ================================================================ */

    .ai-page .ai-diagnostic-mobile__bottom {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 20px;

        width: 100%;

        margin-top: auto;

        color: #69728b;
    }


    .ai-page .ai-diagnostic-mobile__bottom > span {
        position: relative;

        padding-left: 39px;

        font-size: 7px;
        line-height: 1;

        font-weight: 900;

        letter-spacing: .16em;

        white-space: nowrap;
    }


    .ai-page
    .ai-diagnostic-mobile__bottom
    > span::before {
        content: "";

        position: absolute;

        left: 0;
        top: 50%;

        width: 29px;
        height: 1px;

        transform:
            translateY(-50%);

        background: #9299aa;
    }


    .ai-page .ai-diagnostic-mobile__bottom strong {
        color: #68718a;

        text-align: right;

        font-size: 6px;
        line-height: 1.2;

        font-weight: 800;

        letter-spacing: .15em;

        white-space: nowrap;
    }

}



/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-diagnostic-mobile {
        min-height: 900px;
    }


    .ai-page .ai-diagnostic-mobile__content {
        min-height: 900px;

        padding:
            24px 20px
            20px;
    }


    .ai-page .ai-diagnostic-mobile__background {
        height: 57%;
    }


    .ai-page .ai-diagnostic-mobile__note {
        margin-top: 35px;
    }


    .ai-page .ai-diagnostic-mobile__main {
        margin-top: 41px;
    }


    .ai-page .ai-diagnostic-mobile__main h2 {
        font-size: 37px;
    }


    .ai-page .ai-diagnostic-mobile__intro {
        max-width: 320px;

        margin-top: 20px;

        font-size: 16px;
    }


    .ai-page .ai-diagnostic-mobile__cta {
        width: 100%;

        max-width: 330px;

        min-height: 52px;

        margin-top: 26px;
    }


    .ai-page .ai-diagnostic-mobile__cta span {
        font-size: 14px;
    }


    .ai-page .ai-diagnostic-mobile__cta b {
        font-size: 22px;
    }


    .ai-page .ai-diagnostic-mobile__trust {
        gap: 6px;
    }


    .ai-page .ai-diagnostic-mobile__trust span {
        font-size: 5.7px;
    }


    .ai-page .ai-diagnostic-mobile__top-signoff {
        font-size: 5px;
    }


    .ai-page .ai-diagnostic-mobile__bottom > span {
        padding-left: 31px;

        font-size: 5.5px;
    }


    .ai-page
    .ai-diagnostic-mobile__bottom
    > span::before {
        width: 22px;
    }


    .ai-page .ai-diagnostic-mobile__bottom strong {
        font-size: 5px;
    }

}
/* ======================================================================
   AI OPERATIONS
   08 — THE TRANSFORMATION
   MOBILE ONLY
   ====================================================================== */


/* ======================================================================
   DESKTOP
   ====================================================================== */

@media (min-width: 1024px) {

    .ai-page .ai-transformation-mobile {
        display: none !important;
    }

}



/* ======================================================================
   MOBILE
   ====================================================================== */

@media (max-width: 1023px) {


    /* ================================================================
       SECTION
       ================================================================ */

    .ai-page .ai-transformation {
        position: relative;

        overflow: hidden;

        margin: 0;

        padding:
            30px 0
            28px;

        background: #ffffff;

        color: #070a12;
    }


    /*
     * Hide original desktop transformation only on mobile.
     */

    .ai-page
    .ai-transformation
    > .ai-transformation__inner {
        display: none !important;
    }



    /* ================================================================
       MOBILE WRAPPER
       ================================================================ */

    .ai-page .ai-transformation-mobile {
        display: block;

        width: 100%;
    }


    .ai-page .ai-transformation-mobile__inner {
        width: 100%;
        max-width: 680px;

        margin:
            0 auto;

        padding:
            0 25px;
    }



    /* ================================================================
       LABEL
       ================================================================ */

    .ai-page
    .ai-transformation-mobile
    .ai-section-label {
        display: flex;

        align-items: center;

        gap: 12px;

        margin:
            0 0
            22px;
    }


    .ai-page
    .ai-transformation-mobile
    .ai-section-label strong {
        color: #5222ed;

        font-size: 13px;
        line-height: 1;

        font-weight: 900;
    }


    .ai-page
    .ai-transformation-mobile
    .ai-section-label > span {
        display: block;

        width: 29px;
        height: 1px;

        background: #8e96a7;
    }


    .ai-page
    .ai-transformation-mobile
    .ai-section-label small {
        color: #616c86;

        font-size: 8px;
        line-height: 1;

        font-weight: 800;

        letter-spacing: .17em;

        text-transform: uppercase;
    }



    /* ================================================================
       HEADING
       ================================================================ */

    .ai-page .ai-transformation-mobile__heading {
        width: 100%;

        margin-bottom: 19px;
    }


    .ai-page .ai-transformation-mobile__heading h2 {
        max-width: 590px;

        margin: 0;

        color: #060911;

        font-size: clamp(
            42px,
            9.5vw,
            53px
        );

        line-height: .88;

        font-weight: 900;

        letter-spacing: -.06em;
    }


    .ai-page
    .ai-transformation-mobile__heading
    h2 span {
        display: block;

        color: #4e20ec;
    }


    .ai-page .ai-transformation-mobile__heading p {
        max-width: 560px;

        margin:
            13px 0
            0;

        color: #606b87;

        font-size: 14px;
        line-height: 1.28;
    }



    /* ================================================================
       SHARED CARD
       ================================================================ */

    .ai-page .ai-transformation-mobile-card {
        position: relative;

        overflow: hidden;

        width: 100%;

        padding:
            14px 14px
            13px;

        border:
            1px solid
            transparent;

        border-radius: 10px;
    }


    .ai-page
    .ai-transformation-mobile-card--before {
        border-color: #f8dddd;

        background:
            linear-gradient(
                145deg,
                #fff7f7,
                #fff1f1
            );
    }


    .ai-page
    .ai-transformation-mobile-card--after {
        border-color: #e3defb;

        background:
            linear-gradient(
                145deg,
                #f8f7ff,
                #f1efff
            );
    }



    /* ================================================================
       CARD COPY
       ================================================================ */

    .ai-page
    .ai-transformation-mobile-card__copy {
        position: relative;

        z-index: 2;

        margin-bottom: 12px;
    }


    .ai-page
    .ai-transformation-mobile-card__copy
    small {
        display: inline-flex;

        align-items: center;
        justify-content: center;

        min-height: 25px;

        padding:
            4px 12px;

        border-radius: 999px;

        font-size: 10px;
        line-height: 1;

        font-weight: 900;

        letter-spacing: .05em;
    }


    .ai-page
    .ai-transformation-mobile-card--before
    .ai-transformation-mobile-card__copy
    small {
        background: #ffdfe2;
        color: #e62a43;
    }


    .ai-page
    .ai-transformation-mobile-card--after
    .ai-transformation-mobile-card__copy
    small {
        background: #e4defe;
        color: #5421ed;
    }


    .ai-page
    .ai-transformation-mobile-card__copy
    h3 {
        margin:
            8px 0
            0;

        color: #090b13;

        font-size: 18px;
        line-height: 1.03;

        font-weight: 900;

        letter-spacing: -.035em;
    }


    .ai-page
    .ai-transformation-mobile-card__copy
    p {
        margin:
            4px 0
            0;

        color: #606b87;

        font-size: 11px;
        line-height: 1.25;
    }



    /* ================================================================
       VISUAL
       ================================================================ */

    .ai-page
    .ai-transformation-mobile-card__visual {
        position: relative;

        z-index: 1;

        width: 100%;

        overflow: hidden;

        border-radius: 7px;
    }


    .ai-page
    picture.ai-transformation-mobile-card__picture {
        display: block;

        width: 100%;
    }


    .ai-page
    .ai-transformation-mobile-card__picture img,
    .ai-page
    img.ai-transformation-mobile-card__picture {
        display: block;

        width: 100%;
        height: auto;

        margin: 0;

        object-fit: contain;
    }



    /* ================================================================
       BOTTOM STATUS PILL
       ================================================================ */

    .ai-page
    .ai-transformation-mobile-card__status {
        position: relative;

        z-index: 3;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 8px;

        width: fit-content;

        max-width: 90%;

        min-height: 28px;

        margin:
            -6px auto
            0;

        padding:
            5px 14px;

        border-radius: 999px;

        font-size: 9px;
        line-height: 1;

        font-weight: 700;
    }


    .ai-page
    .ai-transformation-mobile-card__status b {
        display: grid;

        place-items: center;

        flex: 0 0 auto;

        width: 19px;
        height: 19px;

        border-radius: 50%;

        font-size: 11px;
        line-height: 1;
    }


    /* BEFORE */

    .ai-page
    .ai-transformation-mobile-card--before
    .ai-transformation-mobile-card__status {
        background: #ffe7e7;

        color: #92333d;
    }


    .ai-page
    .ai-transformation-mobile-card--before
    .ai-transformation-mobile-card__status b {
        background: #ff5265;

        color: #ffffff;
    }


    /* AFTER */

    .ai-page
    .ai-transformation-mobile-card--after
    .ai-transformation-mobile-card__status {
        background: #ece8ff;

        color: #4420b8;
    }


    .ai-page
    .ai-transformation-mobile-card--after
    .ai-transformation-mobile-card__status b {
        background: #5422ed;

        color: #ffffff;
    }



    /* ================================================================
       CENTRAL DOWN ARROW
       ================================================================ */

    .ai-page .ai-transformation-mobile__arrow {
        position: relative;

        z-index: 5;

        display: grid;

        place-items: center;

        width: 45px;
        height: 45px;

        margin:
            -3px auto;

        border:
            6px solid
            #ffffff;

        border-radius: 50%;

        background: #f0edff;

        color: #5120ec;

        font-size: 27px;
        line-height: 1;
    }



    /* ================================================================
       RESULT BAND
       ================================================================ */

    .ai-page .ai-transformation-mobile__result {
        display: grid;

        grid-template-columns:
            76px
            1px
            minmax(0,1fr);

        align-items: center;

        gap: 19px;

        width: 100%;

        margin-top: 12px;

        padding:
            15px 19px;

        border:
            1px solid
            #eceafa;

        border-radius: 10px;

        background:
            linear-gradient(
                120deg,
                #faf8ff,
                #f2efff
            );
    }



    /* purple circle */

    .ai-page
    .ai-transformation-mobile__result-icon {
        display: grid;

        place-items: center;

        width: 66px;
        height: 66px;

        border-radius: 50%;

        background:
            linear-gradient(
                145deg,
                #3510dd,
                #6720ff
            );

        color: #ffffff;

        font-size: 36px;
        line-height: 1;

        font-weight: 300;
    }



    /* divider */

    .ai-page
    .ai-transformation-mobile__result-divider {
        align-self: stretch;

        width: 1px;

        background:
            rgba(
                79,
                34,
                237,
                .38
            );
    }



    /* copy */

    .ai-page
    .ai-transformation-mobile__result-copy
    h3 {
        margin: 0;

        color: #080b12;

        font-size: 23px;
        line-height: .98;

        font-weight: 900;

        letter-spacing: -.04em;
    }


    .ai-page
    .ai-transformation-mobile__result-copy
    h3 span {
        display: block;

        color: #5120ed;
    }


    .ai-page
    .ai-transformation-mobile__result-copy
    p {
        margin:
            7px 0
            0;

        color: #66708b;

        font-size: 10px;
        line-height: 1.2;
    }

}



/* ======================================================================
   SMALL PHONE
   ====================================================================== */

@media (max-width: 480px) {

    .ai-page .ai-transformation {
        padding:
            27px 0
            24px;
    }


    .ai-page
    .ai-transformation-mobile__inner {
        padding:
            0 19px;
    }


    .ai-page
    .ai-transformation-mobile__heading
    h2 {
        font-size: 37px;
    }


    .ai-page
    .ai-transformation-mobile__heading
    p {
        font-size: 12px;
    }


    .ai-page
    .ai-transformation-mobile-card {
        padding:
            11px 11px
            10px;
    }


    .ai-page
    .ai-transformation-mobile-card__copy
    h3 {
        font-size: 16px;
    }


    .ai-page
    .ai-transformation-mobile-card__copy
    p {
        font-size: 10px;
    }


    .ai-page
    .ai-transformation-mobile-card__status {
        font-size: 8px;
    }


    .ai-page
    .ai-transformation-mobile__arrow {
        width: 40px;
        height: 40px;

        font-size: 24px;
    }


    .ai-page .ai-transformation-mobile__result {
        grid-template-columns:
            61px
            1px
            minmax(0,1fr);

        gap: 13px;

        padding:
            13px 14px;
    }


    .ai-page
    .ai-transformation-mobile__result-icon {
        width: 55px;
        height: 55px;

        font-size: 30px;
    }


    .ai-page
    .ai-transformation-mobile__result-copy
    h3 {
        font-size: 19px;
    }


    .ai-page
    .ai-transformation-mobile__result-copy
    p {
        font-size: 8.5px;
    }

}