:root {
            --red: #c7353f;
            --red-dark: #a32932;
            --blue: #176178;
            --navy: #132734;
            --ink: #17212b;
            --body: #4c5864;
            --muted: #6f7e8b;
            --line: #dce3e9;
            --soft: #f4f7f9;
            --white: #ffffff;
            --nav-height: 76px;
            --shadow: 0 18px 44px rgba(23, 33, 43, 0.12);
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            background: var(--white);
            color: var(--ink);
            font-family: "Source Sans 3", Arial, sans-serif;
            line-height: 1.6;
            overflow-x: hidden;
        }

        img,
        svg {
            display: block;
            max-width: 100%;
        }

        a {
            color: inherit;
        }

        .container {
            margin: 0 auto;
            width: min(1160px, calc(100% - 40px));
        }

        .eyebrow {
            color: var(--red);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 0.82rem;
            font-weight: 700;
            letter-spacing: 2.2px;
            line-height: 1.2;
            margin-bottom: 0.72rem;
            text-transform: uppercase;
        }

        .section-title {
            color: var(--ink);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: clamp(2rem, 4vw, 3.05rem);
            font-weight: 700;
            letter-spacing: 0;
            line-height: 1.05;
        }

        .section-copy {
            color: var(--body);
            font-size: 1.06rem;
            margin-top: 1rem;
            max-width: 700px;
        }

        .btn {
            align-items: center;
            border: 0;
            border-radius: 6px;
            cursor: pointer;
            display: inline-flex;
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1rem;
            font-weight: 700;
            gap: 0.55rem;
            justify-content: center;
            min-height: 48px;
            padding: 0.9rem 1.25rem;
            text-decoration: none;
            transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
        }

        .btn svg {
            height: 18px;
            width: 18px;
        }

        .btn-primary {
            background: var(--red);
            color: var(--white);
            box-shadow: 0 16px 30px rgba(199, 53, 63, 0.22);
        }

        .btn-primary:hover {
            background: var(--red-dark);
            transform: translateY(-1px);
        }

        .btn-secondary {
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.36);
            color: var(--white);
        }

        .btn-secondary:hover {
            background: rgba(255, 255, 255, 0.18);
            border-color: rgba(255, 255, 255, 0.52);
        }

        nav {
            background: rgba(255, 255, 255, 0.97);
            border-bottom: 1px solid var(--line);
            backdrop-filter: blur(12px);
            left: 0;
            min-height: var(--nav-height);
            position: fixed;
            right: 0;
            top: 0;
            z-index: 20;
        }

        .nav-inner {
            align-items: center;
            display: flex;
            justify-content: space-between;
            min-height: var(--nav-height);
        }

        .brand {
            align-items: center;
            display: inline-flex;
            gap: 0.78rem;
            text-decoration: none;
        }

        .brand img {
            height: 46px;
            width: 46px;
        }

        .brand span {
            color: var(--ink);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.25rem;
            font-weight: 700;
            line-height: 1;
            text-transform: uppercase;
        }

        .nav-links {
            align-items: center;
            display: flex;
            gap: 1.45rem;
            list-style: none;
        }

        .nav-links a {
            color: var(--body);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 0.94rem;
            font-weight: 700;
            letter-spacing: 0.4px;
            text-decoration: none;
            text-transform: uppercase;
        }

        .nav-links a:hover {
            color: var(--red);
        }

        .hero {
            align-items: center;
            background:
                linear-gradient(90deg, rgba(10, 22, 30, 0.92), rgba(10, 22, 30, 0.78) 46%, rgba(10, 22, 30, 0.28)),
                url("../background.avif");
            background-position: center;
            background-size: cover;
            color: var(--white);
            display: flex;
            min-height: 82vh;
            padding: calc(var(--nav-height) + 2.75rem) 0 3.5rem;
        }

        .hero-content {
            max-width: 780px;
        }

        .hero h1 {
            color: var(--white);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: clamp(2.8rem, 6vw, 4.9rem);
            font-weight: 700;
            letter-spacing: 0;
            line-height: 0.98;
            margin-bottom: 1.2rem;
            max-width: 860px;
        }

        .hero h1 span {
            color: #f15b64;
        }

        .hero-copy {
            color: rgba(255, 255, 255, 0.86);
            font-size: clamp(1.08rem, 2vw, 1.24rem);
            max-width: 720px;
        }

        .hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 0.8rem;
            margin-top: 2rem;
        }

        .hero-proof {
            display: grid;
            gap: 1px;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin-top: 2.4rem;
            max-width: 940px;
        }

        .proof-item {
            background: rgba(255, 255, 255, 0.09);
            border-top: 1px solid rgba(255, 255, 255, 0.2);
            min-height: 96px;
            padding: 1rem;
        }

        .proof-item strong {
            color: var(--white);
            display: block;
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.18rem;
            line-height: 1.08;
            margin-bottom: 0.35rem;
        }

        .proof-item span {
            color: rgba(255, 255, 255, 0.72);
            display: block;
            font-size: 0.92rem;
            line-height: 1.35;
        }

        section {
            padding: 5.1rem 0;
            scroll-margin-top: calc(var(--nav-height) + 18px);
        }

        .intro-row {
            align-items: end;
            display: grid;
            gap: 2rem;
            grid-template-columns: minmax(0, 0.9fr) minmax(280px, 0.55fr);
            margin-bottom: 2.4rem;
        }

        .intro-note {
            border-left: 4px solid var(--red);
            color: var(--body);
            padding-left: 1.2rem;
        }

        .market {
            background: var(--soft);
        }

        .market-grid,
        .solutions-grid {
            display: grid;
            gap: 1rem;
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }

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

        .signal,
        .solution,
        .process-step {
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 8px;
            min-height: 100%;
            padding: 1.45rem;
            transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
        }

        .signal:hover,
        .solution:hover,
        .process-step:hover {
            border-color: rgba(23, 97, 120, 0.36);
            box-shadow: var(--shadow);
            transform: translateY(-2px);
        }

        .signal-source {
            color: var(--red);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 0.82rem;
            font-weight: 700;
            letter-spacing: 1.6px;
            margin-bottom: 0.62rem;
            text-transform: uppercase;
        }

        .signal h3,
        .solution h3,
        .process-step h3 {
            color: var(--ink);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.34rem;
            font-weight: 700;
            line-height: 1.12;
            margin-bottom: 0.62rem;
        }

        .signal p,
        .solution p,
        .process-step p {
            color: var(--body);
            font-size: 0.98rem;
            line-height: 1.58;
        }

        .signal a {
            color: var(--blue);
            display: inline-flex;
            font-family: "Rajdhani", Arial, sans-serif;
            font-weight: 700;
            text-decoration: none;
        }

        .signal a:hover {
            color: var(--red);
        }

        .signal-links {
            display: flex;
            flex-direction: column;
            gap: 0.28rem;
            margin-top: 1rem;
        }

        .positioning {
            background: var(--white);
        }

        .positioning-grid {
            align-items: stretch;
            display: grid;
            gap: 2rem;
            grid-template-columns: minmax(0, 0.86fr) minmax(320px, 0.72fr);
        }

        .positioning-panel {
            background: var(--navy);
            border-radius: 8px;
            color: var(--white);
            padding: 2rem;
        }

        .positioning-panel .section-title,
        .positioning-panel .eyebrow {
            color: var(--white);
        }

        .positioning-panel .eyebrow {
            color: #ff7a82;
        }

        .positioning-panel p {
            color: rgba(255, 255, 255, 0.78);
            font-size: 1.05rem;
            margin-top: 1rem;
        }

        .fit-list {
            display: grid;
            gap: 0.9rem;
        }

        .fit-item {
            border: 1px solid var(--line);
            border-radius: 8px;
            padding: 1.15rem;
        }

        .fit-item strong {
            color: var(--ink);
            display: block;
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.18rem;
            line-height: 1.15;
            margin-bottom: 0.32rem;
        }

        .fit-item span {
            color: var(--body);
            display: block;
        }

        .solutions {
            background: var(--soft);
        }

        .solution-icon {
            align-items: center;
            background: #eef7f9;
            border: 1px solid #cfe6ec;
            border-radius: 8px;
            color: var(--blue);
            display: inline-flex;
            height: 46px;
            justify-content: center;
            margin-bottom: 1rem;
            width: 46px;
        }

        .solution-icon svg {
            fill: none;
            height: 25px;
            stroke: currentColor;
            stroke-width: 1.8;
            width: 25px;
        }

        .solution-list {
            color: var(--body);
            display: grid;
            gap: 0.42rem;
            list-style: none;
            margin-top: 1rem;
        }

        .solution-list li {
            padding-left: 1rem;
            position: relative;
        }

        .solution-list li::before {
            background: var(--red);
            border-radius: 999px;
            content: "";
            height: 5px;
            left: 0;
            position: absolute;
            top: 0.72em;
            width: 5px;
        }

        .capability-band {
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 8px;
            margin-top: 1rem;
            padding: 1.35rem;
        }

        .capability-band strong {
            color: var(--ink);
            display: block;
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.18rem;
            line-height: 1.15;
            margin-bottom: 0.75rem;
        }

        .capability-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 0.55rem;
        }

        .capability-tags a,
        .capability-tags span {
            background: #eef3f6;
            border: 1px solid #dce5ea;
            border-radius: 999px;
            color: var(--body);
            font-size: 0.94rem;
            padding: 0.42rem 0.7rem;
            text-decoration: none;
        }

        .capability-tags a:hover {
            border-color: rgba(23, 97, 120, 0.42);
            color: var(--blue);
        }

        .solution-link {
            color: var(--blue);
            display: inline-flex;
            font-family: "Rajdhani", Arial, sans-serif;
            font-weight: 700;
            margin-top: 1rem;
            text-decoration: none;
        }

        .solution-link:hover {
            color: var(--red);
        }

        .projects {
            background: var(--white);
        }

        .projects-grid {
            display: grid;
            gap: 1.2rem;
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .project-card {
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 8px;
            min-width: 0;
            overflow: hidden;
            transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
        }

        .project-card:hover {
            border-color: rgba(23, 97, 120, 0.36);
            box-shadow: var(--shadow);
            transform: translateY(-2px);
        }

        .project-media {
            aspect-ratio: 16 / 9;
            background: var(--navy);
            border-bottom: 1px solid var(--line);
            overflow: hidden;
        }

        .project-media img {
            height: 100%;
            object-fit: cover;
            object-position: top;
            width: 100%;
        }

        .project-body {
            padding: 1.55rem;
        }

        .project-type {
            color: var(--red);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 0.82rem;
            font-weight: 700;
            letter-spacing: 1.6px;
            margin-bottom: 0.55rem;
            text-transform: uppercase;
        }

        .project-body h3 {
            color: var(--ink);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.65rem;
            line-height: 1.08;
            margin-bottom: 0.7rem;
        }

        .project-body > p:not(.project-type) {
            color: var(--body);
        }

        .project-list {
            color: var(--body);
            display: grid;
            gap: 0.45rem;
            list-style: none;
            margin-top: 1rem;
        }

        .project-list li {
            padding-left: 1rem;
            position: relative;
        }

        .project-list li::before {
            background: var(--red);
            border-radius: 999px;
            content: "";
            height: 5px;
            left: 0;
            position: absolute;
            top: 0.72em;
            width: 5px;
        }

        .process {
            background: var(--white);
        }

        .process-grid {
            display: grid;
            gap: 1rem;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin-top: 2.35rem;
        }

        .step-number {
            align-items: center;
            background: var(--navy);
            border-radius: 6px;
            color: var(--white);
            display: inline-flex;
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.15rem;
            font-weight: 700;
            height: 40px;
            justify-content: center;
            margin-bottom: 1rem;
            width: 40px;
        }

        .platforms {
            background: var(--navy);
            color: var(--white);
        }

        .platforms .section-title {
            color: var(--white);
        }

        .platforms .section-copy {
            color: rgba(255, 255, 255, 0.76);
        }

        .platform-grid {
            display: grid;
            gap: 0.85rem;
            grid-template-columns: repeat(6, minmax(0, 1fr));
            margin-top: 2.4rem;
        }

        .platform-item {
            align-items: center;
            background: rgba(255, 255, 255, 0.94);
            border-radius: 8px;
            color: var(--ink);
            display: flex;
            justify-content: center;
            min-height: 96px;
            padding: 1rem;
        }

        .platform-logo {
            display: block;
            height: auto;
            max-height: 54px;
            max-width: 150px;
            object-fit: contain;
            width: auto;
        }

        .faq {
            background: var(--white);
        }

        .faq-grid {
            display: grid;
            gap: 1rem;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            margin-top: 2.35rem;
        }

        .faq-item {
            border: 1px solid var(--line);
            border-radius: 8px;
            padding: 1.35rem;
        }

        .faq-item h3 {
            color: var(--ink);
            font-family: "Rajdhani", Arial, sans-serif;
            font-size: 1.28rem;
            font-weight: 700;
            line-height: 1.15;
            margin-bottom: 0.6rem;
        }

        .faq-item p {
            color: var(--body);
        }

        .contact {
            background: var(--soft);
        }

        .contact-grid {
            align-items: start;
            display: grid;
            gap: 2rem;
            grid-template-columns: minmax(0, 0.78fr) minmax(320px, 0.9fr);
        }

        .contact-panel,
        .form-panel {
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 8px;
            padding: 1.7rem;
        }

        .contact-logo {
            margin-bottom: 1.5rem;
            width: 250px;
        }

        .contact-list {
            display: grid;
            gap: 1rem;
            list-style: none;
            margin-top: 1.5rem;
        }

        .contact-list li {
            align-items: flex-start;
            color: var(--body);
            display: flex;
            gap: 0.75rem;
        }

        .contact-list svg {
            color: var(--red);
            flex: 0 0 auto;
            height: 22px;
            margin-top: 2px;
            stroke: currentColor;
            stroke-width: 2;
            width: 22px;
        }

        .contact-list a {
            color: var(--blue);
            font-weight: 700;
            text-decoration: none;
        }

        .contact-list a:hover {
            color: var(--red);
        }

        .form-grid {
            display: grid;
            gap: 1rem;
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .field {
            display: grid;
            gap: 0.35rem;
        }

        .field-full {
            grid-column: 1 / -1;
        }

        label {
            color: var(--ink);
            font-family: "Rajdhani", Arial, sans-serif;
            font-weight: 700;
        }

        input,
        select,
        textarea {
            appearance: none;
            background: var(--white);
            border: 1px solid #cbd4dc;
            border-radius: 6px;
            color: var(--ink);
            font: inherit;
            min-height: 46px;
            padding: 0.7rem 0.8rem;
            width: 100%;
        }

        textarea {
            min-height: 132px;
            resize: vertical;
        }

        input:focus,
        select:focus,
        textarea:focus {
            border-color: var(--blue);
            box-shadow: 0 0 0 3px rgba(23, 97, 120, 0.14);
            outline: none;
        }

        .hidden-field {
            clip: rect(0 0 0 0);
            height: 1px;
            opacity: 0;
            overflow: hidden;
            position: absolute;
            white-space: nowrap;
            width: 1px;
        }

        .form-note {
            color: var(--muted);
            font-size: 0.92rem;
            margin: 0.85rem 0 1rem;
        }

        .turnstile-wrap {
            min-height: 66px;
        }

        .form-status {
            border-left: 3px solid var(--blue);
            color: var(--body);
            font-size: 0.92rem;
            margin: 0.85rem 0 0;
            padding: 0.35rem 0 0.35rem 0.7rem;
        }

        .form-status[data-state="success"] {
            border-left-color: #17854b;
        }

        .form-status[data-state="error"] {
            border-left-color: var(--red);
            color: #8d1f2a;
        }

        .form-status[hidden] {
            display: none;
        }

        footer {
            background: #121a22;
            color: rgba(255, 255, 255, 0.66);
            padding: 2.2rem 0;
        }

        .footer-inner {
            align-items: center;
            display: flex;
            gap: 1rem;
            justify-content: space-between;
        }

        .footer-inner a {
            color: rgba(255, 255, 255, 0.82);
            text-decoration: none;
        }

        .js .fade-in {
            opacity: 0;
            transform: translateY(16px);
            transition: opacity 500ms ease, transform 500ms ease;
        }

        .js .fade-in.visible {
            opacity: 1;
            transform: translateY(0);
        }

        @media (max-width: 1040px) {
            .market-grid,
            .solutions-grid,
            .projects-grid,
            .process-grid,
            .platform-grid,
            .faq-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .hero-proof {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .intro-row,
            .positioning-grid,
            .contact-grid {
                grid-template-columns: 1fr;
            }
        }

        @media (max-width: 720px) {
            :root {
                --nav-height: 126px;
            }

            .container {
                width: min(100% - 28px, 1160px);
            }

            .nav-inner {
                align-items: stretch;
                flex-direction: column;
                gap: 0.55rem;
                padding: 0.6rem 0;
            }

            .nav-links {
                border-top: 1px solid var(--line);
                display: grid;
                gap: 0.16rem 0.65rem;
                grid-template-columns: repeat(3, minmax(0, 1fr));
                padding-top: 0.45rem;
                width: 100%;
            }

            .nav-links a {
                display: block;
                font-size: 0.78rem;
                padding: 0.1rem 0;
            }

            .brand span {
                font-size: 1.05rem;
            }

            .hero {
                background:
                    linear-gradient(180deg, rgba(10, 22, 30, 0.92), rgba(10, 22, 30, 0.74)),
                    url("../background.avif");
                min-height: 78vh;
            }

            .hero-proof,
            .market-grid,
            .solutions-grid,
            .projects-grid,
            .process-grid,
            .platform-grid,
            .faq-grid,
            .form-grid {
                grid-template-columns: 1fr;
            }

            .proof-item,
            .platform-item {
                min-height: auto;
            }

            section {
                padding: 4rem 0;
            }

            .contact-logo {
                width: 220px;
            }

            .footer-inner {
                align-items: flex-start;
                flex-direction: column;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            html {
                scroll-behavior: auto;
            }

            .fade-in,
            .btn,
            .signal,
            .solution,
            .process-step {
                transition: none;
            }
        }