.crm-pipeline {margin: 0 0 72px; padding-bottom: 48px; border-bottom: 1px solid #29343e; color: #fff; letter-spacing: 0;}
.crm-pipeline > h2 {margin: 0 0 36px; font-size: 32px; line-height: 1.2; font-weight: 800; letter-spacing: 0; text-wrap: balance;}
.crm-pipeline-stages {position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; list-style: none; margin: 0; padding: 0; isolation: isolate;}
.crm-pipeline-stage {position: relative; display: grid; grid-template-rows: 48px 116px 116px; gap: 16px; min-width: 0;}
.crm-pipeline-stage:not(:last-child)::before {content: ''; position: absolute; top: 23px; left: 24px; width: calc(100% + 16px); height: 2px; background: #43515f; pointer-events: none;}
.crm-pipeline-stages::after {content: ''; position: absolute; top: 23px; left: 24px; width: var(--crm-rail-distance, 0px); height: 3px; background: #7cbfff; transform: scaleX(var(--crm-progress, 0)); transform-origin: left; pointer-events: none;}
.crm-stage-marker {position: relative; z-index: 1; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #63788c; border-radius: 50%; background: #0b1117; color: #c1ceda; font-size: 22px; transition: border-color .18s ease, background-color .18s ease, color .18s ease;}
.crm-stage-check {display: none;}
.crm-stage-number {display: block; margin-bottom: 8px; color: #9aaebf; font-size: 11px; line-height: 1; font-variant-numeric: tabular-nums;}
.crm-stage-copy {min-width: 0;}
.crm-stage-copy h3 {margin: 0 0 8px; color: #eef2f7; font-size: 18px; line-height: 1.3; font-weight: 600; letter-spacing: 0; text-wrap: balance;}
.crm-stage-copy p {margin: 0; color: #b9c7d4; font-size: 14px; line-height: 1.5;}
.crm-stage-slot {position: relative; min-width: 0; height: 116px;}
.crm-opportunity {position: absolute; z-index: 3; inset: 0 auto auto 0; display: flex; align-items: center; gap: 10px; width: 100%; height: 116px; padding: 12px; border: 1px solid #86c8ff; border-radius: 8px; background: #101b27; color: #fff; box-shadow: 0 12px 24px rgba(0,0,0,.3); pointer-events: none;}
.crm-opportunity-icon {flex: 0 0 30px; font-size: 28px; color: #92caff;}
.crm-opportunity > div {min-width: 0;}
.crm-opportunity strong {display: block; margin-bottom: 6px; font-size: 16px; line-height: 1.25; font-weight: 700;}
.crm-opportunity-status {display: block; color: #bbd5ed; font-size: 12px; line-height: 1.5;}
.crm-pipeline-stage.is-current .crm-stage-marker {background: #142d46; border-color: #89caff; color: #fff; box-shadow: 0 0 0 4px rgba(124,191,255,.12);}
.crm-pipeline-stage.is-current .crm-stage-number {color: #9dd5ff;}
.crm-pipeline-stage.is-complete .crm-stage-icon,
.crm-pipeline-stage:last-child.is-current .crm-stage-icon {display: none;}
.crm-pipeline-stage.is-complete .crm-stage-check,
.crm-pipeline-stage:last-child.is-current .crm-stage-check {display: inline;}
.crm-pipeline-stage.is-complete .crm-stage-marker {color: #9ec3ff; border-color: #699cda;}
.crm-pipeline-stage:last-child .crm-stage-marker {color: #8ce0bf; border-color: #4a8d74;}
.crm-pipeline-stage:last-child.is-current .crm-stage-marker {background: #0f3025; border-color: #7ce6ba; box-shadow: 0 0 0 4px rgba(124,230,186,.12);}
.crm-pipeline[data-pipeline-phase="4"] .crm-opportunity {background: #10291f; border-color: #7ce6ba;}
.crm-pipeline[data-pipeline-phase="4"] .crm-opportunity-icon,
.crm-pipeline[data-pipeline-phase="4"] .crm-opportunity-status {color: #a3ebcd;}
@media (max-width: 1199px) {
    .crm-pipeline {max-width: 620px; margin-left: auto; margin-right: auto;}
    .crm-pipeline > h2 {font-size: 30px;}
    .crm-pipeline-stages {grid-template-columns: minmax(0, 1fr); gap: 28px;}
    .crm-pipeline-stage {grid-template-columns: 48px minmax(0, 1fr); grid-template-rows: minmax(88px, auto) 96px; column-gap: 18px; row-gap: 12px;}
    .crm-stage-marker {grid-column: 1; grid-row: 1;}
    .crm-stage-copy {grid-column: 2; grid-row: 1;}
    .crm-stage-slot {grid-column: 2; grid-row: 2;}
    .crm-stage-slot, .crm-opportunity {height: 96px;}
    .crm-pipeline-stage:not(:last-child)::before {top: 24px; left: 23px; width: 2px; height: calc(100% + 28px);}
    .crm-pipeline-stages::after {top: 24px; left: 23px; width: 3px; height: var(--crm-rail-distance, 0px); transform: scaleY(var(--crm-progress, 0)); transform-origin: top;}
    .crm-stage-copy h3 {font-size: 20px;}
    .crm-stage-copy p {max-width: 420px; font-size: 15px;}
}
@media (max-width: 575px) {
    .crm-pipeline {padding-bottom: 36px; margin-bottom: 44px;}
    .crm-pipeline > h2 {font-size: 28px; margin-bottom: 28px;}
    .crm-pipeline-stage {grid-template-columns: 40px minmax(0, 1fr); column-gap: 14px;}
    .crm-pipeline-stage {grid-template-rows: minmax(88px, auto) 88px;}
    .crm-stage-slot, .crm-opportunity {height: 88px;}
    .crm-stage-marker {width: 40px; height: 40px; font-size: 19px;}
    .crm-stage-copy h3 {font-size: 18px;}
    .crm-stage-copy p {font-size: 14px;}
    .crm-pipeline-stage:not(:last-child)::before,
    .crm-pipeline-stages::after {left: 19px; top: 20px;}
}
@media (prefers-reduced-motion: reduce) {
    .crm-stage-marker {transition: none;}
}