:root {
        --jc-teal: #00b894;
        --jc-teal-700: #008d73;
        --jc-teal-100: #e6f7f4;
        --jc-teal-50: #f3fbfa;

        --jc-black: #111111;
        --jc-ink: #171a1f;
        --jc-slate: #5b5d63;
        --jc-muted: #80858f;
        --jc-line: #e9ecef;
        --jc-soft: #f5f7f9;
        --jc-white: #ffffff;

        --jc-shadow:
            0 18px 60px rgba(17, 17, 17, 0.08);

        --jc-shadow-sm:
            0 8px 24px rgba(17, 17, 17, 0.07);

        --jc-radius: 16px;
        --jc-radius-lg: 24px;
        --jc-radius-xl: 34px;

        --jc-max: 1280px;
    }

    * {
        box-sizing: border-box;
    }

    html {
        scroll-behavior: smooth;
    }

    body {
        margin: 0;
        background: var(--jc-white);
        color: var(--jc-ink);
        font-family:
            Inter,
            ui-sans-serif,
            system-ui,
            -apple-system,
            BlinkMacSystemFont,
            "Segoe UI",
            sans-serif;
        line-height: 1.55;
        -webkit-font-smoothing: antialiased;
    }

    a {
        color: inherit;
        text-decoration: none;
    }

    button,
    input,
    select,
    textarea {
        font: inherit;
    }

    svg {
        display: block;
    }

    .jc-software-page,
    .jc-software-page * {
        box-sizing: border-box;
    }

    .jc-software-page {
        position: relative;
        overflow: hidden;
        background: var(--jc-white);
    }

    .jc-container {
        position: relative;
        z-index: 2;
        width: min(
            var(--jc-max),
            calc(100% - 40px)
        );
        margin: auto;
    }

    .jc-section {
        position: relative;
        padding: 104px 0;
        border-top: 1px solid var(--jc-line);
        background: var(--jc-white);
        overflow: hidden;
    }

    .jc-grid {
        display: grid;
        gap: 22px;
    }

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

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

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

    .jc-section-header {
        max-width: 840px;
        margin-bottom: 54px;
    }

    .jc-section-header.center {
        margin-inline: auto;
        text-align: center;
    }

    .jc-kicker {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        margin-bottom: 20px;
        color: var(--jc-teal-700);
        font-size: 12px;
        font-weight: 750;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .jc-kicker::before {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: var(--jc-teal);
        content: "";
    }

    .jc-title-xl {
        max-width: 1080px;
        margin: 0;
        font-size: clamp(50px, 7vw, 88px);
        font-weight: 720;
        letter-spacing: -0.065em;
        line-height: 0.96;
    }

    .jc-title-lg {
        margin: 0;
        font-size: clamp(36px, 4.8vw, 62px);
        font-weight: 680;
        letter-spacing: -0.05em;
        line-height: 1.02;
    }

    .jc-title-md {
        margin: 0;
        font-size: clamp(28px, 3.4vw, 44px);
        font-weight: 680;
        letter-spacing: -0.04em;
        line-height: 1.08;
    }

    .jc-lead {
        max-width: 790px;
        margin: 24px 0 0;
        color: var(--jc-slate);
        font-size: clamp(18px, 2vw, 22px);
        line-height: 1.62;
    }

    .jc-copy {
        color: var(--jc-slate);
        font-size: 17px;
        line-height: 1.7;
    }

    .jc-accent {
        color: var(--jc-teal-700);
    }

    /*
    BOTONES
    */

    .jc-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px;
        margin-top: 34px;
    }

    .jc-btn {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 0 20px;
        border: 1px solid transparent;
        border-radius: 11px;
        cursor: pointer;
        font-size: 14px;
        font-weight: 750;
        transition:
            transform 180ms ease,
            background 180ms ease,
            border-color 180ms ease,
            box-shadow 180ms ease;
    }

    .jc-btn:hover {
        transform: translateY(-2px);
    }

    .jc-btn-primary {
        background: var(--jc-teal);
        color: var(--jc-white);
        box-shadow:
            0 9px 24px rgba(0, 184, 148, 0.25);
    }

    .jc-btn-primary:hover {
        background: var(--jc-teal-700);
    }

    .jc-btn-secondary {
        border-color: var(--jc-line);
        background: var(--jc-white);
        color: var(--jc-black);
    }

    .jc-btn-secondary:hover {
        border-color: rgba(0, 184, 148, 0.55);
    }

    .jc-arrow {
        transition: transform 180ms ease;
    }

    .jc-btn:hover .jc-arrow,
    .jc-card-link:hover .jc-arrow {
        transform: translateX(4px);
    }

    /*
    RECURSOS VISUALES
    */

    .jc-wave {
        position: absolute;
        z-index: 0;
        width: 760px;
        height: 390px;
        pointer-events: none;
    }

    .jc-wave.right {
        right: -110px;
        bottom: -80px;
    }

    .jc-wave.left {
        left: -150px;
        bottom: -70px;
        transform: scaleX(-1);
    }

    .jc-dot-field {
        position: absolute;
        z-index: 0;
        width: 145px;
        height: 145px;
        background-image:
            radial-gradient(
                var(--jc-teal) 1.3px,
                transparent 1.3px
            );
        background-size: 14px 14px;
        opacity: 0.24;
        pointer-events: none;
    }

    .jc-dot-field.top-left {
        top: 42px;
        left: 28px;
    }

    .jc-dot-field.bottom-right {
        right: 32px;
        bottom: 28px;
    }

    .jc-blob {
        position: absolute;
        z-index: 0;
        border: 1px solid rgba(0, 184, 148, 0.18);
        border-radius:
            46% 54% 38% 62%
            / 48% 42% 58% 52%;
        pointer-events: none;
    }

    .jc-blob.large {
        width: 480px;
        height: 480px;
    }

    .jc-blob.medium {
        width: 310px;
        height: 310px;
    }

    .jc-blob.right {
        top: 50%;
        right: -240px;
        transform:
            translateY(-50%)
            rotate(-16deg);
    }

    .jc-blob.left {
        top: 50%;
        left: -180px;
        transform:
            translateY(-50%)
            rotate(17deg);
    }

    /*
    HERO
    */

    .jc-hero {
        position: relative;
        min-height: 830px;
        display: flex;
        align-items: center;
        padding: 100px 0 80px;
        overflow: hidden;
        background:
            radial-gradient(
                circle at 79% 35%,
                rgba(0, 184, 148, 0.12),
                transparent 22%
            ),
            linear-gradient(
                180deg,
                #ffffff 0%,
                #fbfcfc 100%
            );
    }

    .jc-hero-grid {
        display: grid;
        grid-template-columns:
            minmax(0, 1.1fr)
            minmax(390px, 0.9fr);
        align-items: center;
        gap: 76px;
    }

    .jc-breadcrumb {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-bottom: 24px;
        color: var(--jc-muted);
        font-size: 12px;
        font-weight: 650;
    }

    .jc-breadcrumb a:hover {
        color: var(--jc-teal-700);
    }

    .jc-breadcrumb span {
        color: #b2b7bd;
    }

    .jc-hero-proof {
        display: flex;
        flex-wrap: wrap;
        gap: 20px 28px;
        margin-top: 39px;
        color: var(--jc-slate);
        font-size: 13px;
    }

    .jc-proof-item {
        display: flex;
        align-items: center;
        gap: 9px;
    }

    .jc-proof-icon {
        display: grid;
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
        place-items: center;
        border-radius: 50%;
        background: var(--jc-teal-100);
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
    }

    .jc-hero-visual {
        position: relative;
        min-height: 590px;
    }

    .jc-software-orb {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 410px;
        height: 410px;
        border-radius:
            42% 58% 55% 45%
            / 48% 42% 58% 52%;
        background:
            linear-gradient(
                145deg,
                #ffffff 5%,
                #eff8f6 42%,
                #c7eee7 100%
            );
        box-shadow:
            0 35px 80px rgba(0, 141, 115, 0.18),
            inset -18px -18px 45px rgba(0, 184, 148, 0.12);
        transform:
            translate(-50%, -50%)
            rotate(-14deg);
    }

    .jc-software-orb::after {
        position: absolute;
        inset: -45px;
        border: 1px solid rgba(0, 184, 148, 0.18);
        border-radius:
            50% 50% 43% 57%
            / 57% 42% 58% 43%;
        content: "";
        transform: rotate(22deg);
    }

    .jc-software-ring {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 295px;
        height: 295px;
        border: 1px solid rgba(0, 184, 148, 0.3);
        border-radius:
            47% 53% 56% 44%
            / 41% 49% 51% 59%;
        transform:
            translate(-50%, -50%)
            rotate(10deg);
    }

    .jc-software-center {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 3;
        display: grid;
        width: 146px;
        height: 146px;
        place-items: center;
        border-radius: 50%;
        background: var(--jc-black);
        color: var(--jc-white);
        font-size: 17px;
        font-weight: 750;
        text-align: center;
        transform: translate(-50%, -50%);
        box-shadow:
            0 22px 55px rgba(17, 17, 17, 0.18);
    }

    .jc-software-node {
        position: absolute;
        z-index: 4;
        min-width: 132px;
        padding: 13px 15px;
        border: 1px solid var(--jc-line);
        border-radius: 11px;
        background: rgba(255, 255, 255, 0.92);
        box-shadow: var(--jc-shadow-sm);
        font-size: 12px;
        font-weight: 750;
        text-align: center;
        backdrop-filter: blur(14px);
    }

    .jc-software-node.one {
        top: 7%;
        left: 50%;
        transform: translateX(-50%);
    }

    .jc-software-node.two {
        top: 35%;
        right: -1%;
    }

    .jc-software-node.three {
        right: 10%;
        bottom: 9%;
    }

    .jc-software-node.four {
        bottom: 4%;
        left: 31%;
        transform: translateX(-50%);
    }

    .jc-software-node.five {
        top: 35%;
        left: -3%;
    }

    /*
    CONTEXTO
    */

    .jc-context-layout {
        display: grid;
        grid-template-columns:
            minmax(0, 0.85fr)
            minmax(0, 1.15fr);
        gap: 86px;
        align-items: start;
    }

    .jc-context-panel {
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
    }

    .jc-context-item {
        display: grid;
        grid-template-columns:
            48px
            minmax(0, 1fr);
        gap: 18px;
        padding: 28px 30px;
        border-bottom: 1px solid var(--jc-line);
    }

    .jc-context-item:last-child {
        border-bottom: 0;
    }

    .jc-context-number {
        color: var(--jc-teal-700);
        font-size: 12px;
        font-weight: 800;
    }

    .jc-context-title {
        margin: 0 0 7px;
        font-size: 20px;
        font-weight: 680;
        letter-spacing: -0.025em;
    }

    .jc-context-text {
        margin: 0;
        color: var(--jc-slate);
        font-size: 15px;
    }

    /*
    QUÉ DESARROLLAMOS
    */

    .jc-solutions-grid {
        display: grid;
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .jc-solution-card {
        position: relative;
        min-height: 260px;
        padding: 29px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
        transition:
            transform 180ms ease,
            border-color 180ms ease,
            box-shadow 180ms ease;
    }

    .jc-solution-card:hover {
        transform: translateY(-4px);
        border-color: rgba(0, 184, 148, 0.35);
        box-shadow: var(--jc-shadow);
    }

    .jc-solution-icon {
        display: grid;
        width: 46px;
        height: 46px;
        place-items: center;
        margin-bottom: 36px;
        border-radius: 13px;
        background: var(--jc-teal-100);
        color: var(--jc-teal-700);
        font-size: 16px;
        font-weight: 800;
    }

    .jc-solution-title {
        position: relative;
        z-index: 2;
        margin: 0 0 10px;
        font-size: 22px;
        font-weight: 680;
        letter-spacing: -0.03em;
    }

    .jc-solution-text {
        position: relative;
        z-index: 2;
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
    }

    .jc-solution-wave {
        position: absolute;
        right: -130px;
        bottom: -115px;
        width: 320px;
        height: 250px;
        opacity: 0.5;
    }

    /*
    SOFTWARE ESTÁNDAR O A MEDIDA
    */

    .jc-comparison-layout {
        display: grid;
        grid-template-columns:
            minmax(0, 0.78fr)
            minmax(0, 1.22fr);
        gap: 82px;
        align-items: start;
    }

    .jc-comparison-panel {
        display: grid;
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
    }

    .jc-comparison-column {
        padding: 30px;
    }

    .jc-comparison-column + .jc-comparison-column {
        border-left: 1px solid var(--jc-line);
    }

    .jc-comparison-label {
        display: inline-flex;
        margin-bottom: 34px;
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .jc-comparison-title {
        margin: 0 0 12px;
        font-size: 24px;
        font-weight: 680;
        letter-spacing: -0.03em;
    }

    .jc-comparison-text {
        margin: 0 0 23px;
        color: var(--jc-slate);
        font-size: 14px;
    }

    .jc-comparison-list {
        display: grid;
        gap: 13px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .jc-comparison-list li {
        display: grid;
        grid-template-columns:
            18px
            minmax(0, 1fr);
        gap: 9px;
        font-size: 13px;
        font-weight: 650;
    }

    .jc-comparison-list li::before {
        color: var(--jc-teal-700);
        content: "✓";
    }

    /*
    PROCESO
    */

    .jc-process-layout {
        display: grid;
        grid-template-columns:
            minmax(0, 0.82fr)
            minmax(430px, 1.18fr);
        gap: 82px;
        align-items: center;
    }

    .jc-process-list {
        margin-top: 35px;
        border-top: 1px solid var(--jc-line);
    }

    .jc-process-item {
        display: grid;
        grid-template-columns:
            34px
            minmax(0, 1fr);
        gap: 14px;
        padding: 18px 0;
        border-bottom: 1px solid var(--jc-line);
    }

    .jc-process-number {
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
    }

    .jc-process-item strong {
        display: block;
        margin-bottom: 4px;
        font-size: 16px;
    }

    .jc-process-item p {
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
    }

    .jc-process-visual {
        position: relative;
        min-height: 610px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-xl);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow);
        overflow: hidden;
    }

    .jc-process-track {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 76%;
        transform: translate(-50%, -50%);
    }

    .jc-process-line {
        position: absolute;
        top: 24px;
        bottom: 24px;
        left: 21px;
        width: 1px;
        background: rgba(0, 184, 148, 0.35);
    }

    .jc-process-step {
        position: relative;
        display: grid;
        grid-template-columns:
            44px
            minmax(0, 1fr);
        gap: 17px;
        margin-bottom: 22px;
    }

    .jc-process-step:last-child {
        margin-bottom: 0;
    }

    .jc-process-dot {
        position: relative;
        z-index: 2;
        display: grid;
        width: 44px;
        height: 44px;
        place-items: center;
        border: 1px solid rgba(0, 184, 148, 0.4);
        border-radius: 50%;
        background: var(--jc-white);
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
    }

    .jc-process-content {
        padding: 11px 14px;
        border: 1px solid var(--jc-line);
        border-radius: 11px;
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
    }

    .jc-process-content strong {
        display: block;
        margin-bottom: 3px;
        font-size: 14px;
    }

    .jc-process-content span {
        color: var(--jc-muted);
        font-size: 11px;
    }

    /*
    INTEGRACIONES
    */

    .jc-integration-layout {
        display: grid;
        grid-template-columns:
            minmax(0, 1fr)
            minmax(390px, 0.9fr);
        align-items: center;
        gap: 84px;
    }

    .jc-integration-list {
        margin-top: 34px;
        border-top: 1px solid var(--jc-line);
    }

    .jc-integration-item {
        display: grid;
        grid-template-columns:
            24px
            minmax(0, 1fr);
        gap: 14px;
        padding: 18px 0;
        border-bottom: 1px solid var(--jc-line);
    }

    .jc-integration-item strong {
        display: block;
        margin-bottom: 4px;
        font-size: 16px;
    }

    .jc-integration-item p {
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
    }

    .jc-integration-map {
        position: relative;
        min-height: 530px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-xl);
        background:
            radial-gradient(
                circle at 50% 50%,
                rgba(0, 184, 148, 0.1),
                transparent 32%
            ),
            var(--jc-white);
        box-shadow: var(--jc-shadow);
        overflow: hidden;
    }

    .jc-integration-core {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 3;
        display: grid;
        width: 145px;
        height: 145px;
        place-items: center;
        border-radius:
            44% 56% 51% 49%
            / 55% 43% 57% 45%;
        background: var(--jc-black);
        color: var(--jc-white);
        text-align: center;
        transform:
            translate(-50%, -50%)
            rotate(-7deg);
    }

    .jc-integration-core span {
        transform: rotate(7deg);
        font-size: 16px;
        font-weight: 750;
    }

    .jc-integration-orbit {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 340px;
        height: 340px;
        border: 1px solid rgba(0, 184, 148, 0.26);
        border-radius:
            47% 53% 56% 44%
            / 41% 49% 51% 59%;
        transform:
            translate(-50%, -50%)
            rotate(10deg);
    }

    .jc-integration-node {
        position: absolute;
        z-index: 4;
        min-width: 118px;
        padding: 12px 14px;
        border: 1px solid var(--jc-line);
        border-radius: 10px;
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        font-size: 12px;
        font-weight: 750;
        text-align: center;
    }

    .jc-integration-node.one {
        top: 10%;
        left: 50%;
        transform: translateX(-50%);
    }

    .jc-integration-node.two {
        top: 32%;
        right: 5%;
    }

    .jc-integration-node.three {
        right: 11%;
        bottom: 12%;
    }

    .jc-integration-node.four {
        bottom: 7%;
        left: 34%;
        transform: translateX(-50%);
    }

    .jc-integration-node.five {
        top: 35%;
        left: 3%;
    }

    /*
    BENEFICIOS
    */

    .jc-benefit-card {
        min-height: 260px;
        padding: 28px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
    }

    .jc-benefit-number {
        display: inline-flex;
        margin-bottom: 36px;
        color: var(--jc-teal-700);
        font-size: 12px;
        font-weight: 800;
    }

    .jc-benefit-title {
        margin: 0 0 11px;
        font-size: 21px;
        font-weight: 680;
        letter-spacing: -0.025em;
    }

    .jc-benefit-text {
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
    }

    /*
    IDEAL PARA
    */

    .jc-ideal-layout {
        display: grid;
        grid-template-columns:
            minmax(0, 0.8fr)
            minmax(0, 1.2fr);
        gap: 80px;
        align-items: start;
    }

    .jc-ideal-panel {
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
    }

    .jc-ideal-item {
        display: grid;
        grid-template-columns:
            24px
            minmax(0, 1fr);
        gap: 14px;
        padding: 22px 25px;
        border-bottom: 1px solid var(--jc-line);
    }

    .jc-ideal-item:last-child {
        border-bottom: 0;
    }

    .jc-ideal-item p {
        margin: 0;
        color: var(--jc-slate);
        font-size: 15px;
    }

    /*
    FAQ
    */

    .jc-faq-list {
        border-top: 1px solid var(--jc-line);
    }

    .jc-faq-item {
        border-bottom: 1px solid var(--jc-line);
    }

    .jc-faq-item summary {
        position: relative;
        padding: 24px 45px 24px 0;
        cursor: pointer;
        list-style: none;
        font-size: 18px;
        font-weight: 680;
    }

    .jc-faq-item summary::-webkit-details-marker {
        display: none;
    }

    .jc-faq-item summary::after {
        position: absolute;
        top: 50%;
        right: 4px;
        color: var(--jc-teal-700);
        content: "+";
        font-size: 24px;
        font-weight: 400;
        transform: translateY(-50%);
    }

    .jc-faq-item[open] summary::after {
        content: "−";
    }

    .jc-faq-answer {
        max-width: 900px;
        padding: 0 0 25px;
        color: var(--jc-slate);
        font-size: 15px;
    }

    /*
    CONTACTO
    */

    .jc-contact-section {
        position: relative;
        padding: 108px 0;
        border-top: 1px solid var(--jc-line);
        background: var(--jc-white);
        overflow: hidden;
    }

    .jc-contact-layout {
        display: grid;
        grid-template-columns:
            minmax(0, 0.92fr)
            minmax(420px, 0.78fr);
        align-items: start;
        gap: 80px;
    }

    .jc-contact-card {
        padding: 30px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow);
    }

    .jc-form-title {
        margin: 0 0 23px;
        font-size: 21px;
        font-weight: 680;
        letter-spacing: -0.025em;
    }

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

    .jc-field {
        display: grid;
        gap: 7px;
    }

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

    .jc-field label {
        font-size: 12px;
        font-weight: 700;
    }

    .jc-control {
        width: 100%;
        height: 46px;
        padding: 0 13px;
        border: 1px solid #dfe3e7;
        border-radius: 10px;
        outline: none;
        background: var(--jc-white);
        color: var(--jc-ink);
        transition:
            border-color 180ms ease,
            box-shadow 180ms ease;
    }

    textarea.jc-control {
        min-height: 108px;
        padding-top: 12px;
        resize: vertical;
    }

    .jc-control:focus {
        border-color: var(--jc-teal);
        box-shadow:
            0 0 0 4px rgba(0, 184, 148, 0.12);
    }

    .jc-control::placeholder {
        color: #9aa0a7;
    }

    .jc-submit {
        width: 100%;
        margin-top: 15px;
    }

    .jc-form-note {
        margin: 12px 0 0;
        color: var(--jc-muted);
        font-size: 11px;
    }

    /*
    RESPONSIVE
    */

    @media (max-width: 1050px) {
        .jc-hero-grid,
        .jc-context-layout,
        .jc-comparison-layout,
        .jc-process-layout,
        .jc-integration-layout,
        .jc-ideal-layout,
        .jc-contact-layout {
            grid-template-columns: 1fr;
        }

        .jc-hero-visual {
            min-height: 510px;
        }

        .jc-grid-4 {
            grid-template-columns: 1fr 1fr;
        }
    }

    @media (max-width: 820px) {
        .jc-section,
        .jc-contact-section {
            padding: 76px 0;
        }

        .jc-solutions-grid,
        .jc-grid-3 {
            grid-template-columns: 1fr 1fr;
        }

        .jc-software-orb {
            width: 350px;
            height: 350px;
        }
    }

    @media (max-width: 640px) {
        .jc-container {
            width: min(
                100% - 24px,
                var(--jc-max)
            );
        }

        .jc-title-xl {
            font-size: clamp(45px, 14vw, 64px);
        }

        .jc-hero {
            min-height: auto;
            padding: 72px 0 55px;
        }

        .jc-hero-visual {
            min-height: 440px;
        }

        .jc-software-orb {
            width: 300px;
            height: 300px;
        }

        .jc-software-ring {
            width: 220px;
            height: 220px;
        }

        .jc-software-center {
            width: 116px;
            height: 116px;
            font-size: 14px;
        }

        .jc-software-node {
            min-width: 98px;
            padding: 10px;
            font-size: 10px;
        }

        .jc-software-node.two {
            right: -25px;
        }

        .jc-software-node.five {
            left: -25px;
        }

        .jc-solutions-grid,
        .jc-grid-2,
        .jc-grid-3,
        .jc-grid-4,
        .jc-form-grid,
        .jc-comparison-panel {
            grid-template-columns: 1fr;
        }

        .jc-comparison-column + .jc-comparison-column {
            border-top: 1px solid var(--jc-line);
            border-left: 0;
        }

        .jc-actions {
            display: grid;
        }

        .jc-btn {
            width: 100%;
        }

        .jc-context-item {
            grid-template-columns: 1fr;
        }

        .jc-process-visual {
            min-height: 570px;
        }

        .jc-integration-map {
            min-height: 470px;
        }

        .jc-integration-orbit {
            width: 270px;
            height: 270px;
        }

        .jc-integration-node {
            min-width: 98px;
            font-size: 10px;
        }

        .jc-contact-card {
            padding: 23px;
        }
    }


    /* =========================================================
       JC CONSULTOR · LANDINGS TERRITORIALES
       ========================================================= */

    .jc-territory-hero {
        position: relative;
        min-height: 850px;
        display: flex;
        align-items: center;
        padding: 105px 0 82px;
        overflow: hidden;
        background:
            radial-gradient(circle at 78% 32%, rgba(0,184,148,.13), transparent 23%),
            linear-gradient(180deg, #fff 0%, #fbfcfc 100%);
    }

    .jc-territory-hero-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
        gap: 76px;
        align-items: center;
    }

    .jc-local-badges {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
        margin-top: 34px;
    }

    .jc-local-badge {
        display: inline-flex;
        align-items: center;
        min-height: 34px;
        padding: 0 12px;
        border: 1px solid rgba(0,184,148,.24);
        border-radius: 999px;
        background: rgba(255,255,255,.82);
        color: var(--jc-slate);
        font-size: 12px;
        font-weight: 720;
        backdrop-filter: blur(10px);
    }

    .jc-hub-visual {
        position: relative;
        min-height: 590px;
    }

    .jc-hub-orb {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 410px;
        height: 410px;
        border-radius: 43% 57% 51% 49% / 47% 43% 57% 53%;
        background: linear-gradient(145deg, #fff 5%, #eff8f6 42%, #c7eee7 100%);
        box-shadow:
            0 35px 80px rgba(0,141,115,.18),
            inset -18px -18px 45px rgba(0,184,148,.12);
        transform: translate(-50%, -50%) rotate(-12deg);
    }

    .jc-hub-orb::after {
        position: absolute;
        inset: -48px;
        border: 1px solid rgba(0,184,148,.18);
        border-radius: 49% 51% 43% 57% / 57% 42% 58% 43%;
        content: "";
        transform: rotate(24deg);
    }

    .jc-hub-ring {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 300px;
        height: 300px;
        border: 1px solid rgba(0,184,148,.28);
        border-radius: 47% 53% 56% 44% / 41% 49% 51% 59%;
        transform: translate(-50%, -50%) rotate(9deg);
    }

    .jc-hub-core {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 3;
        display: grid;
        width: 154px;
        height: 154px;
        place-items: center;
        padding: 18px;
        border-radius: 50%;
        background: var(--jc-black);
        color: var(--jc-white);
        text-align: center;
        font-size: 17px;
        font-weight: 760;
        line-height: 1.2;
        transform: translate(-50%, -50%);
        box-shadow: 0 22px 55px rgba(17,17,17,.18);
    }

    .jc-hub-node {
        position: absolute;
        z-index: 4;
        min-width: 132px;
        padding: 13px 15px;
        border: 1px solid var(--jc-line);
        border-radius: 11px;
        background: rgba(255,255,255,.94);
        box-shadow: var(--jc-shadow-sm);
        font-size: 12px;
        font-weight: 750;
        text-align: center;
        backdrop-filter: blur(14px);
    }

    .jc-hub-node.one { top: 7%; left: 50%; transform: translateX(-50%); }
    .jc-hub-node.two { top: 34%; right: -1%; }
    .jc-hub-node.three { right: 9%; bottom: 8%; }
    .jc-hub-node.four { bottom: 4%; left: 31%; transform: translateX(-50%); }
    .jc-hub-node.five { top: 35%; left: -3%; }

    .jc-territory-intro {
        position: relative;
        padding: 42px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-xl);
        background:
            radial-gradient(circle at 92% 10%, rgba(0,184,148,.12), transparent 24%),
            var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
    }

    .jc-territory-intro p {
        position: relative;
        z-index: 2;
        margin: 0;
        color: var(--jc-slate);
        font-size: 17px;
        line-height: 1.75;
    }

    .jc-territory-intro p + p { margin-top: 16px; }

    .jc-service-hub-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px;
    }

    .jc-service-hub-card {
        position: relative;
        min-height: 315px;
        padding: 28px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
    }

    .jc-service-hub-card:hover {
        transform: translateY(-4px);
        border-color: rgba(0,184,148,.34);
        box-shadow: var(--jc-shadow);
    }

    .jc-service-hub-card::after {
        position: absolute;
        right: -105px;
        bottom: -118px;
        width: 250px;
        height: 250px;
        border: 1px solid rgba(0,184,148,.15);
        border-radius: 48% 52% 45% 55% / 41% 54% 46% 59%;
        content: "";
        transform: rotate(-13deg);
    }

    .jc-service-hub-index {
        position: relative;
        z-index: 2;
        display: inline-flex;
        margin-bottom: 32px;
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .jc-service-hub-card h3 {
        position: relative;
        z-index: 2;
        margin: 0 0 11px;
        font-size: 22px;
        line-height: 1.16;
        letter-spacing: -.03em;
    }

    .jc-service-hub-card p {
        position: relative;
        z-index: 2;
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
        line-height: 1.68;
    }

    .jc-service-hub-link {
        position: absolute;
        z-index: 3;
        left: 28px;
        bottom: 25px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--jc-teal-700);
        font-size: 13px;
        font-weight: 760;
    }

    .jc-problem-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .jc-problem-card {
        padding: 28px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
    }

    .jc-problem-card span {
        display: inline-flex;
        margin-bottom: 30px;
        color: var(--jc-teal-700);
        font-size: 12px;
        font-weight: 800;
    }

    .jc-problem-card h3 {
        margin: 0 0 10px;
        font-size: 21px;
        letter-spacing: -.025em;
    }

    .jc-problem-card p {
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
        line-height: 1.68;
    }

    .jc-sector-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .jc-sector-card {
        position: relative;
        min-height: 320px;
        padding: 30px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        overflow: hidden;
    }

    .jc-sector-card::after {
        position: absolute;
        right: -95px;
        bottom: -110px;
        width: 235px;
        height: 235px;
        border: 1px solid rgba(0,184,148,.16);
        border-radius: 43% 57% 51% 49% / 52% 44% 56% 48%;
        content: "";
        transform: rotate(18deg);
    }

    .jc-sector-label {
        position: relative;
        z-index: 2;
        display: inline-flex;
        margin-bottom: 34px;
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .jc-sector-card h3 {
        position: relative;
        z-index: 2;
        margin: 0 0 11px;
        font-size: 24px;
        line-height: 1.15;
        letter-spacing: -.03em;
    }

    .jc-sector-card p {
        position: relative;
        z-index: 2;
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
        line-height: 1.68;
    }

    .jc-sector-list {
        position: relative;
        z-index: 2;
        display: grid;
        gap: 9px;
        margin: 21px 0 0;
        padding: 0;
        list-style: none;
    }

    .jc-sector-list li {
        display: grid;
        grid-template-columns: 16px minmax(0, 1fr);
        gap: 8px;
        color: var(--jc-ink);
        font-size: 13px;
        font-weight: 650;
    }

    .jc-sector-list li::before {
        color: var(--jc-teal-700);
        content: "✓";
    }

    .jc-path-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px;
    }

    .jc-path-card {
        padding: 29px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
    }

    .jc-path-card.featured {
        border-color: rgba(0,184,148,.34);
        background: linear-gradient(180deg, var(--jc-teal-50), #fff);
    }

    .jc-path-card small {
        display: inline-flex;
        margin-bottom: 29px;
        color: var(--jc-teal-700);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .jc-path-card h3 {
        margin: 0 0 10px;
        font-size: 21px;
        letter-spacing: -.025em;
    }

    .jc-path-card p {
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
        line-height: 1.68;
    }

    .jc-location-layout {
        display: grid;
        grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
        gap: 74px;
        align-items: start;
    }

    .jc-location-panel {
        padding: 32px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-xl);
        background:
            radial-gradient(circle at 88% 15%, rgba(0,184,148,.12), transparent 25%),
            var(--jc-soft);
        box-shadow: var(--jc-shadow-sm);
    }

    .jc-location-panel h3 {
        margin: 0 0 18px;
        font-size: 25px;
        letter-spacing: -.03em;
    }

    .jc-location-panel p {
        margin: 0;
        color: var(--jc-slate);
        line-height: 1.72;
    }

    .jc-location-points {
        display: grid;
        gap: 12px;
        margin-top: 24px;
    }

    .jc-location-point {
        display: grid;
        grid-template-columns: 22px minmax(0,1fr);
        gap: 10px;
        color: var(--jc-slate);
        font-size: 14px;
    }

    .jc-location-point::before {
        display: grid;
        width: 20px;
        height: 20px;
        place-items: center;
        border-radius: 50%;
        background: var(--jc-teal-100);
        color: var(--jc-teal-700);
        content: "✓";
        font-size: 10px;
        font-weight: 800;
    }

    .jc-trust-grid-local {
        display: grid;
        grid-template-columns: repeat(4, minmax(0,1fr));
        gap: 18px;
    }

    .jc-trust-card-local {
        min-height: 245px;
        padding: 27px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
    }

    .jc-trust-card-local span {
        display: inline-flex;
        margin-bottom: 34px;
        color: var(--jc-teal-700);
        font-size: 12px;
        font-weight: 800;
    }

    .jc-trust-card-local h3 {
        margin: 0 0 10px;
        font-size: 20px;
        line-height: 1.2;
        letter-spacing: -.025em;
    }

    .jc-trust-card-local p {
        margin: 0;
        color: var(--jc-slate);
        font-size: 14px;
        line-height: 1.65;
    }

    .jc-related-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 16px;
    }

    .jc-related-card {
        position: relative;
        display: block;
        padding: 25px 60px 25px 25px;
        border: 1px solid var(--jc-line);
        border-radius: var(--jc-radius-lg);
        background: var(--jc-white);
        box-shadow: var(--jc-shadow-sm);
        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
    }

    .jc-related-card:hover {
        transform: translateY(-3px);
        border-color: rgba(0,184,148,.35);
        box-shadow: var(--jc-shadow);
    }

    .jc-related-card strong {
        display: block;
        margin-bottom: 8px;
        font-size: 19px;
        letter-spacing: -.02em;
    }

    .jc-related-card span {
        color: var(--jc-slate);
        font-size: 14px;
        line-height: 1.58;
    }

    .jc-related-card::after {
        position: absolute;
        top: 50%;
        right: 25px;
        color: var(--jc-teal-700);
        content: "→";
        font-size: 20px;
        transform: translateY(-50%);
    }

    .jc-conversion-panel {
        position: relative;
        padding: 48px;
        border: 1px solid rgba(0,184,148,.25);
        border-radius: var(--jc-radius-xl);
        background:
            radial-gradient(circle at 87% 18%, rgba(0,184,148,.15), transparent 28%),
            linear-gradient(180deg, #fbfffe 0%, #f4fbf9 100%);
        overflow: hidden;
    }

    .jc-conversion-panel h2 {
        max-width: 930px;
        margin: 0;
        font-size: clamp(34px, 4vw, 55px);
        line-height: 1.03;
        letter-spacing: -.05em;
    }

    .jc-conversion-panel p {
        max-width: 800px;
        margin: 20px 0 0;
        color: var(--jc-slate);
        font-size: 18px;
        line-height: 1.7;
    }

    @media (max-width: 1050px) {
        .jc-territory-hero-grid,
        .jc-location-layout {
            grid-template-columns: 1fr;
        }

        .jc-service-hub-grid {
            grid-template-columns: repeat(2, minmax(0,1fr));
        }

        .jc-trust-grid-local {
            grid-template-columns: repeat(2, minmax(0,1fr));
        }
    }

    @media (max-width: 820px) {
        .jc-service-hub-grid,
        .jc-problem-grid,
        .jc-sector-grid,
        .jc-path-grid,
        .jc-related-grid {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 640px) {
        .jc-territory-hero {
            min-height: auto;
            padding: 72px 0 56px;
        }

        .jc-hub-visual { min-height: 440px; }
        .jc-hub-orb { width: 300px; height: 300px; }
        .jc-hub-ring { width: 220px; height: 220px; }
        .jc-hub-core { width: 118px; height: 118px; font-size: 14px; }

        .jc-hub-node {
            min-width: 98px;
            padding: 10px;
            font-size: 10px;
        }

        .jc-hub-node.two { right: -25px; }
        .jc-hub-node.five { left: -25px; }

        .jc-territory-intro,
        .jc-conversion-panel {
            padding: 28px 24px;
        }

        .jc-trust-grid-local {
            grid-template-columns: 1fr;
        }
    }