.list-steps-container{container-name:--listStepsContainer;container-type:inline-size}.list-steps{--_step-size:90px;counter-reset:--listStepsCounter;list-style-type:none;-webkit-padding-start:0;padding-inline-start:0}.list-steps.switcher{--switcher-threshold:var(--breakpoint-ml)}.list-steps__step{--_step-background:var(--step-background,var(--color-fill-secondary-default));--_step-color:var(--step-color,var(--color-text-on-fill-secondary-default));--_step-border:var(--step-border,color-mix(in hsl,var(--_step-color) 5%,var(--_step-background) 100%));counter-increment:--listStepsCounter;margin:0;text-align:center}.list-steps__step p{color:var(--_minor)}.list-steps__step:hover{--step-background:var(--color-fill-brand-three);--step-color:var(--color-text-on-fill-brand-three);--step-border:var(--color-border-on-fill-brand-three)}.list-steps__body:before{aspect-ratio:1;background:var(--_step-background);border:10px solid var(--_step-border);border-radius:50vw;color:var(--_step-color);content:counter(--listStepsCounter,decimal-leading-zero);display:grid;inline-size:var(--_step-size);margin-inline:auto;place-content:center;-webkit-margin-after:var(--space-2xs-xs);font-size:var(--size-3);font-weight:var(--weight-black);line-height:var(--leading-flat);margin-block-end:var(--space-2xs-xs);-webkit-transition:background-color var(--timing-normal) ease-out,color var(--timing-normal) ease-out,border-color var(--timing-normal) ease-out;transition:background-color var(--timing-normal) ease-out,color var(--timing-normal) ease-out,border-color var(--timing-normal) ease-out}.list-steps__headline{margin-inline:auto}.list-steps[data-connected]{display:grid;gap:var(--space-2xl-3xl);isolation:isolate}.list-steps[data-connected] .list-steps__step{grid-row:sibling-index()}.list-steps[data-connected] .list-steps__step:first-of-type{anchor-name:--step-1}.list-steps[data-connected] .list-steps__step:nth-of-type(2){anchor-name:--step-2}.list-steps[data-connected] .list-steps__step:nth-of-type(3){anchor-name:--step-3}.list-steps[data-connected] .list-steps__step:nth-of-type(4){anchor-name:--step-4}.list-steps[data-connected] .list-steps__connection{border-left:2px dashed var(--_border);position:absolute;z-index:-1}.list-steps[data-connected] .list-steps__connection[data-direction="1-2"]{inset-block-end:anchor(--step-2 top);inset-block-start:calc(anchor(--step-1 bottom) + 1rem);inset-inline-end:anchor(--step-2 center);inset-inline-start:anchor(--step-1 center)}.list-steps[data-connected] .list-steps__connection[data-direction="2-3"]{inset-block-end:anchor(--step-3 top);inset-block-start:calc(anchor(--step-2 bottom) + 1rem);inset-inline-end:anchor(--step-3 center);inset-inline-start:anchor(--step-2 center)}.list-steps[data-connected] .list-steps__connection[data-direction="3-4"]{inset-block-end:anchor(--step-4 top);inset-block-start:calc(anchor(--step-3 bottom) + 1rem);inset-inline-end:anchor(--step-4 center);inset-inline-start:anchor(--step-3 center)}@container --listStepsContainer (inline-size >= 48rem){.list-steps[data-connected]{grid-template-columns:repeat(2,1fr)}.list-steps[data-connected] .list-steps__step:where(:nth-of-type(2n)){grid-column:2}.list-steps[data-connected] .list-steps__connection[data-direction="1-2"]{border-left:none;border-right:2px dashed var(--_border);border-top:2px dashed var(--_border);border-top-right-radius:var(--radius-small);inset-block-end:anchor(--step-2 top);inset-block-start:calc(anchor(--step-1 top) + var(--_step-size)/2);inset-inline-end:anchor(--step-2 center);inset-inline-start:anchor(--step-1 center)}.list-steps[data-connected] .list-steps__connection[data-direction="2-3"]{border-top:2px dashed var(--_border);border-top-left-radius:var(--radius-small);inset-block-end:anchor(--step-3 top);inset-block-start:calc(anchor(--step-2 top) + var(--_step-size)/2);inset-inline-end:anchor(--step-2 center);inset-inline-start:anchor(--step-3 center)}.list-steps[data-connected] .list-steps__connection[data-direction="3-4"]{border-left:none;border-right:2px dashed var(--_border);border-top:2px dashed var(--_border);border-top-right-radius:var(--radius-small);inset-block-end:anchor(--step-4 top);inset-block-start:calc(anchor(--step-3 top) + var(--_step-size)/2);inset-inline-end:anchor(--step-4 center);inset-inline-start:anchor(--step-3 center)}}@container --listStepsContainer (inline-size >= 64rem){.list-steps[data-connected]{grid-template-columns:repeat(4,1fr)}.list-steps[data-connected] .list-steps__step{grid-column:sibling-index();grid-row:1}.list-steps[data-connected] .list-steps__connection[data-direction="1-2"]{border-left:none;border-right:none;border-top:2px dashed var(--_border);border-top-right-radius:0;inset-block-end:anchor(--step-2 top);inset-block-start:calc(anchor(--step-1 top) + var(--_step-size)/2);inset-inline-end:anchor(--step-2 center);inset-inline-start:anchor(--step-1 center)}.list-steps[data-connected] .list-steps__connection[data-direction="2-3"]{border-top:2px dashed var(--_border);border-top-left-radius:0;inset-block-end:anchor(--step-3 top);inset-block-start:calc(anchor(--step-2 top) + var(--_step-size)/2);inset-inline-end:anchor(--step-3 center);inset-inline-start:anchor(--step-2 center)}.list-steps[data-connected] .list-steps__connection[data-direction="3-4"]{border-left:none;border-right:none;border-top:2px dashed var(--_border);border-top-right-radius:0;inset-block-end:anchor(--step-4 top);inset-block-start:calc(anchor(--step-3 top) + var(--_step-size)/2);inset-inline-end:anchor(--step-4 center);inset-inline-start:anchor(--step-3 center)}}