.progress{container-name:progress;container-type:inline-size;--progress-step-icon-width:40px}.progress-steps{display:flex;flex-direction:column;gap:var(--space-size-xs) var(--grid-gutter);margin-top:var(--space-size-2xl)}@container progress (min-width: 960px){.progress-steps{flex-direction:row}}.progress-step{display:grid;flex:1;gap:var(--space-size-xs);grid-template:"icon title" auto "separator description" 1fr/auto 1fr}@container progress (min-width: 960px){.progress-step{grid-template:"icon separator" auto "title title" auto "description description" 1fr/auto 1fr}}.progress-step__icon{grid-area:icon}.progress-step-icon{opacity:.6}.progress-step:last-child .progress-step-icon{opacity:1}.progress-step:last-child .progress-step-icon .progress-step-icon__circle{fill:var(--color-secondary)}.progress-step:last-child .progress-step-icon .progress-step-icon__bristles{fill:var(--color-primary)}.progress-step__separator{background-color:var(--color-black-500);grid-area:separator;height:100%;left:50%;opacity:.2;position:relative;top:0;width:1px}@container progress (min-width: 960px){.progress-step__separator{height:1px;left:0;top:50%;width:100%}}.progress-step:last-child .progress-step__separator{display:none}.progress-step__title{align-self:center;grid-area:title}.progress-step__text{display:flex;flex-direction:column;gap:var(--space-size-xs);grid-area:description;padding-bottom:var(--space-size-l)}@container progress (min-width: 960px){.progress-step__text{padding-bottom:var(--space-size-xs)}}.progress__footer{grid-area:footer;padding-left:calc(var(--progress-step-icon-width) + var(--space-size-s))}@container progress (min-width: 960px){.progress__footer{--progress-grid-column-width:calc(100%/var(--progress-step-count) + var(--grid-gutter)/var(--progress-step-count));padding-left:calc(var(--progress-grid-column-width)*(var(--progress-step-count) - 1))}}
