@font-face {
                font-family: Raleway;
                src: url("raleway.ttf") format("truetype");
                font-weight: 100 900;
                font-display: swap;
            }
            :root {
                --navy: #0a1f3c;
                --electric: #1e90ff;
                --blue: #2f5bff;
                --gray: #8a94a6;
                --light: #f5f7fa;
                --ink: #142945;
            }
            * {
                box-sizing: border-box;
            }
            html {
                scroll-behavior: smooth;
            }
            body {
                margin: 0;
                font-family: Raleway, Arial, sans-serif;
                color: var(--navy);
                background: #fff;
            }
            a {
                text-decoration: none;
                color: inherit;
            }
            .wrap {
                width: min(1200px, calc(100% - 56px));
                margin: auto;
            }
            .header {
                height: 92px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 25px;
            }
            .logo {
                width: 166px;
                height: auto;
                display: block;
            }
            .nav {
                display: flex;
                align-items: center;
                gap: 34px;
                font-size: 13px;
                font-weight: 650;
            }
            .nav a:hover {
                color: var(--blue);
            }
            .button {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 22px;
                padding: 16px 22px;
                border-radius: 5px;
                background: var(--blue);
                color: #fff;
                font-size: 13px;
                font-weight: 750;
                transition: 0.2s;
            }
            .button:hover {
                background: #1746dd;
                transform: translateY(-2px);
            }
            .button.outline {
                border: 1px solid #bdc9d9;
                background: transparent;
                color: var(--navy);
            }
            .button.white {
                background: white;
                color: var(--navy);
            }
            .menu {
                display: none;
                border: 0;
                background: none;
                font-size: 25px;
                color: var(--navy);
            }
            .hero {
                background: var(--light);
                overflow: hidden;
            }
            .hero-inner {
                min-height: 650px;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 45px;
                align-items: center;
                padding-top: 72px;
                padding-bottom: 80px;
            }
            .eyebrow {
                font-size: 11px;
                letter-spacing: 2px;
                font-weight: 800;
                color: #2f5bff;
                text-transform: uppercase;
                display: flex;
                align-items: center;
                gap: 10px;
            }
            .eyebrow:before {
                content: "";
                height: 2px;
                width: 28px;
                background: #1e90ff;
            }
            .hero h1 {
                font-size: clamp(43px, 4.8vw, 67px);
                letter-spacing: -2.9px;
                line-height: 1.08;
                margin: 23px 0;
                font-weight: 800;
            }
            .hero h1 span {
                color: var(--blue);
            }
            .lead {
                font-size: 17px;
                line-height: 1.8;
                color: #596a80;
                max-width: 550px;
            }
            .actions {
                display: flex;
                gap: 12px;
                flex-wrap: wrap;
                margin-top: 34px;
            }
            .hero-caption {
                margin-top: 42px;
                font-size: 12px;
                color: #718099;
                display: flex;
                align-items: center;
                gap: 11px;
            }
            .hero-caption:before {
                content: "";
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: #1e90ff;
                box-shadow: 0 0 0 5px #1e90ff1a;
            }
            .showcase {
                position: relative;
                height: 470px;
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .showcase:before {
                content: "";
                position: absolute;
                inset: 20px -130px 20px 80px;
                background: #dce7ff;
                transform: skewX(-10deg);
                border-radius: 12px;
            }
            .grid {
                position: absolute;
                inset: 0;
                background-image: linear-gradient(#2f5bff10 1px, transparent 1px),
                    linear-gradient(90deg, #2f5bff10 1px, transparent 1px);
                background-size: 34px 34px;
                mask-image: linear-gradient(to right, transparent, #000);
            }
            .dashboard {
                position: relative;
                width: 94%;
                background: white;
                border: 1px solid #dbe4f1;
                border-radius: 10px;
                box-shadow: 0 28px 65px #0a1f3c20;
                overflow: hidden;
            }
            .dash-top {
                height: 52px;
                background: var(--navy);
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 0 21px;
                color: white;
                font-size: 10px;
            }
            .dash-top img {
                width: 22px;
                filter: brightness(0) invert(1);
            }
            .dash-body {
                display: grid;
                grid-template-columns: 105px 1fr;
                min-height: 290px;
            }
            .dash-nav {
                background: #f7f9fc;
                border-right: 1px solid #e8edf5;
                padding: 22px 14px;
                font-size: 9px;
                color: #7a899e;
                line-height: 3;
            }
            .dash-nav b {
                display: block;
                color: #2f5bff;
                background: #eaf0ff;
                padding-left: 8px;
                border-radius: 4px;
            }
            .dash-main {
                padding: 23px;
            }
            .dash-main h3 {
                font-size: 15px;
                margin: 0 0 4px;
            }
            .dash-main small {
                color: #8a94a6;
                font-size: 9px;
            }
            .metrics {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 8px;
                margin: 18px 0;
            }
            .metric {
                padding: 12px 9px;
                border: 1px solid #e7edf5;
                border-radius: 5px;
                color: #7b899a;
                font-size: 9px;
            }
            .metric strong {
                display: block;
                color: #183659;
                font-size: 13px;
                margin-top: 7px;
            }
            .chart {
                border: 1px solid #e7edf5;
                border-radius: 5px;
                padding: 14px;
            }
            .chart strong {
                font-size: 10px;
            }
            .bars {
                display: flex;
                align-items: end;
                gap: 10px;
                height: 95px;
                border-bottom: 1px solid #e7edf5;
            }
            .bars i {
                width: 100%;
                background: #b7caff;
                border-radius: 3px 3px 0 0;
            }
            .bars i:nth-child(3n) {
                background: #2f5bff;
            }
            .floating {
                position: absolute;
                right: -4px;
                bottom: 14px;
                background: #fff;
                padding: 15px 20px;
                box-shadow: 0 12px 32px #0a1f3c1a;
                border-radius: 6px;
                color: #6e7c90;
                font-size: 10px;
            }
            .floating b {
                display: block;
                color: var(--navy);
                font-size: 12px;
                margin-bottom: 5px;
            }
            .illustration-note {
                position: absolute;
                right: 0;
                bottom: -12px;
                color: #8594aa;
                font-size: 10px;
            }
            .ribbon {
                background: var(--navy);
                color: white;
            }
            .ribbon .wrap {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 25px;
                padding-top: 22px;
                padding-bottom: 22px;
                font-size: 13px;
            }
            .ribbon b {
                color: #91c5ff;
                font-size: 11px;
                letter-spacing: 1.3px;
            }
            .section {
                padding: 108px 0;
            }
            .section-head {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 80px;
                align-items: end;
                margin-bottom: 56px;
            }
            .section h2,
            .cta h2 {
                font-size: clamp(34px, 4vw, 48px);
                line-height: 1.15;
                letter-spacing: -1.8px;
                margin: 18px 0;
                font-weight: 800;
            }
            .section-head p,
            .copy {
                line-height: 1.8;
                color: #64738a;
                font-size: 15px;
                margin: 0;
            }
            .pillars {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 1px;
                background: #e3e9f2;
                border: 1px solid #e3e9f2;
            }
            .pillar {
                background: white;
                padding: 30px 25px;
                min-height: 230px;
            }
            .pillar .number {
                font-size: 11px;
                font-weight: 800;
                color: var(--blue);
            }
            .pillar h3 {
                font-size: 17px;
                margin: 32px 0 12px;
            }
            .pillar p {
                font-size: 13px;
                color: #6a788b;
                line-height: 1.7;
                margin: 0;
            }
            .dark {
                background: var(--navy);
                color: #fff;
                position: relative;
                overflow: hidden;
            }
            .dark .eyebrow {
                color: #69b4ff;
            }
            .dark .section-head p {
                color: #acbdd2;
            }
            .dark:after {
                content: "";
                position: absolute;
                right: -160px;
                top: -130px;
                width: 550px;
                height: 550px;
                background: url("icone.png") center/contain no-repeat;
                opacity: 0.08;
                filter: brightness(0) invert(1);
                pointer-events: none;
            }
            .steps {
                position: relative;
                z-index: 1;
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 42px;
            }
            .step {
                border-top: 1px solid #53657d;
                padding-top: 24px;
            }
            .step span {
                font-size: 11px;
                letter-spacing: 1px;
                color: #58aaff;
                font-weight: 800;
            }
            .step h3 {
                font-size: 21px;
                margin: 24px 0 12px;
            }
            .step p {
                color: #afc0d5;
                line-height: 1.75;
                font-size: 14px;
            }
            .split {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 85px;
                align-items: center;
            }
            .panel {
                background: #eaf0fb;
                border-radius: 8px;
                padding: 44px;
                position: relative;
                overflow: hidden;
            }
            .panel:after {
                content: "";
                position: absolute;
                right: -40px;
                bottom: -70px;
                width: 250px;
                height: 250px;
                background: url("icone.png") center/contain no-repeat;
                opacity: 0.08;
            }
            .panel .eyebrow {
                font-size: 10px;
            }
            .panel h3 {
                font-size: 31px;
                letter-spacing: -1px;
                line-height: 1.25;
                margin: 23px 0 18px;
            }
            .tags {
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
                margin-top: 35px;
                position: relative;
                z-index: 1;
            }
            .tags span {
                background: #fff;
                padding: 10px 12px;
                color: #405a7d;
                font-size: 11px;
                font-weight: 700;
                border-radius: 4px;
            }
            .checks {
                display: grid;
                gap: 18px;
                margin-top: 30px;
            }
            .check {
                display: flex;
                gap: 14px;
                color: #596d84;
                font-size: 14px;
                line-height: 1.55;
            }
            .check b {
                color: var(--blue);
                font-size: 17px;
            }
            .cta {
                background: #2f5bff;
                color: white;
                padding: 78px 0;
            }
            .cta .wrap {
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: 40px;
            }
            .cta .eyebrow {
                color: #ccdcff;
            }
            .cta .eyebrow:before {
                background: white;
            }
            .cta p {
                color: #e3e9ff;
                line-height: 1.7;
                margin: 0;
            }
            .footer {
                padding: 54px 0 25px;
                background: #081a33;
                color: #aebdd0;
            }
            .footer-top {
                display: flex;
                justify-content: space-between;
                gap: 30px;
            }
            .footer-logo {
                width: 150px;
                filter: brightness(0) invert(1);
            }
            .footer p {
                font-size: 12px;
                line-height: 1.8;
            }
            .footer-links {
                display: flex;
                gap: 28px;
                font-size: 12px;
                font-weight: 600;
            }
            .foot {
                border-top: 1px solid #2a3e59;
                margin-top: 45px;
                padding-top: 23px;
                font-size: 11px;
            }
            .menu:focus-visible,
            a:focus-visible {
                outline: 3px solid #1e90ff;
                outline-offset: 4px;
            }
            @media (max-width: 800px) {
                .wrap {
                    width: min(100% - 40px, 1200px);
                }
                .header {
                    height: 76px;
                }
                .logo {
                    width: 140px;
                }
                .header > .button {
                    display: none;
                }
                .menu {
                    display: block;
                }
                .nav {
                    display: none;
                    position: absolute;
                    z-index: 10;
                    top: 76px;
                    left: 0;
                    right: 0;
                    padding: 25px;
                    background: white;
                    box-shadow: 0 8px 20px #0a1f3c1a;
                    align-items: flex-start;
                    flex-direction: column;
                }
                .nav.open {
                    display: flex;
                }
                .hero-inner {
                    grid-template-columns: 1fr;
                    padding-top: 65px;
                    gap: 25px;
                }
                .hero h1 {
                    letter-spacing: -2px;
                }
                .showcase {
                    height: 370px;
                }
                .dashboard {
                    width: 100%;
                }
                .dash-body {
                    grid-template-columns: 80px 1fr;
                }
                .dash-nav {
                    padding: 15px 8px;
                }
                .dash-main {
                    padding: 18px;
                }
                .floating {
                    right: 0;
                    bottom: 0;
                }
                .ribbon .wrap {
                    justify-content: flex-start;
                    flex-wrap: wrap;
                }
                .section {
                    padding: 75px 0;
                }
                .section-head,
                .split {
                    grid-template-columns: 1fr;
                    gap: 24px;
                }
                .pillars {
                    grid-template-columns: 1fr 1fr;
                }
                .pillar {
                    min-height: 0;
                }
                .steps {
                    grid-template-columns: 1fr;
                    gap: 22px;
                }
                .cta .wrap {
                    display: block;
                }
                .cta .button {
                    margin-top: 25px;
                }
                .footer-top {
                    display: block;
                }
                .footer-links {
                    margin-top: 30px;
                    flex-wrap: wrap;
                }
            }
            @media (max-width: 480px) {
                .pillars {
                    grid-template-columns: 1fr;
                }
                .metrics {
                    gap: 4px;
                }
                .metric {
                    padding: 9px 5px;
                    font-size: 8px;
                }
                .showcase {
                    height: 340px;
                }
                .hero-inner {
                    padding-bottom: 60px;
                }
                .panel {
                    padding: 30px;
                }
            }
            .phone {
                position: absolute;
                right: -5px;
                bottom: -2px;
                width: 155px;
                padding: 10px;
                background: #0a1f3c;
                border: 5px solid #0a1f3c;
                border-radius: 20px;
                box-shadow: 0 15px 35px #0a1f3c40;
                color: #0a1f3c;
            }
            .phone:before {
                content: "";
                display: block;
                width: 42px;
                height: 4px;
                background: #8a94a6;
                border-radius: 5px;
                margin: 0 auto 10px;
            }
            .phone-top {
                display: flex;
                justify-content: space-between;
                color: #fff;
                font-size: 8px;
                font-weight: 800;
            }
            .phone-top span {
                color: #a9caff;
            }
            .phone-title {
                background: #fff;
                padding: 15px 9px 7px;
                margin-top: 10px;
                font-weight: 800;
                font-size: 10px;
                border-radius: 8px 8px 0 0;
            }
            .phone-item {
                background: white;
                padding: 8px 9px;
                border-bottom: 1px solid #edf0f7;
                font-size: 9px;
            }
            .phone-item b,
            .phone-item small {
                display: block;
            }
            .phone-item small {
                margin-top: 3px;
                color: #8a94a6;
                font-size: 8px;
            }
            .phone-tag {
                background: #e9f1ff;
                color: #2f5bff;
                padding: 8px;
                text-align: center;
                font-size: 8px;
                font-weight: 800;
                border-radius: 0 0 8px 8px;
            }
            .illustration-note {
                right: 160px;
            }
            .feature-note {
                color: #79899b;
                font-size: 12px;
                line-height: 1.7;
                margin-top: 20px;
            }
            .use-section {
                background: #f5f7fa;
            }
            .use-grid {
                display: grid;
                grid-template-columns: repeat(5, 1fr);
                gap: 14px;
            }
            .use-grid article {
                background: white;
                padding: 25px 20px;
                border: 1px solid #e2e9f4;
                border-radius: 7px;
            }
            .use-grid span {
                font-size: 11px;
                font-weight: 800;
                color: #2f5bff;
            }
            .use-grid h3 {
                font-size: 16px;
                line-height: 1.35;
                margin: 25px 0 12px;
            }
            .use-grid p {
                font-size: 13px;
                line-height: 1.7;
                color: #65758c;
                margin: 0;
            }
            .contact-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 75px;
            }
            .contact-notice {
                font-size: 12px;
                color: #6c7f97;
                margin-top: 22px;
            }
            .contact-form {
                background: #f5f7fa;
                border: 1px solid #e2e9f4;
                padding: 30px;
                border-radius: 8px;
            }
            .contact-form label {
                display: block;
                color: #273d59;
                font-size: 12px;
                font-weight: 700;
                margin-bottom: 16px;
            }
            .contact-form label span {
                font-weight: 400;
                color: #718199;
            }
            .contact-form input,
            .contact-form textarea {
                display: block;
                width: 100%;
                padding: 13px 12px;
                margin-top: 8px;
                border: 1px solid #cdd8e6;
                border-radius: 4px;
                background: #fff;
                color: #0a1f3c;
                font:
                    14px Raleway,
                    Arial;
                resize: vertical;
            }
            .contact-form button {
                border: 0;
                cursor: pointer;
            }
            .contact-form button.outline {
                border: 1px solid #bdc9d9;
            }
            .form-row {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 15px;
            }
            .contact-result {
                border-top: 1px solid #dbe4ef;
                margin-top: 25px;
                padding-top: 22px;
            }
            .contact-result p {
                font-size: 12px;
                color: #405a7d;
            }
            @media (max-width: 800px) {
                .use-grid {
                    grid-template-columns: repeat(2, 1fr);
                }
                .contact-grid {
                    grid-template-columns: 1fr;
                    gap: 28px;
                }
            }
            @media (max-width: 480px) {
                .use-grid,
                .form-row {
                    grid-template-columns: 1fr;
                }
                .phone {
                    width: 125px;
                    right: -5px;
                }
                .illustration-note {
                    right: 125px;
                }
                .contact-form {
                    padding: 20px;
                }
            }
            .showcase:before {
                inset: 12px 2% 10px 12%;
                border-radius: 45%;
                transform: none;
                background: radial-gradient(circle, #d7e7ff 0%, #e4edff 58%, transparent 72%);
            }
            .iphone {
                position: relative;
                width: 257px;
                height: 500px;
                padding: 9px;
                border-radius: 42px;
                background: linear-gradient(130deg, #202a3b, #080e19 50%, #27354a);
                box-shadow:
                    0 32px 65px #0a1f3c35,
                    0 0 0 2px #8993a0;
                transform: rotate(-4deg);
                z-index: 1;
            }
            .iphone-screen {
                position: relative;
                background: #f6f8fc;
                border-radius: 34px;
                height: 100%;
                overflow: hidden;
                padding: 0 16px;
            }
            .statusbar {
                display: flex;
                justify-content: space-between;
                padding: 15px 7px 0;
                font: 700 10px Arial;
                color: #142945;
            }
            .island {
                position: absolute;
                top: 10px;
                left: 50%;
                transform: translateX(-50%);
                height: 19px;
                width: 73px;
                background: #070c14;
                border-radius: 20px;
            }
            .apphead {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: 31px;
            }
            .apphead img {
                width: 85px;
            }
            .avatar {
                width: 26px;
                height: 26px;
                display: grid;
                place-items: center;
                background: #e3ebff;
                color: #2f5bff;
                border-radius: 50%;
                font-size: 9px;
                font-weight: 800;
            }
            .greeting {
                font-size: 17px;
                font-weight: 800;
                margin-top: 29px;
            }
            .appsubtitle {
                font-size: 10px;
                color: #74859b;
                margin-top: 7px;
            }
            .apps-label {
                display: flex;
                justify-content: space-between;
                margin: 28px 0 10px;
                font-size: 9px;
                letter-spacing: 0.8px;
                font-weight: 800;
                color: #788aa1;
            }
            .app-tile {
                display: flex;
                align-items: center;
                gap: 9px;
                background: white;
                border: 1px solid #e5ebf4;
                border-radius: 9px;
                padding: 10px 8px;
                margin-bottom: 8px;
                box-shadow: 0 3px 10px #0a1f3c08;
            }
            .app-icon {
                width: 35px;
                height: 35px;
                display: grid;
                place-items: center;
                border-radius: 9px;
                background: #e9efff;
                color: #2f5bff;
                font-size: 18px;
                font-weight: 800;
                flex: none;
            }
            .app-icon.violet {
                background: #eeeaff;
                color: #7655dd;
            }
            .app-icon.cyan {
                background: #e5f5ff;
                color: #1689be;
            }
            .app-tile strong,
            .app-tile small {
                display: block;
            }
            .app-tile strong {
                font-size: 10px;
            }
            .app-tile small {
                font-size: 8px;
                color: #8a94a6;
                margin-top: 4px;
            }
            .app-arrow {
                margin-left: auto;
                color: #9daabe;
                font-size: 20px;
            }
            .app-bottom {
                position: absolute;
                bottom: 20px;
                left: 0;
                right: 0;
                background: white;
                border-top: 1px solid #e8edf5;
                display: flex;
                justify-content: space-around;
                padding: 9px 4px;
                color: #687b94;
                font-size: 15px;
                text-align: center;
            }
            .app-bottom span:first-child {
                color: #2f5bff;
            }
            .app-bottom small {
                display: block;
                font-size: 7px;
                margin-top: 2px;
            }
            .home-indicator {
                position: absolute;
                bottom: 7px;
                left: 50%;
                transform: translateX(-50%);
                width: 74px;
                height: 4px;
                border-radius: 5px;
                background: #1d2939;
            }
            .illustration-note {
                right: 8%;
                bottom: -14px;
            }
            @media (max-width: 800px) {
                .showcase {
                    height: 470px;
                }
                .iphone {
                    width: 225px;
                    height: 438px;
                    border-radius: 38px;
                }
                .iphone-screen {
                    border-radius: 30px;
                }
                .greeting {
                    margin-top: 20px;
                }
                .apps-label {
                    margin-top: 18px;
                }
                .apphead {
                    margin-top: 25px;
                }
                .app-tile {
                    padding: 7px;
                }
                .illustration-note {
                    right: 0;
                }
            }
            @media (max-width: 480px) {
                .showcase {
                    height: 435px;
                }
                .iphone {
                    width: 212px;
                    height: 414px;
                }
                .apphead {
                    margin-top: 21px;
                }
                .greeting {
                    margin-top: 16px;
                }
                .apps-label {
                    margin-top: 14px;
                }
            }
            .challenges {
                background: #fff;
            }
            .challenge-grid {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 18px;
            }
            .challenge-grid article {
                background: #f5f7fa;
                border: 1px solid #e4ebf4;
                padding: 27px 23px;
                border-radius: 7px;
            }
            .challenge-grid span,
            .case-copy span {
                color: #2f5bff;
                font-size: 10px;
                font-weight: 800;
                letter-spacing: 1px;
            }
            .challenge-grid h3 {
                font-size: 16px;
                margin: 25px 0 12px;
            }
            .challenge-grid p,
            .case-copy p,
            .case-copy li {
                font-size: 13px;
                line-height: 1.75;
                color: #64738a;
            }
            .journey {
                grid-template-columns: repeat(4, 1fr);
                gap: 26px;
            }
            .journey .step h3 {
                font-size: 18px;
            }
            .case-showcase {
                display: grid;
                gap: 18px;
            }
            .case {
                display: grid;
                grid-template-columns: 1fr 190px;
                align-items: center;
                gap: 35px;
                padding: 34px 48px;
                background: white;
                border: 1px solid #e1e9f4;
                border-radius: 9px;
            }
            .case:nth-child(even) {
                background: #eef3fc;
            }
            .case-copy h3 {
                font-size: 24px;
                line-height: 1.25;
                letter-spacing: -0.6px;
                max-width: 500px;
                margin: 16px 0 12px;
            }
            .case-copy p {
                max-width: 590px;
            }
            .case-copy ul {
                padding-left: 18px;
                margin: 18px 0 0;
            }
            .mini-phone {
                width: 150px;
                height: 260px;
                border: 6px solid #0a1f3c;
                border-radius: 23px;
                background: #f7f9fd;
                margin: auto;
                padding: 14px 10px 10px;
                box-shadow: 0 12px 25px #0a1f3c20;
                position: relative;
            }
            .mini-notch {
                position: absolute;
                top: 3px;
                left: 50%;
                transform: translateX(-50%);
                width: 45px;
                height: 7px;
                border-radius: 8px;
                background: #0a1f3c;
            }
            .mini-head {
                font-size: 9px;
                font-weight: 800;
                margin: 8px 0 17px;
            }
            .mini-head span {
                float: right;
                color: #2f5bff;
            }
            .mini-title {
                font-size: 12px;
                font-weight: 800;
                margin-bottom: 13px;
            }
            .mini-field {
                background: #fff;
                border: 1px solid #e4eaf3;
                border-radius: 4px;
                margin-bottom: 8px;
                padding: 7px;
                color: #8a94a6;
                font-size: 7px;
            }
            .mini-field b {
                display: block;
                font-size: 8px;
                color: #334d6c;
                margin-top: 5px;
            }
            .mini-button {
                background: #2f5bff;
                color: white;
                text-align: center;
                border-radius: 4px;
                font-size: 8px;
                font-weight: 700;
                padding: 8px;
                margin-top: 10px;
            }
            .mini-check {
                background: white;
                padding: 10px 7px;
                border: 1px solid #e4eaf3;
                border-radius: 4px;
                margin-bottom: 8px;
                font-size: 10px;
                color: #2f5bff;
            }
            .mini-check b {
                color: #334d6c;
                font-size: 8px;
                margin-left: 4px;
            }
            .muted-check {
                color: #8a94a6;
            }
            .mini-photo {
                border: 1px dashed #a8bce0;
                border-radius: 4px;
                padding: 11px 5px;
                text-align: center;
                font-size: 8px;
                color: #2f5bff;
            }
            .faq-section {
                background: #f5f7fa;
            }
            .faq-grid {
                display: grid;
                grid-template-columns: 1fr 1.25fr;
                gap: 80px;
            }
            .faq-list details {
                border-bottom: 1px solid #d6dfeb;
            }
            .faq-list summary {
                list-style: none;
                cursor: pointer;
                padding: 21px 32px 21px 0;
                font-size: 14px;
                font-weight: 750;
                position: relative;
                line-height: 1.5;
            }
            .faq-list summary::-webkit-details-marker {
                display: none;
            }
            .faq-list summary:after {
                content: "+";
                position: absolute;
                right: 2px;
                color: #2f5bff;
                font-size: 21px;
                top: 15px;
            }
            .faq-list details[open] summary:after {
                content: "−";
            }
            .faq-list p {
                color: #64738a;
                font-size: 13px;
                line-height: 1.8;
                margin: 0 25px 20px 0;
            }
            @media (max-width: 800px) {
                .challenge-grid,
                .journey {
                    grid-template-columns: repeat(2, 1fr);
                }
                .faq-grid {
                    grid-template-columns: 1fr;
                    gap: 25px;
                }
                .case {
                    padding: 28px;
                    grid-template-columns: 1fr 150px;
                }
            }
            @media (max-width: 520px) {
                .challenge-grid,
                .journey {
                    grid-template-columns: 1fr;
                }
                .case {
                    grid-template-columns: 1fr;
                    gap: 22px;
                }
                .mini-phone {
                    margin: 0 auto;
                }
                .case-copy h3 {
                    font-size: 21px;
                }
            }
            .orbit-layout {
                display: grid;
                grid-template-columns: 0.8fr 1.2fr;
                align-items: center;
                gap: 60px;
                margin-top: 20px;
            }
            .orbit-copy p {
                color: #64738a;
                font-size: 16px;
                line-height: 1.8;
                max-width: 390px;
            }
            .orbit-key {
                margin-top: 26px;
                color: #314f73;
                font-size: 12px;
                font-weight: 700;
                display: flex;
                align-items: center;
                gap: 10px;
            }
            .orbit-key span {
                background: #2f5bff;
                width: 9px;
                height: 9px;
                border-radius: 50%;
                box-shadow: 0 0 0 5px #e9efff;
            }
            .orbit {
                height: 420px;
                position: relative;
                display: grid;
                place-items: center;
                background: radial-gradient(circle, #edf3ff 0, transparent 70%);
            }
            .orbit-ring {
                position: absolute;
                border: 1px solid #cad9f2;
                border-radius: 50%;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
            }
            .ring-one {
                width: 250px;
                height: 250px;
            }
            .ring-two {
                width: 360px;
                height: 360px;
                border-style: dashed;
            }
            .orbit-core {
                width: 154px;
                height: 154px;
                background: white;
                border: 1px solid #dfe8f6;
                border-radius: 50%;
                box-shadow: 0 12px 35px #163d7918;
                z-index: 1;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }
            .orbit-core img {
                width: 42px;
                height: 42px;
                object-fit: contain;
                margin-bottom: 8px;
            }
            .orbit-core strong {
                font-size: 13px;
            }
            .orbit-core small {
                color: #8997aa;
                font-size: 9px;
                margin-top: 5px;
            }
            .orbit-node {
                position: absolute;
                z-index: 2;
                background: #fff;
                border: 1px solid #e0e8f5;
                border-radius: 30px;
                padding: 8px 14px 8px 8px;
                box-shadow: 0 8px 22px #0a1f3c12;
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 11px;
                font-weight: 700;
            }
            .orbit-node i {
                width: 31px;
                height: 31px;
                border-radius: 50%;
                display: grid;
                place-items: center;
                background: #eaf0ff;
                color: #2f5bff;
                font-size: 16px;
                font-style: normal;
            }
            .n1 {
                top: 29px;
                left: calc(50% - 65px);
            }
            .n2 {
                right: calc(50% - 230px);
                top: 165px;
            }
            .n3 {
                bottom: 27px;
                left: calc(50% - 65px);
            }
            .n4 {
                left: calc(50% - 235px);
                top: 165px;
            }
            .orbit-dot {
                position: absolute;
                width: 8px;
                height: 8px;
                background: #1e90ff;
                border-radius: 50%;
            }
            .d1 {
                top: 74px;
                left: calc(50% - 110px);
            }
            .d2 {
                top: 100px;
                left: calc(50% + 135px);
            }
            .d3 {
                bottom: 78px;
                left: calc(50% + 108px);
            }
            .d4 {
                bottom: 105px;
                left: calc(50% - 140px);
            }
            .capabilities {
                display: grid;
                grid-template-columns: 0.85fr 1.15fr;
                border: 1px solid #dfe7f3;
                border-radius: 10px;
                overflow: hidden;
            }
            .cap-intro {
                padding: 42px;
                background: #0a1f3c;
                color: #fff;
                position: relative;
                overflow: hidden;
            }
            .cap-intro > span {
                color: #7abaff;
                font-size: 10px;
                font-weight: 800;
                letter-spacing: 1px;
            }
            .cap-intro h3 {
                font-size: 29px;
                line-height: 1.2;
                letter-spacing: -1px;
                max-width: 280px;
                margin: 23px 0 15px;
            }
            .cap-intro p {
                color: #b7c7db;
                font-size: 13px;
                line-height: 1.8;
                max-width: 290px;
            }
            .cap-emblem {
                height: 145px;
                margin-top: 30px;
            }
            .cap-emblem img {
                height: 145px;
                opacity: 0.18;
                filter: brightness(0) invert(1);
            }
            .cap-list {
                display: grid;
                grid-template-columns: 1fr 1fr;
            }
            .cap-list article {
                padding: 30px 26px;
                display: flex;
                gap: 15px;
                border-left: 1px solid #e7edf5;
                border-bottom: 1px solid #e7edf5;
            }
            .cap-list article:nth-child(n + 3) {
                border-bottom: 0;
            }
            .cap-icon {
                flex: none;
                width: 40px;
                height: 40px;
                display: grid;
                place-items: center;
                border-radius: 10px;
                background: #eaf0ff;
                color: #2f5bff;
                font-weight: 800;
                font-size: 20px;
            }
            .cap-list small {
                font-size: 9px;
                letter-spacing: 0.6px;
                color: #2f5bff;
                font-weight: 800;
            }
            .cap-list h3 {
                font-size: 15px;
                margin: 11px 0;
            }
            .cap-list p {
                font-size: 12px;
                line-height: 1.75;
                color: #64738a;
                margin: 0;
            }
            .solution-flow {
                display: grid;
                grid-template-columns: 1.15fr 0.85fr;
                gap: 55px;
                align-items: center;
            }
            .flow-steps {
                position: relative;
            }
            .flow-steps:before {
                content: "";
                position: absolute;
                left: 20px;
                top: 24px;
                bottom: 35px;
                width: 2px;
                background: #cad8f1;
            }
            .flow-steps article {
                position: relative;
                display: flex;
                gap: 20px;
                padding: 0 0 26px;
            }
            .flow-steps article:last-child {
                padding-bottom: 0;
            }
            .flow-number {
                flex: none;
                width: 42px;
                height: 42px;
                border-radius: 50%;
                display: grid;
                place-items: center;
                background: white;
                border: 1px solid #bcd0f4;
                color: #2f5bff;
                font-size: 11px;
                font-weight: 800;
                z-index: 1;
            }
            .flow-steps h3 {
                font-size: 16px;
                margin: 1px 0 7px;
            }
            .flow-steps p {
                font-size: 13px;
                line-height: 1.65;
                color: #64738a;
                margin: 0;
                max-width: 450px;
            }
            .flow-arrival {
                position: relative;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                background: radial-gradient(circle, #dbe8ff, transparent 70%);
                min-height: 440px;
            }
            .flow-arrow {
                position: absolute;
                left: -36px;
                top: 46%;
                background: #2f5bff;
                color: #fff;
                width: 40px;
                height: 40px;
                border-radius: 50%;
                display: grid;
                place-items: center;
                font-size: 23px;
                box-shadow: 0 8px 20px #2f5bff44;
            }
            .flow-phone {
                height: 325px;
                width: 174px;
                border: 7px solid #0a1f3c;
                border-radius: 30px;
                background: #0a1f3c;
                box-shadow: 0 20px 40px #0a1f3c33;
            }
            .flow-phone-screen {
                position: relative;
                background: #f8faff;
                border-radius: 22px;
                height: 100%;
                padding: 10px;
                overflow: hidden;
            }
            .flow-island {
                position: absolute;
                top: 6px;
                left: 50%;
                transform: translateX(-50%);
                width: 48px;
                height: 11px;
                border-radius: 10px;
                background: #0a1f3c;
            }
            .flow-status {
                font: 700 7px Arial;
            }
            .flow-status span {
                float: right;
            }
            .flow-brand {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-top: 24px;
                color: #2f5bff;
            }
            .flow-brand img {
                width: 67px;
            }
            .flow-hello {
                font-size: 15px;
                line-height: 1.25;
                font-weight: 800;
                margin-top: 26px;
            }
            .flow-desc {
                color: #8393a8;
                font-size: 8px;
                margin-top: 6px;
            }
            .flow-tile {
                display: flex;
                gap: 7px;
                align-items: center;
                background: white;
                border: 1px solid #e3ebf7;
                border-radius: 6px;
                padding: 8px 6px;
                margin-top: 10px;
            }
            .flow-tile > span {
                color: #2f5bff;
                background: #edf2ff;
                padding: 6px;
                border-radius: 5px;
            }
            .flow-tile b,
            .flow-tile small {
                display: block;
                font-size: 8px;
            }
            .flow-tile small {
                color: #8a94a6;
                font-size: 7px;
                margin-top: 3px;
            }
            .flow-tile strong {
                margin-left: auto;
                color: #9badc3;
            }
            .flow-mobile-bar {
                position: absolute;
                bottom: 7px;
                width: 55px;
                height: 3px;
                background: #0a1f3c;
                border-radius: 4px;
                left: 50%;
                transform: translateX(-50%);
            }
            .flow-caption {
                text-align: center;
                margin-top: 18px;
            }
            .flow-caption strong,
            .flow-caption span {
                display: block;
            }
            .flow-caption strong {
                font-size: 13px;
            }
            .flow-caption span {
                font-size: 10px;
                color: #8a94a6;
                margin-top: 6px;
            }
            @media (max-width: 800px) {
                .orbit-layout,
                .capabilities,
                .solution-flow {
                    grid-template-columns: 1fr;
                    gap: 25px;
                }
                .orbit-copy p {
                    max-width: none;
                }
                .orbit {
                    height: 380px;
                }
                .capabilities {
                    gap: 0;
                }
                .cap-intro {
                    padding: 30px;
                }
                .cap-emblem {
                    display: none;
                }
                .flow-arrow {
                    left: 50%;
                    top: 0;
                    transform: translate(-50%, -50%) rotate(90deg);
                }
                .flow-arrival {
                    margin-top: 32px;
                }
            }
            @media (max-width: 520px) {
                .orbit {
                    height: 320px;
                }
                .ring-two {
                    width: 280px;
                    height: 280px;
                }
                .ring-one {
                    width: 200px;
                    height: 200px;
                }
                .orbit-core {
                    width: 125px;
                    height: 125px;
                }
                .n1 {
                    top: 5px;
                }
                .n3 {
                    bottom: 5px;
                }
                .n2 {
                    right: 0;
                    top: 135px;
                }
                .n4 {
                    left: 0;
                    top: 135px;
                }
                .orbit-node {
                    font-size: 10px;
                    padding-right: 9px;
                }
                .orbit-node i {
                    width: 26px;
                    height: 26px;
                }
                .cap-list {
                    grid-template-columns: 1fr;
                }
                .cap-list article {
                    border-left: 0;
                    border-bottom: 1px solid #e7edf5 !important;
                }
                .cap-list article:last-child {
                    border-bottom: 0 !important;
                }
                .flow-arrival {
                    min-height: 400px;
                }
            }
            .nav .admin-link {
                border: 1px solid #cbd7e7;
                border-radius: 5px;
                padding: 11px 14px;
                color: #0a1f3c;
                white-space: nowrap;
            }
            .nav .admin-link:hover {
                border-color: #2f5bff;
                color: #2f5bff;
            }
            @media (max-width: 800px) {
                .nav .admin-link {
                    display: inline-flex;
                }
            }
            @media (min-width: 801px) and (max-width: 1100px) {
                .nav {
                    gap: 15px;
                }
                .header {
                    gap: 15px;
                }
                .logo {
                    width: 140px;
                }
            }
            #form-status {
                font-size: 13px;
                line-height: 1.6;
                margin: 16px 0 0;
            }
            .form-success {
                color: #14754b;
            }
            .form-error {
                color: #a22b38;
            }
            .contact-form button:disabled {
                opacity: 0.6;
                cursor: wait;
            }
            .store-area {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 22px;
                border-top: 1px solid #2a3e59;
                margin-top: 36px;
                padding-top: 27px;
            }
            .store-area strong {
                font-size: 14px;
                color: #fff;
            }
            .store-area p {
                margin: 7px 0 0;
                color: #aebdd0;
            }
            .store-links {
                display: flex;
                flex-wrap: wrap;
                gap: 10px;
            }
            .store-links a {
                min-width: 165px;
                display: flex;
                align-items: center;
                gap: 11px;
                padding: 10px 13px;
                background: #fff;
                color: #0a1f3c;
                border-radius: 6px;
                transition:
                    background 0.2s,
                    transform 0.2s;
            }
            .store-links a:hover {
                background: #e8f0ff;
                transform: translateY(-2px);
            }
            .store-icon {
                font-size: 23px;
                line-height: 1;
                color: #2f5bff;
            }
            .store-links small,
            .store-links b {
                display: block;
            }
            .store-links small {
                font-size: 10px;
                font-weight: 500;
            }
            .store-links b {
                font-size: 14px;
                margin-top: 2px;
            }
            @media (max-width: 800px) {
                .store-area {
                    align-items: flex-start;
                    flex-direction: column;
                }
            }
            @media (max-width: 390px) {
                .store-links a {
                    min-width: 140px;
                }
            }
            .store-logo {
                width: 25px;
                height: 27px;
                object-fit: contain;
                flex: none;
            }
            .back-to-top {
                position: fixed;
                right: 24px;
                bottom: 24px;
                z-index: 20;
                width: 46px;
                height: 46px;
                border: 1px solid #ffffff40;
                border-radius: 50%;
                background: #2f5bff;
                color: white;
                font-size: 24px;
                line-height: 1;
                box-shadow: 0 8px 24px #0a1f3c40;
                cursor: pointer;
                transition:
                    background 0.2s,
                    transform 0.2s;
            }
            .back-to-top:hover {
                background: #1746dd;
                transform: translateY(-3px);
            }
            .back-to-top[hidden] {
                display: none;
            }
            .back-to-top:focus-visible {
                outline: 3px solid #1e90ff;
                outline-offset: 4px;
            }
            @media (max-width: 800px) {
                .back-to-top {
                    right: 16px;
                    bottom: 16px;
                }
            }
            @media (prefers-reduced-motion: reduce) {
                html {
                    scroll-behavior: auto;
                }
                .back-to-top {
                    transition: none;
                }
            }