/* Responsive composition contract. Keep readable inner grids independent of
   whether their containing section is half-width or spans the page. */
.container { --bs-gutter-x: 40px; }
.jc-button { align-items: center; display: inline-flex; gap: 10px; max-width: 100%; }
.jc-button > i { flex-shrink: 0; margin-left: 0; }
main :is(h1, h2) { text-wrap: balance; }
.jc-fix-hero h1 .jc-keep-together { color: inherit; white-space: nowrap; }
main :is(section[id], h2[id]) { scroll-margin-top: 100px; }
.jc-site-footer a { align-items: center; display: inline-flex; min-height: 44px; }

/* Flow labels must occupy their own row, not compete with the paragraph. */
.jc-scenario-ai-repair { grid-template-columns: auto minmax(0, 1fr); }
.jc-scenario-path { flex-wrap: wrap; grid-column: 1 / -1; justify-content: flex-start; }
.jc-service-map-rich strong { width: 120px; }
.jc-fit-panel { height: 100%; }
.jc-si-flow-layer strong { color: #67ffda; }
.jc-si-migration .jc-si-flow-layer strong { color: var(--jc-light-accent); }
.jc-hm-problems article > a { align-items: center; display: inline-flex; gap: 8px; }
.jc-hm-problems article > a i { flex-shrink: 0; }
.jc-before-after, .jc-finish-before-after { align-items: stretch; }
.jc-before-after > i, .jc-finish-before-after > i { align-self: center; }
/* Embedded artwork text stays legible instead of shrinking in a half-column. */
.jc-handoff-section .row > [class*="col-lg-"] { width: 100%; }
.jc-handoff-section .col-lg-7 { margin-top: 24px; }
.jc-handoff-art { max-width: 1000px; }

/* Small nested grids adapt to available space, rather than viewport alone. */
.jc-ta-categories, .jc-tp-categories, .jc-oe-capabilities {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
}
.jc-tp-service-fit {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
}
.jc-oe-process {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 165px), 1fr));
}
.jc-oe-modernization { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.jc-oe-modernization li:nth-child(3n)::after { display: none; }
.jc-ta-split > section, .jc-tp-split > section, .jc-oe-split > section {
    container-type: inline-size;
}
@container (max-width: 620px) {
    .jc-ta-evidence-row, .jc-tp-scope-flow, .jc-tp-collaboration,
    .jc-tp-decisions, .jc-oe-debt { grid-template-columns: 1fr; }
    .jc-ta-evidence-row > span { font-size: 0; }
    .jc-ta-evidence-row > span::after { content: '↓'; font-size: 24px; }
    .jc-tp-scope-flow, .jc-tp-decisions { gap: 28px; }
    .jc-tp-scope-flow > li:not(:last-child)::after,
    .jc-tp-decisions > li:not(:last-child)::after {
        content: '↓'; left: 50%; right: auto; text-align: center; top: 100%; transform: translateX(-50%); width: auto;
    }
    .jc-tp-collaboration { gap: 12px; }
    .jc-tp-scope-flow li { display: grid; gap: 8px 14px; grid-template-columns: 32px 1fr; padding: 16px; text-align: left; }
    .jc-tp-scope-flow li > i { grid-row: span 2; margin: 0; }
    .jc-tp-scope-flow h3 { margin: 0; min-height: 0; }
    .jc-tp-scope-flow p { grid-column: 2; }
    .jc-tp-collaboration article, .jc-tp-collaboration .jc-tp-collaboration-result {
        display: grid; gap: 8px 14px; grid-template-columns: 32px 1fr; padding: 16px; text-align: left;
    }
    .jc-tp-collaboration article > i { grid-row: span 2; margin: 0; }
    .jc-tp-collaboration h3 { margin: 0; }
    .jc-tp-collaboration ul { grid-column: 2; }
    .jc-tp-decisions li { align-items: center; display: flex; gap: 16px; text-align: left; }
    .jc-tp-decisions li > i { flex-shrink: 0; margin: 0; }
    .jc-tp-decisions > li:not(:last-child)::after { left: 22px; }
    .jc-oe-team { gap: 12px; grid-template-columns: 1fr; }
    .jc-oe-team article { align-items: center; display: grid; gap: 14px; grid-template-columns: 32px 1fr 1.2fr; padding: 16px; text-align: left; }
    .jc-oe-team article > i, .jc-oe-team h3 { margin: 0; }
}

/* Long seven/eight-step sequences need two readable rows even on desktop. */
.jc-auto-process, .jc-si-process, .jc-ta-process, .jc-tp-process,
.jc-ta-outcomes { gap: 28px 24px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.jc-auto-process::before, .jc-si-process::before,
.jc-ta-process::before, .jc-tp-process::before { display: none; }
.jc-tp-process li:nth-child(4n)::after { display: none; }
.jc-ta-system-wrap { padding-right: 0; }
.jc-ta-system-wrap > .jc-ta-hand-note {
    margin: 18px auto 0; position: static; text-align: center; transform: none; width: auto;
}

@media (min-width: 576px) {
    .jc-hm-engagement > li { align-items: center; flex-direction: column; text-align: center; }
    .jc-hm-engagement > li::after { top: 6px; }
}
@media (max-width: 1199px) {
    .jc-cs-featured { grid-template-columns: 1fr; }
    .jc-hm-judgment { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jc-ai-automation-flow li:nth-child(3)::after { content: none; }
    .jc-oe-priorities-grid { gap: 24px; grid-template-columns: 1fr; }
    .jc-oe-priorities-grid > .jc-oe-hand-note { justify-self: center; }
    .jc-oe-priorities-grid > .jc-oe-hand-note br { display: none; }
    .jc-ab-decisions { grid-template-columns: 1fr; }
    .jc-ab-decisions .jc-ab-panel { display: grid; gap: 8px 16px; grid-template-columns: 38px 1fr; }
    .jc-ab-decisions .jc-ab-panel > i { grid-row: span 2; margin: 0; }
    .jc-ab-decisions .jc-ab-panel p { grid-column: 2; }
    .jc-ai-automation-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-fix-process, .jc-finish-process { gap: 28px 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-fix-process::before, .jc-finish-process::before { display: none; }
    .jc-ab-why-grid, .jc-ab-experience-grid, .jc-ct-hero-grid { grid-template-columns: 1fr; gap: 30px; }
    .jc-ab-experience-cells { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .jc-ct-conversation { justify-self: center; max-width: 680px; width: 100%; }
    .jc-finished-means .row > [class*="col-lg-"] { width: 100%; }
    .jc-finish-outcomes > .container > .row > [class*="col-lg-"],
    .jc-fix-outcomes-section > .container > .row > [class*="col-lg-"] { width: 100%; }
}
@media (min-width: 576px) and (max-width: 1199px) {
    .jc-cs-study-main { grid-template-columns: minmax(0, 1fr) 250px; }
    .jc-auto-system-nodes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-auto-system-paths { display: none; }
    .jc-auto-system-flow > .jc-auto-layer { margin: 30px auto; position: relative; }
    .jc-auto-system-flow > .jc-auto-layer::before,
    .jc-auto-system-flow > .jc-auto-layer::after { color: var(--jc-cyan); content: '↓'; font-size: 24px; left: 50%; line-height: 1; position: absolute; transform: translateX(-50%); }
    .jc-auto-system-flow > .jc-auto-layer::before { top: -27px; }
    .jc-auto-system-flow > .jc-auto-layer::after { bottom: -27px; }
    .jc-finish-page .jc-finish-related { grid-template-columns: 1fr; }
    .jc-tp-categories { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
    .jc-oe-priorities { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-oe-priorities::before { display: none; }
    .jc-handoff-flow { display: block; }
    .jc-handoff-art { display: none; }
    .jc-handoff-mobile { display: block; }
    .jc-handoff-inputs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .jc-handoff-result { margin-top: 24px; }
    .jc-handoff-result > i { transform: rotate(-90deg); }
    .jc-header { padding: 0; }
    .jc-header .jc-brand { height: 76px; padding: 0; }
    .jc-header .jc-menu-toggle {
        background: rgba(0, 255, 192, .04);
        border-color: rgba(0, 255, 192, .55);
        border-radius: 5px;
        box-shadow: none;
        flex: 0 0 44px;
        height: 44px;
        margin-left: auto;
        padding: 0;
        position: relative;
        right: auto;
        top: auto;
        width: 44px;
    }
    .jc-header .jc-menu-toggle > span:not(.visually-hidden) {
        border-radius: 1px;
        height: 2px;
        left: 50%;
        margin: 0;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        transition: transform .18s ease, opacity .18s ease;
        width: 22px;
    }
    .jc-header .jc-menu-toggle > span:nth-child(2) { transform: translate(-50%, calc(-50% - 6px)); }
    .jc-header .jc-menu-toggle > span:nth-child(4) { transform: translate(-50%, calc(-50% + 6px)); }
    .jc-header .jc-menu-toggle[aria-expanded="true"] > span:nth-child(2) { transform: translate(-50%, -50%) rotate(45deg); }
    .jc-header .jc-menu-toggle[aria-expanded="true"] > span:nth-child(3) { opacity: 0; }
    .jc-header .jc-menu-toggle[aria-expanded="true"] > span:nth-child(4) { transform: translate(-50%, -50%) rotate(-45deg); }
    .jc-header .jc-nav-wrap.navbar-collapse:is(.collapse.show, .collapsing) {
        background: #061b27;
        border: 1px solid rgba(0, 255, 192, .22);
        border-radius: 6px;
        margin-bottom: 12px;
        padding: 10px 12px 12px;
    }
    .jc-header .jc-nav .nav-link { border-radius: 4px; font-size: 15px; padding: 10px 12px; }
    .jc-header .jc-nav > .nav-item + .nav-item { border-top: 1px solid rgba(183, 200, 212, .1); }
    .jc-header .jc-nav .nav-link:hover,
    .jc-header .jc-nav .nav-link.active { background: rgba(0, 255, 192, .06); }
    .jc-header .jc-services-menu-trigger:has(> .nav-link.active) { background: rgba(0, 255, 192, .06); border-radius: 4px; }
    .jc-header .jc-services-menu-trigger > .nav-link.active { background: transparent; }
    .jc-header .jc-nav-cta {
        align-items: center;
        background: var(--jc-cyan);
        color: #002b22;
        display: flex;
        justify-content: space-between;
        margin-top: 12px;
        min-height: 44px;
        padding: 10px 12px;
        text-decoration: none;
        width: 100%;
    }
    .jc-header .jc-nav .nav-link { align-items: center; display: flex; min-height: 44px; }
    .jc-header .jc-services-toggle {
        background: rgba(0, 255, 192, .06);
        border: 1px solid rgba(0, 255, 192, .24);
        border-radius: 4px;
        min-height: 44px;
        min-width: 44px;
    }
    .jc-header .jc-services-toggle:hover,
    .jc-header .jc-services-toggle[aria-expanded="true"] { background: rgba(0, 255, 192, .12); }
    .jc-header .jc-nav-wrap.navbar-collapse.collapse.show {
        max-height: calc(100dvh - 88px); overflow-y: auto;
        scrollbar-color: #245462 #061b27;
        scrollbar-width: thin;
    }
    .jc-services-dropdown .dropdown-item { align-items: center; display: flex; min-height: 44px; white-space: normal; }
    .jc-familiar-grid, .jc-finish-scenarios, .jc-auto-scenarios,
    .jc-ta-scenarios, .jc-tp-scenarios, .jc-oe-scenarios,
    .jc-fix-category-grid, .jc-auto-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jc-ta-outcomes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-auto-process, .jc-si-process, .jc-ta-process,
    .jc-tp-process { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-tp-process li::after { display: none; }
    .jc-oe-process { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-oe-modernization { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jc-oe-modernization li:nth-child(3n)::after { display: none; }
    .jc-ct-next-steps { gap: 34px; grid-template-columns: 1fr; }
    .jc-ct-next-steps li:not(:last-child)::after {
        content: '↓'; bottom: -30px; left: 8px; right: auto; top: auto;
    }
    .jc-ct-next-grid > .jc-ct-note { justify-self: start; }
    /* Remove additive column padding/margins once feature columns stack. */
    .jc-service-feature { padding: 34px 0; }
    .jc-service-feature > .container > .row { row-gap: 24px; }
    .jc-service-feature > .container > .row > [class*="col-"] {
        margin-top: 0; padding-bottom: 0; padding-top: 0;
    }
    .jc-service-feature .jc-feature-image { flex: auto; height: 280px; min-height: 280px; }
    .jc-services-page .jc-how-grid > div { width: 100%; }
    .jc-scenario-grid > div { width: 50%; }
    .jc-scenario-grid > div:nth-child(3), .jc-scenario-grid > div:nth-child(4),
    .jc-scenario-grid > div:last-child { width: 100%; }
}
@media (max-width: 575px) {
    .jc-tp-problem-nodes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jc-cs-business-inputs::after { grid-column: 1 / -1; }
    .jc-ta-matrix thead td { width: 80px; }
    .jc-ta-outcomes article { display: grid; gap: 12px; grid-template-columns: 32px 1fr; text-align: left; }
    .jc-ta-outcomes article > i, .jc-ta-outcomes h3 { margin: 0; }
    .jc-ta-outcomes article > p { grid-column: 1 / -1; }
    .jc-cs-business-inputs, .jc-cs-purpose > div,
    .jc-cs-system-nodes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jc-cs-business-inputs > span:last-child,
    .jc-cs-system-nodes > span:last-child { grid-column: 1 / -1; }
    .jc-cs-business-inputs span, .jc-cs-system-nodes span { flex-direction: column; }
    .jc-scenario-path { align-items: stretch; flex-direction: column; }
    .jc-scenario-path > i { transform: rotate(90deg); align-self: center; }
    .jc-hm-judgment { grid-template-columns: 1fr; }
    .jc-oe-priorities { grid-template-columns: 1fr; }
    .jc-handoff-inputs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jc-oe-team article { display: block; text-align: center; }
    .jc-oe-team article > i { margin-bottom: 14px; }
    .jc-oe-team h3 { margin-bottom: 12px; }
    .jc-ai-automation-flow { grid-template-columns: 1fr; }
    .jc-ai-automation-flow li:nth-child(3)::after { content: '↓'; }
    .jc-handoff-result > i { justify-self: center; transform: none; }
    .jc-before-after > i, .jc-finish-before-after > i { justify-self: center; }
    .jc-decision-flow > i { justify-self: center; }
    .jc-auto-comparison > i, .jc-auto-ai-flow > i { justify-self: center; }
    .container { --bs-gutter-x: 40px; }
    .jc-header .jc-brand img { height: 31px; }
    .jc-header .jc-brand { min-width: 0; }
    .jc-ct-form-shell .form-control { font-size: 16px; }
    .jc-familiar-grid, .jc-finish-scenarios, .jc-auto-scenarios,
    .jc-ta-scenarios, .jc-tp-scenarios, .jc-oe-scenarios,
    .jc-fix-category-grid, .jc-auto-categories, .jc-ta-categories,
    .jc-ta-outcomes, .jc-oe-process, .jc-oe-modernization,
    .jc-auto-process, .jc-si-process, .jc-ta-process, .jc-tp-process { grid-template-columns: 1fr; }
    .jc-ta-outcomes article:last-child { grid-column: auto; }
    .jc-auto-process, .jc-ta-process { gap: 0; }
    .jc-auto-process::before { display: block; }
    .jc-fix-process, .jc-finish-process { gap: 0; grid-template-columns: 1fr; }
    .jc-oe-modernization li:nth-child(3n):not(:last-child)::after { display: block; }
    .jc-ab-experience-cells { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jc-ab-experience-cells > div { border-bottom: 1px solid #16404d; border-right: 1px solid #16404d; }
    .jc-ab-experience-cells > div:nth-child(2n) { border-right: 0; }
    .jc-ab-experience-cells > div:nth-last-child(-n+2) { border-bottom: 0; }
    .jc-scenario-grid > div { width: 100%; }
    .jc-service-map-rich strong { width: 112px; }
    .jc-scenario-path { gap: 8px 5px; }
    .jc-scenario-path b, .jc-scenario-path strong { font-size: 12px; }
    .jc-service-feature .jc-feature-image { height: 245px; min-height: 245px; }
    .jc-service-feature > .container > .row > [class*="col-"] { padding-left: 12px; padding-right: 12px; }
    .jc-button { line-height: 1.5; white-space: normal; }
}