/* /Components/BeforeAfterPanel.razor.rz.scp.css */
.before-after-panel[b-sd2hix4s66] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.before-after-panel > *[b-sd2hix4s66] {
    min-width: 0;
}

[b-sd2hix4s66] .ba-context-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
}

[b-sd2hix4s66] .ba-context-text {
    flex: 1;
}

@media (max-width: 650px) {
    [b-sd2hix4s66] .ba-context-row {
        flex-direction: column;
    }
}

.outcome-header[b-sd2hix4s66] {
    margin-bottom: 8px;
}

.outcome-tag[b-sd2hix4s66] {
    display: inline-block;
    padding: 4px 12px;
    background-color: #f8f9fa;
    color: #52627a;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    font-size: 0.875rem;
    margin-bottom: 12px;
}

.outcome-title[b-sd2hix4s66] {
    font-size: 1.25rem;
    margin: 0;
    color: #1a202c;
    font-weight: 600;
}

.outcome-comparison[b-sd2hix4s66] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
}

.outcome-comparison > *[b-sd2hix4s66] {
    min-width: 0;
}

@media (max-width: 650px) {
    .outcome-comparison[b-sd2hix4s66] {
        grid-template-columns: 1fr;
    }
}

.before-after-panel.compact .outcome-comparison[b-sd2hix4s66] {
    grid-template-columns: 1fr;
    gap: 16px;
}

.before-card[b-sd2hix4s66] {
    background-color: #f7f7f8;
    padding: 24px;
    border-radius: 8px;
}

.after-card[b-sd2hix4s66] {
    background-color: #1a2c42;
    padding: 24px;
    border-radius: 8px;
}

.before-after-panel.compact .before-card[b-sd2hix4s66],
.before-after-panel.compact .after-card[b-sd2hix4s66] {
    padding: 20px;
}

[b-sd2hix4s66] .detail-main p, [b-sd2hix4s66] .content-card p,
.before-after-panel .after-card p[b-sd2hix4s66],
.before-after-panel .before-card p[b-sd2hix4s66] {
    line-height: 1.75;
}

.before-after-panel .after-card p[b-sd2hix4s66] {
    color: #ffffff !important;
    margin: 0;
}

.before-after-panel .before-card p[b-sd2hix4s66] {
    color: #1a202c !important;
    margin: 0;
}

.outcome-state-label[b-sd2hix4s66] {
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 12px;
}

.before-card .outcome-state-label[b-sd2hix4s66] {
    color: #52627a;
}

.after-card .outcome-state-label[b-sd2hix4s66] {
    color: #FFC52F;
}

.metrics-area[b-sd2hix4s66] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    background-color: #f8f9fa;
    padding: 24px;
    border-radius: 8px;
    margin-top: 8px;
}

.metrics-area > *[b-sd2hix4s66] {
    min-width: 0;
}

@media (max-width: 900px) {
    .metrics-area[b-sd2hix4s66] {
        grid-template-columns: 1fr;
    }
}

.metric-label[b-sd2hix4s66] {
    color: #0f3d61;
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.metric-group p[b-sd2hix4s66] {
    font-size: 0.875rem;
    margin: 0;
    color: #1a202c;
}

.metric-group .metric-example[b-sd2hix4s66] {
    color: #52627a;
}

.metric-group ul[b-sd2hix4s66] {
    font-size: 0.875rem;
    margin: 0;
    padding-left: 16px;
    color: #1a202c;
}

.compact-metrics[b-sd2hix4s66] {
    font-size: 0.875rem;
    color: #52627a;
    margin-top: 8px;
}
/* /Components/Fit1SystemShowcase.razor.rz.scp.css */
.system-showcase[b-xcztlsfs6f] {
    min-width: 0;
}

.showcase-heading[b-xcztlsfs6f] {
    margin-bottom: 28px;
}

.showcase-heading p[b-xcztlsfs6f] {
    max-width: 62ch;
}

.showcase-screens[b-xcztlsfs6f] {
    display: grid;
    gap: 28px;
}

.screen-card[b-xcztlsfs6f] {
    min-width: 0;
    margin: 0;
    border: 1px solid #dce1e8;
    background: #fff;
}

.device-stage[b-xcztlsfs6f] {
    display: grid;
    place-items: center;
    padding: clamp(20px, 4vw, 40px);
    min-width: 0;
}

.tablet-stage[b-xcztlsfs6f] {
    background: #eeeae1;
}

.tablet-frame[b-xcztlsfs6f] {
    position: relative;
    width: 100%;
    padding: 3px;
    border: 1px solid #7e838c;
    border-radius: 25px;
    background: linear-gradient(135deg, #f1f0ee, #8f939b 27%, #d7d9dd 52%, #747a84 78%, #e4e5e7);
    box-shadow: inset 0 0 0 1px #f5f5f5b3, 0 2px 3px #090f1d33, 0 22px 30px -19px #090f1d8c;
}

.tablet-bezel[b-xcztlsfs6f] {
    position: relative;
    padding: 17px 11px 11px;
    border: 1px solid #000;
    border-radius: 21px;
    background: #111317;
    box-shadow: inset 0 0 0 1px #34373b;
}

.tablet-screen[b-xcztlsfs6f] {
    padding: 4px;
    border-radius: 10px;
    background: #f5f7fa;
}

.tablet-camera[b-xcztlsfs6f] {
    position: absolute;
    top: 5px;
    left: calc(50% - 3px);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    border: 1px solid #07090c;
    background: radial-gradient(circle at 36% 30%, #405274 0, #172338 32%, #05080f 70%);
    box-shadow: 0 0 0 1px #2e333a;
}

.tablet-power[b-xcztlsfs6f],
.tablet-volume[b-xcztlsfs6f] {
    position: absolute;
    z-index: 1;
    height: 3px;
    border: 1px solid #8d939b;
    border-radius: 2px 2px 0 0;
    background: linear-gradient(#e6e7e9, #969da7);
    top: -3px;
}

.tablet-power[b-xcztlsfs6f] {
    left: 28px;
    width: 23px;
}

.tablet-volume[b-xcztlsfs6f] {
    right: 42px;
    width: 42px;
}

.device-stage img[b-xcztlsfs6f] {
    display: block;
    width: 100%;
    height: auto;
    background: #fff;
}

.browser-stage[b-xcztlsfs6f] {
    background: #e7ebef;
}

.browser-frame[b-xcztlsfs6f] {
    width: 100%;
    border: 1px solid #b8c2ce;
    border-radius: 9px 9px 0 0;
    background: #fff;
    box-shadow: 0 16px 26px -18px #090f1d80;
}

.browser-bar[b-xcztlsfs6f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 29px;
    padding: 8px 12px;
    border-radius: 8px 8px 0 0;
    border-bottom: 1px solid #d8dfe7;
    background: #f4f5f7;
    color: #53617a;
    font: 600 9px/1.2 "DM Sans", sans-serif;
    letter-spacing: .1em;
}

.browser-dots[b-xcztlsfs6f] {
    display: flex;
    gap: 4px;
}

.browser-dots i[b-xcztlsfs6f] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #a6b0bd;
}

.screen-card-shipper[b-xcztlsfs6f] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    background: #101b30;
}

.phone-stage[b-xcztlsfs6f] {
    padding: 32px 20px;
    background: #101b30;
}

.phone-frame[b-xcztlsfs6f] {
    position: relative;
    width: min(100%, 256px);
    padding: 4px;
    border: 1px solid #8c8b89;
    border-radius: 37px;
    background: linear-gradient(110deg, #d5d2ce, #868581 10%, #e0ded9 43%, #898a8b 77%, #cccac5);
    box-shadow: inset 0 0 0 1px #efeeea, inset 0 0 0 3px #8c8b884d, 0 3px 6px #0006, 0 24px 34px -16px #000b;
}

.phone-bezel[b-xcztlsfs6f] {
    padding: 0 6px 9px;
    border: 1px solid #000;
    border-radius: 32px;
    background: #08090c;
    box-shadow: inset 0 0 0 1px #27292d;
}

.phone-top[b-xcztlsfs6f] {
    position: relative;
    height: 36px;
}

.dynamic-island[b-xcztlsfs6f] {
    position: absolute;
    top: 9px;
    left: calc(50% - 35px);
    width: 70px;
    height: 20px;
    border: 1px solid #1c1f24;
    border-radius: 14px;
    background: #010203;
    box-shadow: 0 1px 1px #ffffff0d;
}

.dynamic-island[b-xcztlsfs6f]::after {
    position: absolute;
    top: 5px;
    right: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 32%, #314664, #0a1524 42%, #020509 75%);
    box-shadow: 0 0 0 1px #10151f;
    content: "";
}

.phone-screen[b-xcztlsfs6f] {
    padding: 8px;
    border-radius: 18px;
    background: #f7f8fa;
}

.phone-button[b-xcztlsfs6f] {
    position: absolute;
    left: -4px;
    width: 3px;
    border: 1px solid #797a78;
    border-radius: 2px 0 0 2px;
    background: linear-gradient(90deg, #d3d1cd, #8e908f);
}

.phone-action[b-xcztlsfs6f] { top: 72px; height: 15px; }
.phone-volume-up[b-xcztlsfs6f] { top: 107px; height: 31px; }
.phone-volume-down[b-xcztlsfs6f] { top: 151px; height: 31px; }
.phone-power[b-xcztlsfs6f] {
    top: 123px;
    right: -4px;
    left: auto;
    height: 49px;
    border-radius: 0 2px 2px 0;
}

.screen-caption[b-xcztlsfs6f] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 24px;
}

.screen-number[b-xcztlsfs6f] {
    flex: 0 0 auto;
    padding-top: 3px;
    color: #8b6200;
    font: 600 13px/1.8 "DM Sans", sans-serif;
}

.screen-caption h3[b-xcztlsfs6f] {
    margin: 0 0 8px;
    color: #101b30;
    font-size: clamp(20px, 2vw, 25px);
    line-height: 1.45;
}

.screen-caption p[b-xcztlsfs6f] {
    margin: 0 0 14px;
    color: #40516a;
    font-size: 15px;
    line-height: 1.8;
}

.screen-link[b-xcztlsfs6f] {
    display: inline-block;
    padding-block: 6px;
    color: #765400;
    font-size: 13px;
    line-height: 1.7;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.screen-link:hover[b-xcztlsfs6f] {
    color: #101b30;
}

.screen-link:focus-visible[b-xcztlsfs6f] {
    outline: 2px solid #b88700;
    outline-offset: 5px;
}

.screen-card-shipper .screen-caption[b-xcztlsfs6f] {
    padding-left: 8px;
}

.screen-card-shipper h3[b-xcztlsfs6f] {
    color: #fff;
}

.screen-card-shipper p[b-xcztlsfs6f] {
    color: #c4cfdf;
}

.screen-card-shipper .screen-number[b-xcztlsfs6f],
.screen-card-shipper .screen-link[b-xcztlsfs6f] {
    color: #f2cc68;
}

.screen-card-shipper .screen-link:hover[b-xcztlsfs6f] {
    color: #fff;
}

@media (max-width: 560px) {
    .device-stage[b-xcztlsfs6f] {
        padding: 20px 14px;
    }

    .tablet-frame[b-xcztlsfs6f] {
        border-radius: 19px;
    }

    .tablet-bezel[b-xcztlsfs6f] {
        padding: 15px 7px 7px;
        border-radius: 15px;
    }

    .screen-caption[b-xcztlsfs6f] {
        gap: 12px;
        padding: 20px;
    }

    .screen-card-shipper[b-xcztlsfs6f] {
        grid-template-columns: 1fr;
    }

    .phone-stage[b-xcztlsfs6f] {
        padding-block: 28px 6px;
    }

    .phone-frame[b-xcztlsfs6f] {
        width: min(80%, 256px);
    }

    .screen-card-shipper .screen-caption[b-xcztlsfs6f] {
        padding: 20px;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-pui3qmsk44] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-pui3qmsk44] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-hgipbxfltw],
.components-reconnect-repeated-attempt-visible[b-hgipbxfltw],
.components-reconnect-failed-visible[b-hgipbxfltw],
.components-pause-visible[b-hgipbxfltw],
.components-resume-failed-visible[b-hgipbxfltw],
.components-rejoining-animation[b-hgipbxfltw] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-retrying[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-failed[b-hgipbxfltw],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-hgipbxfltw] {
    display: block;
}


#components-reconnect-modal[b-hgipbxfltw] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-hgipbxfltw 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-hgipbxfltw 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-hgipbxfltw 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-hgipbxfltw]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-hgipbxfltw 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-hgipbxfltw {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-hgipbxfltw {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-hgipbxfltw {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-hgipbxfltw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-hgipbxfltw] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-hgipbxfltw] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-hgipbxfltw] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-hgipbxfltw] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-hgipbxfltw] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-hgipbxfltw] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-hgipbxfltw 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-hgipbxfltw] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-hgipbxfltw {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/PeopleVisual.razor.rz.scp.css */
.people-visual[b-rs4ze5jb76] {
    margin: 0;
    padding: 0;
    display: block;
    margin-inline: auto;
}

.people-visual img[b-rs4ze5jb76] {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    min-width: 0;
}

.people-visual.variant-hero[b-rs4ze5jb76] {
    max-width: 680px;
}

.people-visual.variant-inset[b-rs4ze5jb76] {
    max-width: 390px;
}

.people-visual.variant-card[b-rs4ze5jb76] {
    max-width: 390px;
}

.people-visual.variant-CTA[b-rs4ze5jb76] {
    max-width: 360px;
}

.people-visual.variant-status[b-rs4ze5jb76] {
    max-width: 330px;
}
/* /Components/ServiceIllustration.razor.rz.scp.css */
.service-illustration[b-0scuwpvkv6] {
    width: 100%;
    margin: 0;
    height: auto;
    display: flex;
    flex-direction: column;
}

.illustration-img[b-0scuwpvkv6] {
    width: 100%;
    max-width: 100%;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    height: 360px;
    max-height: 420px;
}

@media (max-width: 900px) {
    .illustration-img[b-0scuwpvkv6] {
        height: 240px;
    }
}

.illustration-thumbnail .illustration-img[b-0scuwpvkv6] {
    height: 180px;
    max-height: 200px;
}

.illustration-caption[b-0scuwpvkv6] {
    margin-top: 8px;
    font-size: 0.875rem;
    color: #52627a;
}
/* /Components/ServiceProjectGallery.razor.rz.scp.css */
.project-gallery[b-49faddwckg] { padding: 2.4rem 0 2.8rem; border-top: 1px solid #dedbd3; }
.project-gallery-heading[b-49faddwckg] { max-width: 65ch; margin-bottom: 1.5rem; }
.project-gallery-heading h2[b-49faddwckg] { margin: .45rem 0 .65rem; }
.project-gallery-heading p[b-49faddwckg] { margin: 0; }
.project-gallery-grid[b-49faddwckg] { display: grid; gap: 1.55rem; }
.project-gallery-card[b-49faddwckg] { overflow: hidden; border: 1px solid #e0dbd1; border-radius: 16px; background: #fffefa; box-shadow: 0 10px 28px #1520390d; }
.project-gallery-media[b-49faddwckg] { aspect-ratio: 3 / 2; display: grid; place-items: center; overflow: hidden; background: #edeae2; }
.project-gallery-media img[b-49faddwckg] { display: block; width: 100%; height: 100%; object-fit: contain; }
.project-gallery-media video[b-49faddwckg] { display: block; width: 100%; height: 100%; object-fit: contain; background: #0b1425; }
.project-gallery-copy[b-49faddwckg] { padding: 1.25rem 1.45rem 1.4rem; }
.project-gallery-number[b-49faddwckg] { color: #9a7418; font: 700 .67rem/1.2 system-ui,sans-serif; letter-spacing: .12em; }
.project-gallery-copy h3[b-49faddwckg] { margin: .45rem 0 .65rem; color: #142037; font-size: 1.35rem; line-height: 1.3; }
.project-gallery-copy p[b-49faddwckg] { margin: .4rem 0 0; color: #4b5156; line-height: 1.55; }
.project-gallery-copy p strong[b-49faddwckg] { color: #172439; }
.project-gallery-copy .project-gallery-view[b-49faddwckg] { margin-top: .8rem; padding-top: .75rem; border-top: 1px solid #ece7de; color: #645835; font-size: .88rem; }
.project-gallery-link[b-49faddwckg] { display: inline-block; margin-top: .85rem; color: #5c4515; font-size: .83rem; text-decoration: underline; text-underline-offset: 3px; }
.project-gallery-link:hover[b-49faddwckg],.project-gallery-link:focus-visible[b-49faddwckg] { color: #172439; }
@media (max-width: 700px) { .project-gallery[b-49faddwckg] { padding: 1.9rem 0 2.1rem; }.project-gallery-grid[b-49faddwckg] { gap: 1.1rem; }.project-gallery-copy[b-49faddwckg] { padding: 1rem; }.project-gallery-copy h3[b-49faddwckg] { font-size: 1.13rem; }.project-gallery-media[b-49faddwckg] { aspect-ratio: 3 / 2; } }