/* CHANGHAI blue-silver refinement for How We Work. */
.ch-work {
    --red: #0b4f83;
    --ch-blue: #0b4f83;
    --ch-blue-dark: #062844;
    --ch-blue-black: #071b2a;
    --ch-blue-light: #3779a8;
    --ch-silver: #aebbc6;
    --ch-silver-soft: #edf1f4;
}

.ch-work__hero {
    background:
        linear-gradient(135deg, rgba(11, 79, 131, 0.2), transparent 42%),
        var(--ch-blue-black);
}

.ch-work__hero::after,
.ch-work__section--soft {
    background-image:
        linear-gradient(rgba(11, 79, 131, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(11, 79, 131, 0.025) 1px, transparent 1px);
    background-size: 36px 36px;
}

.ch-work__button {
    background: var(--ch-blue);
    border-color: var(--ch-blue);
}

.ch-work__button:hover,
.ch-work__button:focus-visible {
    background: var(--ch-blue-dark);
    border-color: var(--ch-blue-dark);
}

.ch-work__control-card {
    border-top: 3px solid var(--ch-blue);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.16);
}

.ch-work__control-head i,
.ch-work__control-card b i {
    background: var(--ch-blue);
}

.ch-work__promise,
.ch-work__steps,
.ch-work__report-grid,
.ch-work__change-flow > div,
.ch-work__deliverables-grid ul {
    border-color: rgba(174, 187, 198, 0.68);
}

.ch-work__promise > div,
.ch-work__steps li,
.ch-work__change-flow > div,
.ch-work__deliverables-grid li {
    border-color: rgba(174, 187, 198, 0.68);
}

/* Red is reserved for risk and escalation only. */
.ch-work__steps li:nth-child(5) > span,
.ch-work__report-grid article:last-child > span,
.ch-work__risk-grid .ch-work__eyebrow,
.ch-work__risk-card > span {
    color: #b64949 !important;
}

.ch-work__risk-card {
    border-top-color: #b64949;
}

.ch-work__section--dark {
    background:
        linear-gradient(120deg, rgba(11, 79, 131, 0.22), transparent 38%),
        var(--ch-blue-black);
}

.ch-work__report-grid article {
    border-color: rgba(174, 187, 198, 0.22);
}

.ch-work__change-flow > i {
    color: var(--ch-blue);
}

.ch-work__cta {
    background:
        linear-gradient(118deg, #062844 0%, #0a3858 58%, #071b2a 100%);
    border-top: 1px solid rgba(174, 187, 198, 0.25);
}

.ch-work__cta .ch-work__eyebrow {
    color: #b8d4e8 !important;
}

.ch-work__button--light {
    color: var(--ch-blue-dark) !important;
    background: #fff;
    border-color: rgba(255, 255, 255, 0.82);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
}

.ch-work__button--light:hover,
.ch-work__button--light:focus-visible {
    color: #fff !important;
    background: var(--ch-blue);
    border-color: var(--ch-blue);
}

@media (max-width: 640px) {
    .ch-work h1 {
        max-width: 100%;
        overflow-wrap: normal;
        word-break: normal;
    }

    .ch-work__control-card {
        width: 100%;
        min-width: 0;
        padding: 24px;
    }

    .ch-work__steps li {
        min-height: 0;
        padding: 30px 26px;
    }

    .ch-work__steps h3 {
        margin-top: 42px;
    }

    .ch-work__button {
        min-height: 52px;
        width: 100%;
    }
}