:root {
    --bg: #050d17;
    --bg2: #071525;
    --bg3: #081a2b;
    --panel: #0a1b2e;
    --panel2: #0d2338;
    --line: #1a3b56;
    --line2: #2c5775;
    --text: #f4f8fb;
    --muted: #a9bed0;
    --teal: #32d4c7;
    --teal2: #59e2d8;
    --blue: #63b7ff;
    --warm: #e8ad63;
    --max: 1220px;
    --radius: 20px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: radial-gradient(980px 560px at 70% -7%,#0b3650 0,transparent 58%),linear-gradient(180deg,var(--bg),#06111e 48%,#040b13);
    color: var(--text);
    font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    line-height: 1.56;
}

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

img {
    max-width: 100%;
}

.wrap {
    width: min(var(--max),calc(100% - 44px));
    margin: auto;
}

.skip {
    position: absolute;
    left: -9999px;
    top: 8px;
}

.skip:focus {
    left: 12px;
    z-index: 100;
    background: #fff;
    color: #000;
    padding: 10px 14px;
    border-radius: 8px;
}

:where(a, button):focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
    box-shadow: 0 0 0 5px #005fcc;
}

header {
    position: sticky;
    top: 0;
    z-index: 30;
    background: rgba(4,13,23,.92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(99,183,255,.14);
}

.nav {
    min-height: 64px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.brand {
    margin-right: auto;
    display: flex;
    align-items: center;
}

.brand img {
    width: 132px;
    height: auto;
    display: block;
    border-radius: 3px;
}

.menu {
    display: flex;
    align-items: center;
    gap: 21px;
    font-size: 13px;
    font-weight: 680;
    color: #dce8ef;
    white-space: nowrap;
}

.menu a {
    opacity: .84;
}

.menu a:hover,
.menu a.active {
    opacity: 1;
    color: var(--teal);
}

.locale {
    margin-left: 4px;
    border: 1px solid #21455f;
    background: #081827;
    border-radius: 999px;
    padding: 8px 11px;
    font: inherit;
    font-size: 12px;
    color: #dbe9f1;
    white-space: nowrap;
    cursor: default;
}

.menu-toggle {
    display: none;
    border: 1px solid #244966;
    background: #091a2a;
    color: #fff;
    border-radius: 10px;
    padding: 8px 10px;
}

.section {
    border-top: 1px solid rgba(99,183,255,.15);
    padding: 78px 0;
}

.hero {
    padding: 24px 0 38px;
    border-top: 0;
}

.page-hero {
    padding: 74px 0 66px;
    border-top: 0;
    background: radial-gradient(620px 340px at 82% 16%,rgba(50,212,199,.09),transparent 70%);
}

.eyebrow {
    font-size: 12px;
    letter-spacing: .16em;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--teal);
}

.kicker {
    font-size: 19px;
    margin: 4px 0 6px;
    color: var(--teal2);
    font-weight: 720;
}

.lede {
    font-size: 18px;
    color: #c9d8e2;
    max-width: 860px;
}

.muted {
    color: var(--muted);
}

h1 {
    font-size: clamp(32px,3.2vw,64px);
    line-height: 1.02;
    letter-spacing: -.045em;
    margin: 5px 0 12px;
    max-width: 1000px;
}

.page-hero h1 {
    max-width: 1050px;
}

.section-head {
    margin-bottom: 30px;
}

.section-head h2,
.split h2 {
    font-size: clamp(29px,3.2vw,45px);
    line-height: 1.08;
    letter-spacing: -.035em;
    margin: 7px 0 10px;
}

.section-head p {
    max-width: 820px;
    color: var(--muted);
    margin: 0;
}

.compact-title {
    max-width: 1080px;
}

.actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin: 16px 0 0;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 12px 18px;
    font-size: 13px;
    font-weight: 800;
    border: 1px solid #345670;
}

.btn.primary {
    background: var(--teal);
    border-color: var(--teal);
    color: #031218;
}

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

.hero-grid {
    display: grid;
    grid-template-columns: 205px minmax(0,1fr);
    gap: 36px;
    align-items: center;
}

.hero-visual {
    width: 186px;
    height: 270px;
    position: relative;
    overflow: hidden;
    border: 1px solid #31516a;
    border-radius: 28px;
    background: #101c25;
    box-shadow: none;
}

.hero-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 53% 21%;
    transform: scale(1.02);
}

.hero-visual::before {
    content: "";
    position: absolute;
    z-index: 2;
    top: -1px;
    left: 48%;
    width: 62px;
    height: 42px;
    transform: translateX(-50%);
    background: var(--bg);
    border-radius: 0 0 31px 31px;
}

.hero-visual::after {
    content: "";
    position: absolute;
    z-index: 2;
    right: -1px;
    top: 46%;
    width: 29px;
    height: 64px;
    transform: translateY(-50%);
    background: var(--bg);
    border-radius: 30px 0 0 30px;
}

.notch-left {
    position: absolute;
    z-index: 2;
    left: -1px;
    top: 48%;
    width: 26px;
    height: 60px;
    transform: translateY(-50%);
    background: var(--bg);
    border-radius: 0 30px 30px 0;
}

.hero-copy {
    font-size: 15px;
    line-height: 1.48;
    color: #c9d8e2;
    max-width: 900px;
}

.hero-copy p {
    margin: 0 0 8px;
}

.hero .hero-title {
    font-size: clamp(34px,3.1vw,50px);
    line-height: 1.01;
    max-width: 920px;
}

.hero .eyebrow {
    margin-top: 0;
}

.grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

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

.grid4 {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 15px;
}

.grid5 {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    gap: 13px;
}

.card {
    border: 1px solid #1a3f5d;
    background: linear-gradient(180deg,rgba(14,36,57,.94),rgba(7,23,38,.94));
    border-radius: 18px;
    padding: 18px;
    min-width: 0;
}

.card h3 {
    font-size: 19px;
    line-height: 1.16;
    margin: 10px 0 8px;
}

.card p {
    font-size: 14px;
    color: #afc3d1;
    margin: 0 0 16px;
}

.num {
    color: var(--teal);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .12em;
}

.link {
    color: var(--teal);
    font-weight: 780;
    font-size: 12px;
}

.image-slot {
    height: 118px;
    border: 1px dashed #3b6079;
    background: linear-gradient(145deg,#12283b,#0e2031);
    border-radius: 13px;
    display: grid;
    place-items: center;
    color: #7392a8;
    margin-bottom: 14px;
    text-align: center;
    padding: 12px;
}

.image-slot.large {
    height: 300px;
}

.image-slot.wide {
    height: 190px;
}

.image-slot.tall {
    height: 340px;
}

.image-slot small {
    display: block;
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.media-card {
    display: grid;
    align-items: center;
}

.media-card .image-slot {
    height: 165px;
    margin: 0;
}

.solutions .media-card {
    grid-template-columns: 220px 1fr;
}

.lineage .card {
    padding: 14px;
}

.lineage .image-slot {
    height: 96px;
}

.lineage h3 {
    font-size: 15px;
}

.cases .media-card {
    grid-template-columns: 165px 1fr;
}

.cases .image-slot {
    height: 132px;
}

.split {
    display: grid;
    grid-template-columns: minmax(0,.96fr) minmax(380px,1.04fr);
    gap: 62px;
    align-items: center;
}

.split p {
    color: #afc3d1;
}

.flow {
    display: grid;
    align-items: stretch;
}

.flow.step7 {
    grid-template-columns: repeat(7,1fr);
}

.flow .step {
    position: relative;
    border: 1px solid #244a66;
    background: #0a2033;
    border-radius: 14px;
    padding: 16px 13px;
    min-height: 96px;
    font-size: 13px;
}

.flow .step strong {
    display: block;
    color: #fff;
    margin-bottom: 6px;
}

.flow .step:not(:last-child)::after {
    content: "→";
    position: absolute;
    right: -10px;
    top: 42%;
    color: var(--teal);
    z-index: 2;
}

.tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 18px 0;
}

.tag {
    padding: 7px 10px;
    border: 1px solid #294a64;
    border-radius: 999px;
    background: #0d2235;
    font-size: 12px;
    color: #d4e1e9;
}

.flagship {
    background: radial-gradient(630px 340px at 15% 50%,rgba(37,112,184,.23),transparent 70%),linear-gradient(180deg,#071b30,#061321);
}

.flag-grid {
    display: grid;
    align-items: center;
}

.product-art {
    border-radius: 26px;
    overflow: hidden;
    border: 1px solid #24537a;
    background: #000;
    max-width: 300px;
}

.product-art img {
    width: 100%;
    display: block;
}

.proofs {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 8px;
    margin: 20px 0;
}

.proof {
    padding: 8px 10px;
    border: 1px solid #294a64;
    border-radius: 7px;
    background: #0d2235;
    text-align: center;
    font-size: 11px;
    color: #d4e1e9;
}

.boundary {
    border-left: 3px solid var(--warm);
    background: rgba(232,173,99,.08);
    padding: 12px 14px;
    color: #d8e3e9;
    font-size: 13px;
}

.note {
    border: 1px solid rgba(232,173,99,.36);
    background: rgba(232,173,99,.06);
    border-radius: 14px;
    padding: 14px 16px;
    color: #d7e1e8;
    font-size: 13px;
}

.quote-line {
    font-size: 20px;
    color: #dfeaf0;
    border-left: 3px solid var(--teal);
    padding-left: 16px;
}

.two-col-list {
    columns: 2;
    column-gap: 36px;
    padding-left: 18px;
    color: #b4c6d2;
}

.two-col-list li {
    break-inside: avoid;
    margin-bottom: 7px;
}

.checklist {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px 20px;
    padding: 0;
    list-style: none;
}

.checklist li {
    border-bottom: 1px solid #163650;
    padding: 9px 0;
    color: #b9cbd6;
}

.checklist li::before {
    content: "•";
    color: var(--teal);
    margin-right: 8px;
}

.table-wrap {
    overflow: auto;
    border: 1px solid #1b405d;
    border-radius: 16px;
}

table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
    background: #081a2a;
}

th,
td {
    padding: 13px 14px;
    border-bottom: 1px solid #183b57;
    text-align: left;
    vertical-align: top;
    font-size: 13px;
}

th {
    color: #e8f2f6;
    background: #0c2337;
}

td {
    color: #b8cbd6;
}

.state {
    font-family: ui-monospace,SFMono-Regular,Consolas,monospace;
    color: var(--teal2);
}

.timeline {
    display: grid;
    gap: 13px;
}

.timeline-item {
    display: grid;
    grid-template-columns: 175px 1fr;
    gap: 22px;
    padding: 18px 0;
    border-bottom: 1px solid #163650;
}

.timeline-item .era {
    color: var(--teal);
    font-weight: 800;
}

.legacy-block {
    display: grid;
    align-items: start;
}

.source-label {
    font-size: 11px;
    color: #7894a6;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.status-pill {
    display: inline-flex;
    border: 1px solid #365a70;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 11px;
    color: #b9cbd6;
    margin-top: 8px;
}

.final {
    background: linear-gradient(135deg,#0a2239,#06121f);
}

.final-grid {
    display: grid;
    grid-template-columns: 1.12fr .88fr;
    gap: 58px;
}

.final h2 {
    font-size: clamp(34px,3.4vw,47px);
    line-height: 1.07;
    margin: 8px 0 14px;
}

.final p {
    color: #b7c9d5;
}

.contact {
    border-left: 1px solid #21445e;
    padding-left: 44px;
}

.contact-details {
    display: grid;
    gap: 9px;
    margin-top: 22px;
    font-size: 14px;
}

.contact-details span {
    color: var(--teal);
    margin-right: 9px;
}

.footer {
    padding: 28px 0 40px;
    color: #7790a3;
    font-size: 12px;
    text-align: center;
    border-top: 1px solid #15354f;
}

@media (max-width:1050px){
    .menu {
        gap: 14px;
    }

    .menu a {
        font-size: 12px;
    }

    .hero-grid {
        grid-template-columns: 190px 1fr;
        gap: 30px;
    }

    .hero-visual {
        width: 175px;
        height: 255px;
    }

    .grid4 {
        grid-template-columns: 1fr 1fr;
    }

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

    .flow,
    .flow.step7 {
        grid-template-columns: 1fr 1fr;
    }

    .flow .step::after {
        display: none;
    }

    .split,
    .flag-grid,
    .final-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .contact {
        border-left: 0;
        border-top: 1px solid #21445e;
        padding: 30px 0 0;
    }

    .media-card,
    .solutions .media-card,
    .cases .media-card,
    .legacy-block {
        grid-template-columns: 1fr;
    }

    .product-art {
        max-width: 270px;
    }

    .timeline-item {
        grid-template-columns: 130px 1fr;
    }
}

@media (max-width:820px){
    .menu {
        display: none;
        position: absolute;
        left: 18px;
        right: 18px;
        top: 70px;
        flex-direction: column;
        align-items: stretch;
        background: #071725;
        border: 1px solid #21435e;
        border-radius: 16px;
        padding: 14px;
    }

    .menu.open {
        display: flex;
    }

    .menu-toggle {
        display: block;
    }

    .locale {
        margin-left: 0;
    }

    .grid3,
    .grid4,
    .grid2 {
        grid-template-columns: 1fr;
    }

    .checklist {
        grid-template-columns: 1fr;
    }

    .two-col-list {
        columns: 1;
    }
}

@media (max-width:680px){
    .wrap {
        width: min(100% - 28px,var(--max));
    }

    .nav {
        min-height: 66px;
    }

    .brand img {
        width: 120px;
    }

    .hero,
    .page-hero {
        padding-top: 28px;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .hero-visual {
        width: min(58vw,205px);
        height: 285px;
    }

    .section {
        padding: 58px 0;
    }

    h1,
    .page-hero h1 {
        font-size: 39px;
    }

    .proofs {
        grid-template-columns: 1fr 1fr;
    }

    .image-slot.large {
        height: 220px;
    }

    .grid5 {
        grid-template-columns: 1fr;
    }

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

    .flow,
    .flow.step7 {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion:reduce){
    * {
        scroll-behavior: auto!important;
        transition: none!important;
    }
}

.hero-visual::before,
.hero-visual::after,
.hero-visual .notch-left {
    display: none !important;
}


/* Pinegrow visual placement pass — 2026-08-29. No visible copy changes. */
.card > picture,
.media-card > picture,
.image-slot picture {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
    background: #071827;
}

.card > picture {
    height: 132px;
    margin: 0 0 14px;
}

.card > picture img,
.media-card > picture img,
.image-slot picture img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.image-slot:has(img) {
    padding: 0;
    overflow: hidden;
    border-style: solid;
    border-color: #254b66;
}

.image-slot:has(img) > div {
    width: 100%;
    height: 100%;
}

.image-slot:has(img) small,
.image-slot:has(img) > div > strong {
    display: none;
}

.image-slot:has(img) picture {
    width: 100%;
    height: 100%;
}

.media-card > picture {
    height: 165px;
}

.solutions .media-card > picture {
    height: 170px;
}

.cases .media-card > picture {
    height: 145px;
}

.lineage .card > picture {
    height: 112px;
    background: #06131f;
}

.lineage .card > picture img {
    object-fit: contain;
    padding: 4px;
}

#help .card > picture img {
    object-position: center;
}

#enterprise-ai .image-slot.large picture img {
    object-position: center;
}

#foundation .image-slot picture img,
.solutions .image-slot picture img {
    object-fit: contain;
    padding: 8px;
    background: #081a29;
}

.cases .media-card > picture img,
.cases .image-slot picture img {
    object-fit: contain;
    padding: 8px;
    background: #081a29;
}

@media (max-width: 760px) {
    .card > picture,
    .media-card > picture,
    .solutions .media-card > picture,
    .cases .media-card > picture {
        height: 190px;
    }

    .lineage .card > picture {
        height: 150px;
    }
}


/* Homepage detail refinement — 2026-08-29 */
#help .card:nth-child(3) > picture img {
    object-position: center 18%;
}

.locale-flags {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
}

.locale-flags .locale-sep {
    color: #668399;
    font-size: 11px;
}

.locale-flags .locale-arrow {
    margin-left: 2px;
    color: #dbe9f1;
    font-size: 10px;
}


/* Homepage compact/full-history + lineage image refinement — 2026-08-29 */
#home.hero {
    padding-top: 16px;
    padding-bottom: 28px;
}

#home .hero-title {
    margin-bottom: 10px;
}

.lineage .card:nth-child(2) > picture,
.lineage .card:nth-child(3) > picture {
    height: 126px;
}

.lineage .card:nth-child(2) > picture img,
.lineage .card:nth-child(3) > picture img {
    object-fit: cover;
    object-position: center;
    padding: 0;
    transform: scale(1.09);
}

.lineage .card:nth-child(5) > picture img {
    object-fit: cover;
    object-position: center;
    padding: 0;
}

@media (max-width: 960px) {
    #home .hero-grid {
        grid-template-columns: 170px minmax(0,1fr);
        gap: 22px;
    }
    #home .hero-visual {
        width: 152px;
        height: 220px;
    }
    #home .hero-copy {
        font-size: 13.2px;
    }
}


/* Hero one-screen sizing + requested image fit — 2026-08-29 */

#help .card:nth-child(2) > picture img {
    object-fit: cover;
    object-position: center;
}

.solutions .media-card:nth-child(2) > picture img {
    object-fit: cover;
    object-position: center;
    padding: 0;
    background: #081a29;
}

@media (max-width: 960px) {
    #home.hero {
        min-height: auto;
    }
}


/* Enterprise AI — CCPC logo presentation */
.ccpc-logo-art {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #081a29;
    overflow: hidden;
}

.ccpc-logo-art img {
    width: 100%;
    max-width: 460px;
    max-height: 250px;
    object-fit: contain;
}

@media (max-width: 760px) {
    .ccpc-logo-art {
        min-height: 220px;
        padding: 20px;
    }
}


/* Enterprise AI — CCPC and Intelligent Home layout refinement */
.ccpc-showcase {
    display: grid;
    align-items: stretch;
}
.ccpc-brand-card {
    display: flex;
    flex-direction: column;
}
.ccpc-brand-card .ccpc-logo-art {
    width: 100%;
    min-height: 250px;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 22px;
}
.ccpc-brand-card .ccpc-logo-art img {
    width: 100%;
    height: 100%;
    max-height: 260px;
    object-fit: contain;
    object-position: center;
}
.ccpc-brand-copy h3 { margin: 14px 0 10px; }
.ccpc-brand-copy p { margin-bottom: 0; }
.ccpc-content { display: grid; }
.ccpc-intro {
    display: grid;
    align-items: stretch;
}
.ccpc-intro > div:first-child {
    border-radius: 20px;
}
.ccpc-intro > div:first-child h3 { margin-top: 0; }
.ccpc-section .privacy-panel { height: 100%; margin: 0; }
.ccpc-section .ccpc-modes { margin-top: 0; }
.ccpc-section .compact-card .eyebrow { margin-bottom: 8px; }

.intelligent-home-visual {
    align-items: center;
    justify-content: center;
}

@media (max-width: 980px) {
    .ccpc-showcase, .ccpc-intro { grid-template-columns: 1fr; }
    .ccpc-brand-card .ccpc-logo-art { min-height: 210px; }
}
@media (max-width: 640px) {
    .ccpc-brand-card .ccpc-logo-art { min-height: 180px; }
}


/* Enterprise AI page — final dark refinement */
#ontario-ccpc,
#ai-intelligent-home {
    padding-top: 68px;
    padding-bottom: 68px;
}

#ontario-ccpc .section-head,
#ai-intelligent-home .section-head {
    max-width: 980px;
    margin-bottom: 26px;
}

.ccpc-showcase {
    grid-template-columns: minmax(300px, .82fr) minmax(0, 1.38fr);
    gap: 28px;
    margin-top: 22px;
}

.ccpc-brand-card {
    border: 1px solid #244a66;
    background: radial-gradient(420px 260px at 50% 14%, rgba(50,212,199,.10), transparent 70%), linear-gradient(180deg,#081a2a,#06131f);
    color: var(--text);
    padding: 24px;
    border-radius: 22px;
    justify-content: flex-start;
    gap: 18px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

.ccpc-brand-card .ccpc-logo-art,
.ccpc-logo-art {
    width: 100%;
    min-height: 210px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 16px;
    background: transparent;
    overflow: hidden;
}

.ccpc-brand-card .ccpc-logo-art img,
.ccpc-logo-art img {
    width: 100%;
    height: auto;
    max-width: 360px;
    max-height: 210px;
    object-fit: contain;
    object-position: center;
    display: block;
    background: transparent;
}

.ccpc-brand-copy {
    border-top: 1px solid rgba(99,183,255,.16);
    padding-top: 18px;
}

.ccpc-brand-copy h3 {
    color: #fff;
    font-size: 20px;
    line-height: 1.25;
}

.ccpc-brand-copy p {
    color: var(--muted);
}

.ccpc-content {
    gap: 18px;
}

.ccpc-intro {
    grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
    gap: 18px;
}

.ccpc-intro > div:first-child {
    border: 1px solid #244a66;
    background: linear-gradient(180deg,#0b2034,#091827);
    padding: 22px;
}

.ccpc-section .privacy-panel {
    border-color: #2a5876;
    background: linear-gradient(180deg,#0b2238,#081a2a);
    padding: 22px;
}

.ccpc-section .compact-card {
    background: linear-gradient(180deg,#0a1d30,#081725);
    border-color: #234861;
    padding: 20px;
}

.ccpc-process {
    margin-top: 24px;
}

.ccpc-process .flow .step {
    min-height: 82px;
    padding: 13px 10px;
}

.ccpc-note {
    margin-top: 14px;
}

.intelligent-home-layout {
    align-items: stretch;
}

.intelligent-home-visual {
    border-radius: 22px;
}

.intelligent-home-visual picture {
    width: 100%;
    height: 100%;
    min-height: 390px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.intelligent-home-visual img {
    width: 100%;
    height: 100%;
    max-height: 540px;
    object-fit: contain;
    object-position: center;
    padding: 0;
    background: transparent;
    border-radius: 14px;
    display: block;
}

#ai-intelligent-home .grid3 {
    gap: 14px;
}

#ai-intelligent-home .grid3 .card {
    padding: 18px;
}

#ai-intelligent-home .home-flow {
    margin-top: 20px;
}

@media (max-width: 980px) {
    .ccpc-showcase,
    .ccpc-intro,
    .ccpc-modes,
    .intelligent-home-layout {
        grid-template-columns: 1fr;
    }

    .ccpc-brand-card .ccpc-logo-art,
    .ccpc-logo-art {
        min-height: 180px;
    }

    .intelligent-home-visual picture {
        min-height: 300px;
    }
}

@media (max-width: 640px) {
    #ontario-ccpc,
    #ai-intelligent-home {
        padding-top: 52px;
        padding-bottom: 52px;
    }

    .ccpc-brand-card {
        padding: 18px;
    }

    .ccpc-brand-card .ccpc-logo-art,
    .ccpc-logo-art {
        min-height: 150px;
    }

    .ccpc-brand-card .ccpc-logo-art img,
    .ccpc-logo-art img {
        max-height: 160px;
    }

    .intelligent-home-visual {
        padding: 8px;
    }

    .intelligent-home-visual picture {
        min-height: 220px;
    }
}


/* z/OS Agent Elephant page refinement — 2026-08-29 */

.agent-page .section-head h2,
.agent-page .split h2 {
    margin-bottom: 12px;
}

.agent-page .grid3,
.agent-page .grid2 {
    gap: 18px;
}

.agent-page .card {
    padding: 22px;
}

.agent-page .tag-row {
    margin: 14px 0 0;
}

.agent-page .flow {
    gap: 8px;
}

.agent-page .flow .step {
    min-height: 82px;
    padding: 13px 11px;
}

.agent-architecture-visual {
    border: 1px solid var(--line);
    border-radius: 24px;
    background: linear-gradient(180deg, #081a2a, #09131e);
    padding: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    overflow: hidden;
}

.agent-architecture-visual picture {
    width: 100%;
    height: 100%;
    min-height: 330px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.agent-architecture-visual img {
    width: 100%;
    height: 100%;
    max-height: 480px;
    object-fit: contain;
    object-position: center;
    display: block;
}

.agent-page .evidence-note,
.agent-page .safety-boundary {
    margin-top: 16px;
}

.agent-page .flow8 {
    grid-template-columns: repeat(8, 1fr);
}

.agent-page .agent-close {
    padding-top: 48px;
    padding-bottom: 54px;
}

.agent-page .agent-close .lede {
    max-width: 980px;
}

@media (max-width: 1050px) {
    .agent-page .flow8 {
        grid-template-columns: repeat(4, 1fr);
    }

    .agent-page .flow8 .step:nth-child(4)::after {
        display: none;
    }
}

@media (max-width: 760px) {

    .agent-page .split {
        gap: 28px;
    }

    .agent-page .flow8 {
        grid-template-columns: 1fr 1fr;
    }

    .agent-page .flow8 .step::after {
        display: none;
    }

    .agent-architecture-visual {
        min-height: 260px;
        padding: 10px;
    }

    .agent-architecture-visual picture {
        min-height: 240px;
    }
}


/* z/OS Agent Elephant copy and architecture refinement — 2026-08-30 */
.agent-page .page-hero {
    padding-top: 52px;
    padding-bottom: 56px;
}
.agent-page .section {
    padding-top: 54px;
    padding-bottom: 54px;
}
.agent-page .section-head {
    margin-bottom: 22px;
}
.agent-page .section-head p {
    max-width: 980px;
}
.agent-page .split {
    gap: 38px;
}
.agent-page .card p:last-child {
    margin-bottom: 0;
}
.agent-page .experience-flow {
    grid-template-columns: repeat(4, 1fr);
}
.agent-page .agent-architecture-visual picture {
    min-height: 300px;
}
.agent-page .agent-architecture-visual img {
    max-height: 440px;
}
.agent-page .table-wrap td,
.agent-page .table-wrap th {
    vertical-align: top;
}
.agent-page .section[data-section*="Knowledge Service"],
.agent-page .section[data-section*="Knowledge vs Experience"],
.agent-page .section[data-section*="Experience Maturity"],
.agent-page .section[data-section*="Trust Boundaries"] {
    padding-top: 48px;
    padding-bottom: 48px;
}
.agent-page .section[data-section*="Privacy Summary"] {
    padding-top: 44px;
    padding-bottom: 46px;
}
@media (max-width: 760px) {
    .agent-page .page-hero,
    .agent-page .section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .agent-page .experience-flow {
        grid-template-columns: 1fr 1fr;
    }
    .agent-page .agent-architecture-visual {
        min-height: 240px;
    }
    .agent-page .agent-architecture-visual picture {
        min-height: 220px;
    }
}


/* Technical Portfolio refinement — 2026-08-30 */
.portfolio-page .page-hero {
    padding-top: 54px;
    padding-bottom: 58px;
}

.portfolio-page .section {
    padding-top: 56px;
    padding-bottom: 56px;
}

.portfolio-page .section-head {
    margin-bottom: 24px;
}

.portfolio-page .portfolio-logo-wall {
    display: grid;
    margin: 8px 0 10px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(180deg, #081a2a, #09131e);
}

.portfolio-page .portfolio-logo-item {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border: 1px solid rgba(100, 155, 190, .18);
    border-radius: 14px;
    background: rgba(255, 255, 255, .96);
    overflow: hidden;
}

.portfolio-page .portfolio-logo-item img {
    width: 100%;
    height: 58px;
    object-fit: contain;
    object-position: center;
    display: block;
}

.portfolio-page .portfolio-logo-note {
    margin: 0 0 24px;
    color: #7894a6;
    font-size: 11px;
    line-height: 1.45;
}

.portfolio-page .portfolio-era-flow {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.portfolio-page .portfolio-era-flow .step {
    min-height: 168px;
}

.portfolio-page .portfolio-era-flow .step strong {
    font-size: 15px;
    color: var(--teal2);
}

.portfolio-page .portfolio-era-flow .step span {
    display: block;
    color: #b8cbd6;
    line-height: 1.5;
}

.portfolio-page .legacy-block h2 {
    margin-top: 6px;
    margin-bottom: 10px;
}

.portfolio-page .legacy-block .muted {
    line-height: 1.58;
}

.portfolio-page .section[data-section*="Portfolio 03"],
.portfolio-page .section[data-section*="Portfolio 04"],
.portfolio-page .section[data-section*="Portfolio 05"] {
    padding-top: 48px;
    padding-bottom: 48px;
}

@media (max-width: 1180px) {
    .portfolio-page .portfolio-logo-wall {
        grid-template-columns: repeat(5, minmax(90px, 1fr));
    }

    .portfolio-page .portfolio-era-flow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .portfolio-page .page-hero,
    .portfolio-page .section {
        padding-top: 42px;
        padding-bottom: 42px;
    }

    .portfolio-page .portfolio-logo-wall {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        padding: 10px;
        gap: 8px;
    }

    .portfolio-page .portfolio-logo-item {
        min-height: 70px;
        padding: 8px;
    }

    .portfolio-page .portfolio-logo-item img {
        height: 48px;
    }

    .portfolio-page .portfolio-era-flow {
        grid-template-columns: 1fr;
    }

    .portfolio-page .portfolio-era-flow .step {
        min-height: auto;
    }
}


/* Sitewide content and asset indexing refinement — 2026-08-30 */
main h1.fit-two-lines,
main h2.fit-two-lines {
    text-wrap: balance;
    overflow-wrap: normal;
}

/* Visual IDs are deliberately outside the image/placeholder so images can be replaced without touching the identifier. */
.asset-index-wrap {
    display: block;
    width: 100%;
    min-width: 0;
}
.asset-id-label {
    width: 100%;
    margin-top: 3px;
    text-align: right;
    font-size: 8px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .13em;
    color: rgba(163, 188, 204, .58);
    pointer-events: none;
    user-select: none;
}
.asset-index-wrap > .image-slot,
.asset-index-wrap > .product-art,
.asset-index-wrap > picture,
.asset-index-wrap > figure {
    margin-bottom: 0 !important;
}

/* Header brand mark is intentionally outside the asset-indexing system. */
.brand img {
    margin-bottom: 0;
}

/* Portfolio logo wall: a composed constellation rather than a rigid corporate grid. */
.portfolio-page .portfolio-logo-item {
    min-height: 78px;
    transform-origin: 50% 50%;
    transition: transform .18s ease, border-color .18s ease;
}
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(3n) .portfolio-logo-item { min-height: 92px; }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(4n) .portfolio-logo-item { min-height: 70px; }
.portfolio-page .portfolio-logo-placeholder {
    background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
    border-style: dashed;
    color: #7894a6;
}
.portfolio-page .portfolio-logo-placeholder-text {
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

@media (max-width: 900px) {
    .portfolio-page .portfolio-logo-wall {
        grid-template-columns: repeat(3, minmax(100px, 1fr));
    }
}
@media (max-width: 600px) {
    .portfolio-page .portfolio-logo-wall {
        grid-template-columns: repeat(2, minmax(100px, 1fr));
        gap: 14px;
    }
    .portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item {
        transform: none;
        min-height: 76px;
    }
    .asset-id-label {
        font-size: 7px;
    }
}

/* Preserve original image sizing rules after asset-ID wrappers were introduced. */
.asset-index-wrap > picture {
    display: block;
    width: 100%;
}
.asset-index-wrap > picture > img {
    display: block;
    width: 100%;
}
.card > .asset-index-wrap > picture,
.media-card > .asset-index-wrap > picture {
    overflow: hidden;
    border-radius: 12px;
    background: #071827;
}
.card > .asset-index-wrap > picture {
    height: 132px;
}
.card > .asset-index-wrap > picture img,
.media-card > .asset-index-wrap > picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.media-card > .asset-index-wrap > picture { height: 165px; }
.solutions .media-card > .asset-index-wrap > picture { height: 170px; }
.cases .media-card > .asset-index-wrap > picture { height: 145px; }
.lineage .card > .asset-index-wrap > picture img {
    object-fit: contain;
    padding: 4px;
}
.lineage .card:nth-child(2) > .asset-index-wrap > picture,
.lineage .card:nth-child(3) > .asset-index-wrap > picture { height: 126px; }
.lineage .card:nth-child(2) > .asset-index-wrap > picture img,
.lineage .card:nth-child(3) > .asset-index-wrap > picture img {
    object-fit: cover;
    object-position: center;
    padding: 0;
    transform: scale(1.09);
}
.lineage .card:nth-child(5) > .asset-index-wrap > picture img,
#help .card:nth-child(2) > .asset-index-wrap > picture img,
.solutions .media-card:nth-child(2) > .asset-index-wrap > picture img {
    object-fit: cover;
    object-position: center;
    padding: 0;
}
@media (max-width: 760px) {
    .card > .asset-index-wrap > picture,
    .media-card > .asset-index-wrap > picture,
    .solutions .media-card > .asset-index-wrap > picture,
    .cases .media-card > .asset-index-wrap > picture { height: 190px; }
    .lineage .card > .asset-index-wrap > picture { height: 150px; }
}


/* Image refinement pass — 2026-09-05 */
/* 206: CCPC artwork fills its panel without oversized side breathing room. */
.ccpc-onepage-grid { display:grid; grid-template-columns:minmax(255px,.72fr) minmax(0,1.55fr); gap:20px; align-items:stretch; }
.ccpc-brand-card.compact { padding:18px; gap:12px; }
.ccpc-brand-card.compact .ccpc-brand-copy { padding-top:12px; }

/* 207: remove surrounding empty panel space and let the image fill the visual. */

/* 302: architecture image uses the full column width with minimal framing. */
.agent-page .agent-architecture-visual { min-height:0; padding:0; overflow:hidden; border-radius:18px; }
.agent-page .agent-architecture-visual .asset-index-wrap[data-asset-id="302"] { width:100%; }
.agent-page .agent-architecture-visual picture[data-asset-id="302"] { display:block; }

/* 401–410: compact ten-logo constellation, roughly half the previous height. */
.portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item { min-height:40px !important; height:40px; padding:4px 5px; border-radius:9px; }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item img { width:100%; height:28px; object-fit:contain; object-position:center; }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(5n+1) .portfolio-logo-item { transform:translateY(2px) rotate(-.7deg); }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(5n+2) .portfolio-logo-item { transform:translateY(-2px) rotate(.5deg); }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(5n+3) .portfolio-logo-item { transform:translateY(1px) rotate(-.35deg); }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(5n+4) .portfolio-logo-item { transform:translateY(-1px) rotate(.65deg); }
.portfolio-page .portfolio-logo-wall > .asset-index-wrap:nth-child(5n+5) .portfolio-logo-item { transform:translateY(2px) rotate(-.4deg); }
.portfolio-page .portfolio-logo-wall .asset-id-label { margin-top:1px; font-size:7px; }

/* 414: show the entire technology composite rather than cropping it. */

/* 502: give the architecture image enough vertical room and center the building as the subject. */

/* Prefix-rematched direct image slots. */
.asset-index-wrap[data-asset-id="109"] .image-slot img,
.asset-index-wrap[data-asset-id="411"] .image-slot img,
.asset-index-wrap[data-asset-id="412"] .image-slot img,
.asset-index-wrap[data-asset-id="415"] .image-slot img,
.asset-index-wrap[data-asset-id="504"] .image-slot img,
.asset-index-wrap[data-asset-id="601"] .image-slot img,
.asset-index-wrap[data-asset-id="606"] .image-slot img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.asset-index-wrap[data-asset-id="601"] .image-slot { padding:0; overflow:hidden; }

@media (max-width:1000px) {
  .portfolio-page .portfolio-logo-wall { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .ccpc-onepage-grid { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .portfolio-page .portfolio-logo-wall { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item { transform:none !important; height:44px; min-height:44px !important; }
  .ccpc-brand-card.compact picture[data-asset-id="206"] { height:145px; }
}


/* Visual replacement refinement — 2026-09-05 */
.intelligent-home-visual picture[data-asset-id="207"] {
  background:#062f6a;
}

/* 414: use the full generated integration artwork with no internal crop. */

/* 415: crop from a higher focal point, approximately one-third upward. */
.portfolio-page .asset-index-wrap[data-asset-id="415"] .image-slot {
  height:210px;
  padding:0;
  overflow:hidden;
  background:#071827;
}
.portfolio-page .asset-index-wrap[data-asset-id="415"] .image-slot img {
  display:block;
}

/* 502: dedicated building crop; tallest spire meets the upper edge. */
.asset-index-wrap[data-asset-id="502"] .image-slot {
  min-height:0;
}

/* 503 / 504: generated artwork shown at its native composition ratio. */
.asset-index-wrap[data-asset-id="504"] .image-slot {
  min-height:0;
}

/* 606: keep the complete RPG / modernization composition visible. */
.asset-index-wrap[data-asset-id="606"] .image-slot {
  height:auto;
  min-height:0;
  aspect-ratio:496 / 392;
  padding:0;
  overflow:hidden;
  background:#071827;
}
.asset-index-wrap[data-asset-id="606"] .image-slot img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

@media (max-width:620px) {
  .intelligent-home-visual picture[data-asset-id="207"] { min-height:0; }
  .asset-index-wrap[data-asset-id="502"] .image-slot { height:auto; }
  .portfolio-page .asset-index-wrap[data-asset-id="415"] .image-slot { height:180px; }
}


/* Visual correction pass — 2026-09-05 */
/* 207: preserve the entire brand artwork; never crop top or bottom. */
.intelligent-home-visual .asset-index-wrap[data-asset-id="207"] {
  background:#062f6a;
}

/* 414: compact supporting visual so the card reads image + text as one unit. */
.portfolio-page .asset-index-wrap[data-asset-id="414"] .image-slot {
  width:100%;
  border-radius:16px;
}

/* 502: lower third removed from source image; stretch remaining building crop across the slot. */
.asset-index-wrap[data-asset-id="502"] {
  width:100%;
}
.asset-index-wrap[data-asset-id="502"] .image-slot {
  width:100%;
  height:250px !important;
  aspect-ratio:auto !important;
  padding:0;
  overflow:hidden;
  background:#071827;
}
.asset-index-wrap[data-asset-id="502"] .image-slot img {
  width:100%;
  height:100%;
  object-fit:cover !important;
  object-position:center top !important;
  display:block;
}

/* 503: use Walter's gallery core-banking image and show the complete artwork. */

/* 504: reduce visual mass and let the recovery copy lead the section. */
.asset-index-wrap[data-asset-id="504"] {
  width:82%;
  justify-self:center;
  align-self:center;
  margin:0 auto;
}
.asset-index-wrap[data-asset-id="504"] .image-slot {
  width:100%;
  height:205px !important;
  aspect-ratio:auto !important;
  padding:5px !important;
  border-radius:16px;
  background:#071827;
  overflow:hidden;
}
.asset-index-wrap[data-asset-id="504"] .image-slot img {
  display:block;
}

@media (max-width:760px) {
  .portfolio-page .asset-index-wrap[data-asset-id="414"],
  .asset-index-wrap[data-asset-id="504"] { width:100%; }
  .portfolio-page .asset-index-wrap[data-asset-id="414"] .image-slot { height:165px !important; }
  .asset-index-wrap[data-asset-id="504"] .image-slot { height:190px !important; }
  .asset-index-wrap[data-asset-id="502"] .image-slot { height:210px !important; }
}

/* Visual correction pass — 2026-09-05 21:46 */
/* 207: force the complete brand artwork to remain visible, including top and bottom edges. */
.intelligent-home-visual {
  min-height:0 !important;
  height:auto !important;
  align-self:start !important;
  overflow:visible !important;
  padding:0 !important;
  display:block !important;
}
.intelligent-home-visual .asset-index-wrap[data-asset-id="207"] {
  width:100%;
  height:auto !important;
}
.intelligent-home-visual picture[data-asset-id="207"] {
  width:100%;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  overflow:visible !important;
  display:block !important;
}
.intelligent-home-visual picture[data-asset-id="207"] img {
  padding:0 !important;
}

/* 503: stretch to full available width, then crop vertical height to roughly one-third. */
.asset-index-wrap[data-asset-id="503"] {
  width:100%;
}
.asset-index-wrap[data-asset-id="503"] .image-slot {
  min-height:0 !important;
}
.asset-index-wrap[data-asset-id="503"] .image-slot img {
  max-width:none !important;
}
@media (max-width:760px) {
  .asset-index-wrap[data-asset-id="503"] .image-slot { height:110px !important; }
}


/* Visual correction pass — 2026-09-05 21:53 */
/* 206: screenshot-confirmed CCPC trademark artwork; preserve the entire logo with more top/bottom breathing room. */
.ccpc-brand-card.compact .asset-index-wrap[data-asset-id="206"] {
  overflow:visible !important;
  background:#071827;
  padding:16px 18px !important;
  border-radius:16px;
}
.ccpc-brand-card.compact picture[data-asset-id="206"] {
  width:100%;
  height:220px !important;
  min-height:220px !important;
  overflow:visible !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  background:#02070d;
  border-radius:14px;
}
.ccpc-brand-card.compact picture[data-asset-id="206"] img {
  width:92% !important;
  height:calc(100% - 34px) !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
  padding:0 !important;
  display:block;
}

/* 502: keep the building as the dominant image and use 502B-LDS in the right dark zone. */
.asset-index-wrap[data-asset-id="502"] .zcita-building-inset {
  position:absolute;
  right:2.5%;
  top:12%;
  width:27%;
  height:76%;
  object-fit:contain !important;
  object-position:center !important;
  padding:8px;
  border-radius:14px;
  background:rgba(2,7,13,.78);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 12px 28px rgba(0,0,0,.28);
  z-index:2;
}
@media (max-width:760px) {
  .ccpc-brand-card.compact picture[data-asset-id="206"] { height:190px !important; min-height:190px !important; }
  .ccpc-brand-card.compact picture[data-asset-id="206"] img { width:94% !important; height:calc(100% - 28px) !important; }
  .asset-index-wrap[data-asset-id="502"] .zcita-building-inset { width:31%; right:2%; top:14%; height:72%; padding:5px; }
}


/* 2026-09-05 final visual pass: 207 trims 1 cm top/bottom; 502 uses one full-bleed banner with no inset/black side zone. */
.intelligent-home-visual .asset-index-wrap[data-asset-id="207"],
.intelligent-home-visual picture[data-asset-id="207"] {
  height:auto !important; min-height:0 !important; overflow:visible !important; background:transparent !important;
}
.intelligent-home-visual picture[data-asset-id="207"] img { max-width:100% !important; max-height:none !important; transform:none !important; display:block !important;
}
.asset-index-wrap[data-asset-id="502"] .zcita-building-composite {
  position:relative !important;
}
.asset-index-wrap[data-asset-id="502"] .zcita-building-main {
  position:relative !important; inset:auto !important;
}
.asset-index-wrap[data-asset-id="502"] .zcita-building-inset { display:none !important; }
@media (max-width:760px){
  .asset-index-wrap[data-asset-id="502"] .zcita-building-composite { height:auto !important; }
}


/* 2026-09-05 gallery rematch + crop cleanup */
.asset-index-wrap[data-asset-id="108"] .image-slot,
.asset-index-wrap[data-asset-id="109"] .image-slot {
  height:190px !important; min-height:0 !important; padding:0 !important; overflow:hidden !important; background:#071827;
}
.asset-index-wrap[data-asset-id="108"] .image-slot > div,
.asset-index-wrap[data-asset-id="108"] .image-slot picture,
.asset-index-wrap[data-asset-id="109"] .image-slot picture { width:100% !important; height:100% !important; display:block !important; }
.asset-index-wrap[data-asset-id="108"] .image-slot img,
.asset-index-wrap[data-asset-id="109"] .image-slot img {
  width:100% !important; height:100% !important; max-height:none !important; object-fit:cover !important; object-position:center !important; display:block !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item {
  transform:none !important; overflow:visible !important; height:44px !important; min-height:44px !important; padding:3px 4px !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item img {
  width:100% !important; height:auto !important; max-height:36px !important; object-fit:contain !important; object-position:center !important; display:block !important;
}
.intelligent-home-visual picture[data-asset-id="207"] img { width:100% !important; height:auto !important; object-fit:contain !important; object-position:center !important; }
.portfolio-page .asset-index-wrap[data-asset-id="415"] .image-slot img { width:100% !important; height:100% !important; object-fit:cover !important; object-position:center top !important; }
.asset-index-wrap[data-asset-id="502"] .zcita-building-composite { width:100% !important; height:auto !important; min-height:0 !important; padding:0 !important; overflow:hidden !important; background:transparent !important; }
.asset-index-wrap[data-asset-id="502"] .zcita-building-main { width:100% !important; height:auto !important; max-width:none !important; object-fit:contain !important; object-position:center !important; display:block !important; }
.asset-index-wrap[data-asset-id="504"] .image-slot img { width:100% !important; height:100% !important; object-fit:contain !important; object-position:center !important; }
@media (max-width:760px) {
  .asset-index-wrap[data-asset-id="108"] .image-slot,
  .asset-index-wrap[data-asset-id="109"] .image-slot { height:145px !important; }
  .portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item { height:42px !important; min-height:42px !important; }
  .portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item img { max-height:34px !important; }
}


/* Local maintenance, phase 1 — 2026-09-06. Layout only. */
/* Keep the established palette, navigation, artwork and asset identifiers. */
main { overflow: visible; }
main :is(.split, .flag-grid, .final-grid, .hero-grid, .flow) > * { min-width: 0; }
main :is(h1, h2, h3, .btn, .tag, .proof, .step, .contact-details) { overflow-wrap: anywhere; }
main h1.fit-two-lines, main h2.fit-two-lines { overflow-wrap: anywhere; text-wrap: balance; }
main h2 { font-size: clamp(26px, 2.7vw, 40px); line-height: 1.18; letter-spacing: -.025em; }
main h3 { line-height: 1.3; }
.page-hero h1 { font-size: clamp(32px, 4vw, 54px); line-height: 1.13; }
.section-head h2, .split h2, .final h2 { font-size: clamp(26px, 2.7vw, 40px); line-height: 1.18; }
.section-head { max-width: 980px; }
.section-head p, .split p, .lede { line-height: 1.65; }
.btn { max-width: 100%; text-align: center; line-height: 1.4; }
.brand { flex-shrink: 0; }
.section, .page-hero, #contact { scroll-margin-top: 90px; }
.card > .asset-index-wrap { margin-bottom: 16px; }
.card p { line-height: 1.6; }
.card > .link { display: inline-block; margin-top: 4px; }
.media-card { grid-template-columns: minmax(145px, .8fr) minmax(0, 1fr); gap: 22px; }
.solutions .media-card, .cases .media-card { grid-template-columns: minmax(145px, .8fr) minmax(0, 1fr); }
.media-card > .asset-index-wrap { margin-bottom: 0; }
.flow { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.flow.flow6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.flow.flow4, .agent-page .flow8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.flow .step { min-width: 0; line-height: 1.6; }
.flow.flow6 .step::after, .agent-page .flow8 .step::after { display: none; }
.flow + .asset-index-wrap, .grid4 + .asset-index-wrap { margin-top: 26px; }

#home.hero { min-height: 0; padding: clamp(36px, 5vw, 68px) 0; }
#home .hero-grid { grid-template-columns: minmax(200px, .7fr) minmax(0, 2fr); gap: clamp(24px, 4vw, 52px); align-items: center; }
#home .hero-visual { width: 100%; max-width: 280px; height: auto; aspect-ratio: 2 / 3; margin: auto; }
#home .hero-visual img { object-fit: contain; transform: none; }
#home .hero-title { font-size: clamp(32px, 3.5vw, 48px); line-height: 1.14; }
#home .hero-copy { max-width: 75ch; font-size: 16px; line-height: 1.65; }
#home .hero-copy p { margin-bottom: 14px; }
#home .actions { margin-top: 22px; }
.flag-grid { grid-template-columns: minmax(230px, .7fr) minmax(0, 1.7fr); gap: clamp(28px, 4vw, 58px); }
.product-art { margin-inline: auto; }
.agent-page .page-hero .lede { font-size: 17px; line-height: 1.65; }
.intelligent-home-layout { grid-template-columns: minmax(0, 1.4fr) minmax(300px, 1fr); gap: 32px; }
.intelligent-home-layout .grid3 { grid-template-columns: 1fr; }
.intelligent-home-layout .home-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.intelligent-home-layout .home-flow .step::after { display: none; }
.ccpc-head-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: start; margin-bottom: 24px; }
.ccpc-head-row p { margin: 0; color: var(--muted); }
.ccpc-main-panel { display: grid; gap: 20px; align-content: start; min-width: 0; }
.ccpc-privacy-compact h3 { margin-top: 0; }
.ccpc-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ccpc-process-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.ccpc-process-strip span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.ccpc-boundary { margin: 0; line-height: 1.6; }
.legacy-block { grid-template-columns: minmax(210px, .65fr) minmax(0, 1.65fr); gap: 32px; }
.legacy-block .image-slot { height: 190px; }
.image-slot > img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }

@media (max-width: 1100px) {
  .nav { flex-wrap: wrap; gap: 12px; padding-block: 12px; }
  .menu { order: 3; width: 100%; justify-content: center; flex-wrap: wrap; white-space: normal; gap: 12px 20px; }
  .media-card, .solutions .media-card, .cases .media-card { grid-template-columns: 1fr; align-content: start; }
  .media-card > .asset-index-wrap { margin-bottom: 6px; }
  .split, .final-grid { gap: 32px; }
  .flag-grid { grid-template-columns: minmax(200px, .6fr) minmax(0, 1.4fr); gap: 30px; }
}
@media (max-width: 980px) {
  .intelligent-home-layout { grid-template-columns: 1fr; }
  .intelligent-home-visual { max-width: 620px; width: 100%; justify-self: center; }
  .flow, .flow.step7, .flow.flow6, .flow.flow4, .agent-page .flow8 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow .step::after { display: none; }
}
@media (max-width: 820px) {
  .nav { flex-wrap: nowrap; padding-block: 0; }
  .menu { width: auto; top: calc(100% + 6px); max-height: calc(100svh - 90px); overflow-y: auto; gap: 4px; }
  .menu a { padding: 10px 8px; }
  #home .hero-grid, .flag-grid, .ccpc-head-row { grid-template-columns: minmax(0, 1fr); }
  #home .hero-grid > .asset-index-wrap { width: min(220px, 70%); justify-self: center; }
  #home .hero-visual { max-width: 220px; }
  .flag-grid > .asset-index-wrap { max-width: 240px; justify-self: center; }
  .legacy-block { grid-template-columns: minmax(0, 1fr); }
  .legacy-block > .asset-index-wrap { max-width: 520px; justify-self: center; }
  .ccpc-head-row { gap: 12px; }
}
@media (max-width: 600px) {
  #home .hero-grid { gap: 26px; }
  #home .hero-copy { font-size: 16px; }
  .ccpc-modes, .flow, .flow.step7, .flow.flow6, .flow.flow4, .agent-page .flow8,
  .agent-page .experience-flow, .intelligent-home-layout .home-flow { grid-template-columns: minmax(0, 1fr); }
  .tag, .proof, .state { overflow-wrap: anywhere; }
  .section, #ontario-ccpc, #ai-intelligent-home { padding-block: 44px; }
  .nav { gap: 10px; }
  .brand img { width: 110px; }
  .locale { padding: 6px 8px; }
  .contact-details > div { overflow-wrap: anywhere; }
}

/* V2.0 requested refinements — 2026-09-06 */
/* 1–2. Desktop home sections: fit the first two panels comfortably inside a common laptop viewport. */
@media (min-width: 961px) {

  #help {
    padding-top: 34px !important;
    padding-bottom: 38px !important;
  }
  #help .section-head {
    margin-bottom: 16px !important;
  }
  #help .section-head h2 {
    font-size: clamp(26px, 2.5vw, 36px) !important;
    margin: 5px 0 7px !important;
  }
  #help .section-head p {
    font-size: 13px !important;
    line-height: 1.35 !important;
  }
  #help .grid4 {
    gap: 12px !important;
  }
  #help .card {
    padding: 13px !important;
  }
  #help .card .asset-index-wrap > picture {
    display: block !important;
    width: 100% !important;
    height: 96px !important;
    overflow: hidden !important;
    border-radius: 11px !important;
    background: #071827 !important;
  }
  #help .card .asset-index-wrap > picture img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
  }
  #help .card .num {
    margin-top: 7px !important;
  }
  #help .card h3 {
    font-size: 16.5px !important;
    line-height: 1.12 !important;
    margin: 6px 0 6px !important;
  }
  #help .card p {
    font-size: 12.6px !important;
    line-height: 1.34 !important;
    margin-bottom: 9px !important;
  }
}

/* 3. Asset 207: remove the visible lower edge without altering the source image. */
.intelligent-home-visual {
  border-bottom: 0 !important;
}
.intelligent-home-visual .asset-index-wrap[data-asset-id="207"],
.intelligent-home-visual picture[data-asset-id="207"],
.intelligent-home-visual picture[data-asset-id="207"] img {
  border-bottom: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}

/* 5. Asset 402: extend the IBM gallery tile downward to twice its prior desktop height. */
@media (min-width: 761px) {
  .portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item {
    height: 88px !important;
    min-height: 88px !important;
    padding: 4px 5px !important;
    align-self: start !important;
  }
  .portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item img {
    width: 100% !important;
    height: 76px !important;
    max-height: 76px !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

/* 6. Asset 414: use the eight-source mosaic and make its visual depth match asset 415. */
.portfolio-page .asset-index-wrap[data-asset-id="414"] .image-slot {
  height: 210px !important;
  min-height: 210px !important;
  aspect-ratio: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #071827 !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="414"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  object-position: center !important;
  display: block !important;
}

/* 4. Asset 502: support the freshly reinserted gallery-style picture element. */
.asset-index-wrap[data-asset-id="502"] .zcita-building-composite > picture {
  display: block !important;
  min-height: 0 !important;
  margin: 0 !important;
}
.asset-index-wrap[data-asset-id="502"] .zcita-building-composite > picture > img {
  max-width: none !important;
}



/* V2.0 visual verification corrections — 2026-09-06 */
.intelligent-home-visual {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.intelligent-home-visual .asset-index-wrap[data-asset-id="207"] {
  border-radius: 22px !important;
  overflow: hidden !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="414"] .image-slot img {
  object-fit: cover !important;
}


/* V2.0 follow-up refinements — 2026-09-06 */
@media (min-width: 961px) {
  #home.hero {
    min-height: calc(100svh - 64px) !important;
    display: flex !important;
    align-items: center !important;
    padding-top: 40px !important;
    padding-bottom: 44px !important;
  }
  #home.hero > .wrap {
    width: min(1140px, calc(100% - 72px)) !important;
  }
  #home .hero-grid {
    grid-template-columns: 190px minmax(0, 900px) !important;
    gap: 42px !important;
    justify-content: center !important;
    align-items: center !important;
  }
  #home .hero-visual {
    width: 180px !important;
    height: 270px !important;
  }
  #home .kicker {
    font-size: 18px !important;
    margin: 4px 0 6px !important;
  }
  #home .hero-title {
    font-size: clamp(32px, 2.8vw, 46px) !important;
    line-height: 1.04 !important;
    margin: 5px 0 10px !important;
  }
  #home .hero-copy {
    max-width: 900px !important;
    font-size: 14px !important;
    line-height: 1.46 !important;
  }
  #home .hero-copy p {
    margin: 0 0 8px !important;
  }
  #home .actions {
    margin-top: 14px !important;
  }
  #home .btn {
    padding: 11px 16px !important;
    font-size: 13px !important;
  }
}

.ccpc-action { margin-top: 8px; }
.action-note {
  margin: 8px 0 0 !important;
  color: #7894a6 !important;
  font-size: 11.5px !important;
  line-height: 1.45 !important;
}

.portfolio-page .asset-index-wrap[data-asset-id="420"] .image-slot {
  height: 236px !important;
  min-height: 236px !important;
  margin-bottom: 14px !important;
  overflow: hidden !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="420"] .image-slot > img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
}

.locale.locale-flags {
  border-radius: 0 !important;
}
.locale-flags .locale-flag {
  width: 34px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #21455f;
  border-radius: 9px;
  background: #081827;
  font-size: 20px;
  line-height: 1;
}

.privacy-page .privacy-notice {
  max-width: 920px;
  margin: 18px 0 0;
  padding: 14px 16px;
  border: 1px solid #2a5876;
  border-radius: 14px;
  background: #0a1d30;
  color: #c9d8e2;
}
.privacy-page .privacy-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
  gap: 30px;
  align-items: start;
}
.privacy-page .section p { max-width: 900px; }
.privacy-page .checklist .link { font-size: inherit; }
@media (max-width: 820px) {
  .privacy-page .privacy-grid { grid-template-columns: 1fr; }
  .locale-flags .locale-flag { width: 31px; height: 28px; font-size: 18px; }
}


/* V2.0 follow-up — 2026-09-06 20:35 */
.locale.locale-flags {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.locale-flags .locale-flag-svg {
  width: 36px;
  height: 24px;
  display: block;
  border: 1px solid #31536b;
  border-radius: 3px;
  box-shadow: 0 1px 5px rgba(0,0,0,.22);
}

#ai-intelligent-home .home-flow {
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 12px !important;
}
#ai-intelligent-home .home-flow .step {
  min-width: 0;
}

.page-hero .hero-with-visual {
  display: grid;
  grid-template-columns: minmax(0,1.4fr) minmax(280px,.6fr);
  gap: 42px;
  align-items: center;
}
.page-hero .hero-side-visual {
  width: 100%;
  align-self: center;
}
.page-hero .hero-side-visual .image-slot {
  height: 280px;
  padding: 8px;
  overflow: hidden;
  background: #071827;
  border: 1px solid #244a66;
  border-radius: 20px;
}
.page-hero .hero-side-visual .image-slot img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  border-radius: 14px;
}

@media (max-width: 980px) {
  #ai-intelligent-home .home-flow {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .page-hero .hero-with-visual {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  #ai-intelligent-home .home-flow {
    grid-template-columns: 1fr !important;
  }
  .locale-flags .locale-flag-svg {
    width: 32px;
    height: 21px;
  }
  .page-hero .hero-side-visual .image-slot {
    height: 230px;
  }
}


/* V2.0 image fit corrections — 2026-09-06 20:55
   Match each image frame to the source aspect ratio so the complete image fills
   the frame without letterboxing or empty padding. */
.asset-index-wrap[data-asset-id="109"] .image-slot {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 624 / 351 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.asset-index-wrap[data-asset-id="109"] .image-slot picture,
.asset-index-wrap[data-asset-id="109"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  display: block !important;
}
.asset-index-wrap[data-asset-id="109"] .image-slot img {
  object-fit: cover !important;
  object-position: center !important;
}

.agent-page .agent-architecture-visual picture[data-asset-id="302"] {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1286 / 671 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.agent-page .agent-architecture-visual picture[data-asset-id="302"] img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

.portfolio-page .asset-index-wrap[data-asset-id="400"] .image-slot {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 565 / 534 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="400"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: inherit !important;
}

.zcita-page .asset-index-wrap[data-asset-id="500"] .image-slot {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 782 / 768 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.zcita-page .asset-index-wrap[data-asset-id="500"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: inherit !important;
}

.asset-index-wrap[data-asset-id="503"] .image-slot {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1536 / 412 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.asset-index-wrap[data-asset-id="503"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}


/* V2.0 hero images — 2026-09-06 21:15 */
.enterprise-ai-page .asset-index-wrap[data-asset-id="200"] .image-slot {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1501 / 986 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.enterprise-ai-page .asset-index-wrap[data-asset-id="200"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: inherit !important;
}

.modernization-page .asset-index-wrap[data-asset-id="600"] .image-slot {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.modernization-page .asset-index-wrap[data-asset-id="600"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: inherit !important;
}


/* V2.0 Enterprise AI — AI Intelligent Home one-screen desktop fit — 2026-09-06 */
@media (min-width: 1100px) {
  #ai-intelligent-home {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
  }

  #ai-intelligent-home > .wrap {
    width: min(var(--max), calc(100% - 56px)) !important;
  }

  #ai-intelligent-home .section-head {
    max-width: 1180px !important;
    margin-bottom: 12px !important;
  }

  #ai-intelligent-home .section-head .eyebrow {
    margin-bottom: 4px !important;
  }

  #ai-intelligent-home .section-head h2 {
    font-size: clamp(30px, 2.45vw, 40px) !important;
    line-height: 1.04 !important;
    margin: 4px 0 6px !important;
  }

  #ai-intelligent-home .section-head p {
    max-width: 1120px !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.38 !important;
  }

  #ai-intelligent-home .intelligent-home-layout {
    grid-template-columns: minmax(0, 1.38fr) minmax(420px, .92fr) !important;
    gap: 24px !important;
    align-items: start !important;
  }

  #ai-intelligent-home .intelligent-home-layout > div:first-child > h3 {
    font-size: 18px !important;
    line-height: 1.2 !important;
    margin: 0 0 8px !important;
  }

  #ai-intelligent-home .grid3 {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  #ai-intelligent-home .grid3 .card {
    padding: 11px 14px !important;
    border-radius: 16px !important;
  }

  #ai-intelligent-home .grid3 .card h3 {
    font-size: 17px !important;
    line-height: 1.16 !important;
    margin: 0 0 4px !important;
  }

  #ai-intelligent-home .grid3 .card p {
    font-size: 13px !important;
    line-height: 1.34 !important;
    margin: 0 !important;
  }

  #ai-intelligent-home .home-flow {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 10px !important;
  }

  #ai-intelligent-home .home-flow .step {
    min-height: 48px !important;
    padding: 8px 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    font-size: 11.5px !important;
    line-height: 1.2 !important;
  }

  #ai-intelligent-home .intelligent-home-visual {
    min-height: 0 !important;
    padding: 0 !important;
    align-self: start !important;
    border-radius: 18px !important;
  }

  #ai-intelligent-home .intelligent-home-visual .asset-index-wrap[data-asset-id="207"] {
    width: 100% !important;
    height: auto !important;
    border-radius: 18px !important;
    overflow: hidden !important;
  }

  #ai-intelligent-home .intelligent-home-visual picture[data-asset-id="207"] {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 7 / 4 !important;
    display: block !important;
    overflow: hidden !important;
  }

  #ai-intelligent-home .intelligent-home-visual picture[data-asset-id="207"] img {
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }
}


/* Asset 117 — show complete Ontario CCPC trademark without changing layout */
.cases .asset-index-wrap[data-asset-id="117"] > picture {
  padding: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}
.cases .asset-index-wrap[data-asset-id="117"] > picture > img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
  display: block !important;
}


/* Asset 502 — compress displayed height to ~50% while preserving full image content */
.asset-index-wrap[data-asset-id="502"] .zcita-building-composite > picture {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1860 / 422.5 !important;
  overflow: hidden !important;
}
.asset-index-wrap[data-asset-id="502"] .zcita-building-composite > picture > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
  object-position: center !important;
  display: block !important;
}


/* Image semantic + visual symmetry pass — 2026-09-07
   Scope: images only; visible copy and page structure unchanged. */

/* Home 104: operational/reliability card now uses a monitoring visual. */
#help .asset-index-wrap[data-asset-id="104"] > picture > img {
  object-fit: cover !important;
  object-position: center !important;
  transform: none !important;
}

/* Home foundation pair 108/109: make both image frames the same 16:9 footprint. */
#foundation .asset-index-wrap[data-asset-id="108"] .image-slot,
#foundation .asset-index-wrap[data-asset-id="109"] .image-slot {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #071827 !important;
}
#foundation .asset-index-wrap[data-asset-id="108"] .image-slot > div,
#foundation .asset-index-wrap[data-asset-id="108"] .image-slot picture,
#foundation .asset-index-wrap[data-asset-id="109"] .image-slot picture,
#foundation .asset-index-wrap[data-asset-id="108"] .image-slot img,
#foundation .asset-index-wrap[data-asset-id="109"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}
#foundation .asset-index-wrap[data-asset-id="108"] .image-slot img,
#foundation .asset-index-wrap[data-asset-id="109"] .image-slot img {
  object-fit: cover !important;
  object-position: center !important;
  max-height: none !important;
  transform: none !important;
}

/* Home technical-lineage row 112–116: equal image-box height and consistent full-image treatment. */
.lineage .card > .asset-index-wrap > picture {
  height: 118px !important;
  min-height: 118px !important;
  padding: 0 !important;
  background: #06131f !important;
  overflow: hidden !important;
}
.lineage .card > .asset-index-wrap > picture > img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  padding: 4px !important;
  transform: none !important;
  display: block !important;
}

/* Portfolio 414/415: retain the agreed 210px height but use equal visual width. */
.portfolio-page .asset-index-wrap[data-asset-id="414"] {
  width: 100% !important;
  margin: 0 0 12px !important;
}


/* Visual symmetry pass v2 — 2026-09-07
   Scope: image geometry only. No copy, links, page structure, or source-image changes. */

/* 1) Standardize right-side page Hero visuals: 200 / 400 / 500 / 600.
   Use one compact frame size to preserve the accepted desktop one-screen rhythm. */
@media (min-width: 981px) {
  .page-hero .hero-with-visual {
    grid-template-columns: minmax(0, 1fr) 340px !important;
    gap: 36px !important;
    align-items: center !important;
  }

  .page-hero .hero-side-visual {
    width: 340px !important;
    max-width: 340px !important;
    justify-self: end !important;
    align-self: center !important;
  }

  .page-hero .hero-side-visual .image-slot,
  .enterprise-ai-page .asset-index-wrap[data-asset-id="200"] .image-slot,
  .portfolio-page .asset-index-wrap[data-asset-id="400"] .image-slot,
  .zcita-page .asset-index-wrap[data-asset-id="500"] .image-slot,
  .modernization-page .asset-index-wrap[data-asset-id="600"] .image-slot {
    width: 100% !important;
    height: 272px !important;
    min-height: 272px !important;
    aspect-ratio: auto !important;
    padding: 6px !important;
    overflow: hidden !important;
    background: #06131f !important;
    border: 1px solid #244a66 !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18) !important;
  }

  .page-hero .hero-side-visual .image-slot img,
  .enterprise-ai-page .asset-index-wrap[data-asset-id="200"] .image-slot img,
  .portfolio-page .asset-index-wrap[data-asset-id="400"] .image-slot img,
  .zcita-page .asset-index-wrap[data-asset-id="500"] .image-slot img,
  .modernization-page .asset-index-wrap[data-asset-id="600"] .image-slot img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: 12px !important;
    transform: none !important;
    display: block !important;
  }
}

@media (max-width: 980px) {
  .page-hero .hero-side-visual {
    width: min(100%, 420px) !important;
    max-width: 420px !important;
    justify-self: center !important;
  }
  .page-hero .hero-side-visual .image-slot,
  .enterprise-ai-page .asset-index-wrap[data-asset-id="200"] .image-slot,
  .portfolio-page .asset-index-wrap[data-asset-id="400"] .image-slot,
  .zcita-page .asset-index-wrap[data-asset-id="500"] .image-slot,
  .modernization-page .asset-index-wrap[data-asset-id="600"] .image-slot {
    height: 240px !important;
    min-height: 240px !important;
    aspect-ratio: auto !important;
    padding: 6px !important;
    background: #06131f !important;
    border: 1px solid #244a66 !important;
    border-radius: 18px !important;
  }
  .page-hero .hero-side-visual .image-slot img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

/* 2) Portfolio logo wall: strict equal-size corporate grid.
   Remove constellation rotations, translations, and the IBM-only size override. */
.portfolio-page .portfolio-logo-wall {
  grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
  padding: 10px !important;
}

.portfolio-page .portfolio-logo-wall > .asset-index-wrap {
  min-width: 0 !important;
  align-self: stretch !important;
}

.portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item,
.portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item {
  width: 100% !important;
  height: 54px !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 7px 8px !important;
  display: grid !important;
  place-items: center !important;
  background: #071827 !important;
  border: 1px solid #244a66 !important;
  border-radius: 10px !important;
  transform: none !important;
  box-shadow: none !important;
}

.portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item img,
.portfolio-page .asset-index-wrap[data-asset-id="402"] .portfolio-logo-item img {
  width: 100% !important;
  height: 36px !important;
  max-width: 100% !important;
  max-height: 36px !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
  display: block !important;
}

@media (max-width: 1100px) {
  .portfolio-page .portfolio-logo-wall {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  .portfolio-page .portfolio-logo-wall {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .portfolio-page .portfolio-logo-wall > .asset-index-wrap .portfolio-logo-item {
    height: 56px !important;
    min-height: 56px !important;
  }
}

/* 3) Equal card-image heights inside the same functional groups. */
.enterprise-ai-page section[data-section="Enterprise AI 03 — Enterprise Systems AI"] .grid3 .image-slot,
.portfolio-page section[data-section="Portfolio 07 — Production Support"] .grid3 .image-slot,
.modernization-page section[data-section="Modernization 05 — Platform Paths"] .grid3 .image-slot {
  width: 100% !important;
  height: 158px !important;
  min-height: 158px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #06131f !important;
  border-radius: 14px !important;
}

.enterprise-ai-page section[data-section="Enterprise AI 03 — Enterprise Systems AI"] .grid3 .image-slot > div,
.enterprise-ai-page section[data-section="Enterprise AI 03 — Enterprise Systems AI"] .grid3 .image-slot picture,
.enterprise-ai-page section[data-section="Enterprise AI 03 — Enterprise Systems AI"] .grid3 .image-slot img,
.portfolio-page section[data-section="Portfolio 07 — Production Support"] .grid3 .image-slot img,
.modernization-page section[data-section="Modernization 05 — Platform Paths"] .grid3 .image-slot img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  display: block !important;
}

.enterprise-ai-page section[data-section="Enterprise AI 03 — Enterprise Systems AI"] .grid3 .image-slot img,
.portfolio-page section[data-section="Portfolio 07 — Production Support"] .grid3 .image-slot img,
.modernization-page section[data-section="Modernization 05 — Platform Paths"] .grid3 .image-slot img {
  object-fit: cover !important;
  object-position: center !important;
  transform: none !important;
}

/* Preserve already-approved Home compact card sizing; do not enlarge first-screen content. */
#help .card > .asset-index-wrap > picture {
  height: 96px !important;
  min-height: 96px !important;
}

/* Home two applied-AI case visuals: equal footprint without changing card geometry. */
.cases .media-card > .asset-index-wrap > picture,
.cases .media-card > .asset-index-wrap > .image-slot {
  height: 145px !important;
  min-height: 145px !important;
}

/* 4) Historical / archival visuals: same frame language, complete-image presentation.
   Portfolio legacy eras and Modernization historical cases use identical geometry. */
.portfolio-page .legacy-block > .asset-index-wrap .image-slot,
.modernization-page .legacy-block > .asset-index-wrap .image-slot {
  width: 100% !important;
  height: 190px !important;
  min-height: 190px !important;
  padding: 6px !important;
  overflow: hidden !important;
  background: #06131f !important;
  border: 1px solid #244a66 !important;
  border-radius: 16px !important;
}

.portfolio-page .legacy-block > .asset-index-wrap .image-slot img,
.modernization-page .legacy-block > .asset-index-wrap .image-slot img {
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
  display: block !important;
}

/* zCITA historical origin / recovery visuals use one matching archival frame.
   Keep asset 502's separately approved compressed architecture treatment untouched. */
.zcita-page .asset-index-wrap[data-asset-id="501"] .image-slot,
.zcita-page .asset-index-wrap[data-asset-id="504"] .image-slot {
  width: 100% !important;
  height: 210px !important;
  min-height: 210px !important;
  padding: 6px !important;
  overflow: hidden !important;
  background: #06131f !important;
  border: 1px solid #244a66 !important;
  border-radius: 16px !important;
}

.zcita-page .asset-index-wrap[data-asset-id="501"] .image-slot > div,
.zcita-page .asset-index-wrap[data-asset-id="501"] .image-slot picture,
.zcita-page .asset-index-wrap[data-asset-id="501"] .image-slot img,
.zcita-page .asset-index-wrap[data-asset-id="504"] .image-slot img {
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  display: block !important;
}

.zcita-page .asset-index-wrap[data-asset-id="501"] .image-slot img,
.zcita-page .asset-index-wrap[data-asset-id="504"] .image-slot img {
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

/* Portfolio 414 / 415 remain exactly matched in width and height. */
.portfolio-page .asset-index-wrap[data-asset-id="414"],
.portfolio-page .asset-index-wrap[data-asset-id="415"] {
  width: 100% !important;
}
.portfolio-page .asset-index-wrap[data-asset-id="414"] .image-slot,
.portfolio-page .asset-index-wrap[data-asset-id="415"] .image-slot {
  height: 210px !important;
  min-height: 210px !important;
  border-radius: 16px !important;
}

/* Keep the previously approved one-screen layouts compact. */
@media (min-width: 1100px) {
  #home.hero {
    min-height: calc(100svh - 64px) !important;
  }
  #ai-intelligent-home {
    min-height: calc(100svh - 74px) !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}


/* Publication cleanup + bilingual selector — 2026-09-07 */
.asset-id-label {
  display: none !important;
}
body.show-asset-ids .asset-id-label {
  display: block !important;
}

.locale.locale-flags {
  gap: 7px !important;
}
.locale-flags .locale-flag-svg {
  cursor: pointer !important;
  opacity: .72;
  transition: opacity .16s ease, transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  outline: none;
}
.locale-flags .locale-flag-svg:hover,
.locale-flags .locale-flag-svg:focus-visible {
  opacity: 1;
  transform: translateY(-1px);
  border-color: #5c829e !important;
  box-shadow: 0 0 0 2px rgba(72, 209, 200, .18), 0 3px 10px rgba(0,0,0,.28) !important;
}
.locale-flags .locale-flag-svg.is-active {
  opacity: 1;
  border-color: #41d5c8 !important;
  box-shadow: 0 0 0 2px rgba(65, 213, 200, .18), 0 3px 10px rgba(0,0,0,.25) !important;
}

html[lang="zh-CN"] body {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Noto Sans SC", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
html[lang="zh-CN"] h1,
html[lang="zh-CN"] h2,
html[lang="zh-CN"] h3,
html[lang="zh-CN"] .eyebrow,
html[lang="zh-CN"] .kicker,
html[lang="zh-CN"] .btn,
html[lang="zh-CN"] nav {
  letter-spacing: 0 !important;
}

/* Preserve the already-approved one-screen desktop layouts in both languages. */
@media (min-width: 1100px) {
  html[lang="zh-CN"] #home.hero {
    min-height: calc(100svh - 64px) !important;
  }
  html[lang="zh-CN"] #ai-intelligent-home {
    min-height: calc(100svh - 74px) !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}