.cp-how-intro{padding-block-end:var(--space-32)}.cp-loc{margin-block-start:var(--space-48)}.cp-loc__set{border:0;min-width:0;margin:0;padding:0}.cp-loc__route{margin:0;padding:0;list-style:none}.cp-loc__stage{position:relative}.cp-loc__target{align-items:center;gap:var(--space-16);cursor:pointer;border-radius:var(--radius-2);min-height:48px;display:flex}.cp-loc__target:has(input:focus-visible){outline:var(--focus-width) solid var(--focus-ring);outline-offset:var(--focus-offset)}.cp-loc__node{appearance:none;border:2px solid var(--brand-navy);border-radius:var(--radius-2);background:var(--brand-white);cursor:pointer;flex:none;width:20px;height:20px;margin:0}.cp-loc__node:focus-visible{outline:none}.cp-loc__target:hover .cp-loc__node{background:var(--brand-offwhite);border-width:3px}.cp-loc__target:hover .cp-loc__label{text-underline-offset:5px;text-decoration:underline}.cp-loc__stage:has(input:checked) .cp-loc__target:hover .cp-loc__node{background:var(--brand-yellow)}.cp-loc__label{font-size:var(--fs-ui);line-height:var(--lh-ui);color:var(--brand-navy);font-weight:500}.cp-loc__stage:not(:last-child):after,.cp-loc__stage:not(:last-child):before{content:"";inset-inline-start:8.5px;position:absolute;top:34px;bottom:-14px}.cp-loc__stage:not(:last-child):after{background:var(--border-control);width:2px;margin-inline-start:.5px}.cp-loc__stage:not(:last-child):before{background:var(--brand-navy);z-index:1;transform-origin:top;width:3px;transition:transform .2s ease-in calc((9 - var(--i,0)) * 35ms);transform:scaleY(0)}.cp-loc__stage:has(~.cp-loc__stage input:checked):before{transition:transform .24s ease-out calc(var(--i,0) * 70ms);transform:none}.cp-loc__stage:has(input:checked) .cp-loc__node{background:var(--brand-yellow);box-shadow:0 0 0 2px var(--brand-navy)}.cp-loc__stage:has(input:checked) .cp-loc__label{font-weight:700}.cp-loc__stage:has(~.cp-loc__stage input:checked) .cp-loc__node{background:var(--brand-navy)}.cp-loc__stage:has(~.cp-loc__stage input:checked) .cp-loc__target:hover .cp-loc__node{background:var(--brand-navy)}.cp-loc__stage:has(~.cp-loc__stage input:checked) .cp-loc__label{color:var(--ink-2)}.cp-loc__route:has(input:checked) .cp-loc__stage:not(:has(input:checked)):not(:has(~.cp-loc__stage input:checked)) .cp-loc__node{border-color:var(--border-control)}.cp-loc__route:has(input:checked) .cp-loc__stage:not(:has(input:checked)):not(:has(~.cp-loc__stage input:checked)) .cp-loc__label{color:var(--ink-3)}@media (min-width:1024px){.cp-loc__route{grid-template-columns:repeat(10,1fr);display:grid}.cp-loc__target{align-items:flex-start;gap:var(--space-12);flex-direction:column;padding-block-end:var(--space-8);padding-inline-end:var(--space-12)}.cp-loc__stage:not(:last-child):after,.cp-loc__stage:not(:last-child):before{top:8.5px;bottom:auto;width:auto;margin:0;inset-inline:22px 2px}.cp-loc__stage:not(:last-child):after{height:2px;margin-block-start:.5px}.cp-loc__stage:not(:last-child):before{transform-origin:100%;height:3px;transform:scaleX(0)}.cp-loc__stage:has(~.cp-loc__stage input:checked):before{transform:none}[dir=ltr] .cp-loc__stage:not(:last-child):before{transform-origin:0}}@keyframes cp-loc-node{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}@keyframes cp-loc-fade{0%{opacity:0}to{opacity:1}}@keyframes cp-loc-draw-v{0%{transform:scaleY(0)}to{transform:none}}@keyframes cp-loc-draw-h{0%{transform:scaleX(0)}to{transform:none}}.cp-loc__route[data-motion=armed] .cp-loc__node,.cp-loc__route[data-motion=armed] .cp-loc__label{opacity:0;animation:1ms linear 3s both cp-loc-fade}.cp-loc__route[data-motion=armed] .cp-loc__stage:after{transform-origin:top;animation:1ms linear 3s both cp-loc-draw-v;transform:scaleY(0)}.cp-loc__route[data-motion=play] .cp-loc__node{animation:cp-loc-node .26s ease-out calc(var(--i) * .18s) both}.cp-loc__route[data-motion=play] .cp-loc__label{animation:cp-loc-fade .3s ease-out calc(var(--i) * .18s + 90ms) both}.cp-loc__route[data-motion=play] .cp-loc__stage:after{transform-origin:top;animation:cp-loc-draw-v .2s ease-in-out calc(var(--i) * .18s + .12s) both}@media (min-width:1024px){.cp-loc__route[data-motion=armed] .cp-loc__stage:after{transform-origin:100%;animation-name:cp-loc-draw-h;transform:scaleX(0)}.cp-loc__route[data-motion=play] .cp-loc__stage:after{transform-origin:100%;animation-name:cp-loc-draw-h}}.cp-loc__panels{margin-block-start:var(--space-32)}.cp-loc__panel{padding:var(--space-24);border-radius:var(--radius-12);background:var(--brand-white);border-inline-start:4px solid var(--brand-yellow);animation:.28s ease-out cp-loc-panel;display:none}@media (min-width:768px){.cp-loc__panel{padding:var(--space-32)}}.cp-loc__panel .cp-ui{margin-block-start:var(--space-16)}:is(.cp-loc:has(#loc-s1:checked) [data-for=s1],.cp-loc:has(#loc-s2:checked) [data-for=s2],.cp-loc:has(#loc-s3:checked) [data-for=s3],.cp-loc:has(#loc-s4:checked) [data-for=s4],.cp-loc:has(#loc-s5:checked) [data-for=s5],.cp-loc:has(#loc-s6:checked) [data-for=s6],.cp-loc:has(#loc-s7:checked) [data-for=s7],.cp-loc:has(#loc-s8:checked) [data-for=s8],.cp-loc:has(#loc-s9:checked) [data-for=s9],.cp-loc:has(#loc-s10:checked) [data-for=s10]){display:block}.cp-how-next{margin-block-start:var(--space-24)}@keyframes cp-loc-panel{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.cp-loc__panel,.cp-loc__route[data-motion] .cp-loc__node,.cp-loc__route[data-motion] .cp-loc__label,.cp-loc__route[data-motion] .cp-loc__stage:after{opacity:1!important;animation:none!important;transform:none!important}.cp-loc__stage:before{transition:none!important}}
