.flowchart{--flow-radius: 0rem;--flow-border: 6px;--flow-number: 1.75rem}.flowchart__title{margin-block-end:var(--space-3);font:700 var(--text-h3) / var(--leading-headline) var(--font-headline);text-transform:uppercase}.flow{display:grid;gap:var(--space-3);counter-reset:flow-step}.flow>li{counter-increment:flow-step}.flow-step>summary:before{content:counter(flow-step);display:grid;place-items:center;flex:none;inline-size:var(--flow-number);block-size:var(--flow-number);border-radius:50%;background:var(--color-red);color:var(--color-white);font:700 1rem / 1 var(--font-headline)}.flow-step{scroll-margin-block-start:calc(var(--header-height) + var(--space-3));border:var(--flow-border) solid var(--color-gray);border-radius:var(--flow-radius);background:var(--color-white)}.flow-step>summary{position:relative;display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) 3rem var(--space-3) var(--space-3);font:600 var(--text-h4) / 1.2 var(--font-headline);text-transform:uppercase;letter-spacing:.02em;list-style:none;cursor:pointer}[dir=rtl] .flow-step>summary{padding-inline:var(--space-3) 3rem}.flow-step>summary::-webkit-details-marker{display:none}.flow-step>summary:after{content:"";position:absolute;inset-inline-end:1.1rem;inset-block-start:calc(var(--space-3) + (var(--flow-number) - 1rem) / 2);inline-size:1rem;block-size:1rem;background:linear-gradient(currentColor,currentColor) center / 100% 2px no-repeat,linear-gradient(currentColor,currentColor) center / 2px 100% no-repeat;transition:background-size var(--dur) var(--ease-out)}.flow-step[open]>summary:after{background-size:100% 2px,2px 0}.flow-step>summary:hover,.flow-step>summary:focus-visible{color:var(--color-red)}.flow-step__body{display:grid;gap:var(--space-2);padding:0 var(--space-4) var(--space-4) calc(var(--space-3) * 2 + var(--flow-number));font-size:var(--text-sm);line-height:var(--leading-tight)}[dir=rtl] .flow-step__body{padding-inline:var(--space-4) calc(var(--space-3) * 2 + var(--flow-number))}.flow-step__body p,.flow-step__body ol,.flow-step__body ul{margin:0}.flow-step__goal{color:var(--color-red)}.flow-step__clarify{font-weight:600}.flow-step__clarify ol{padding-inline-start:1.2em}.flow-step__clarify ul{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);margin-block-start:var(--space-2);padding:0;list-style:none}.flow-hint{display:block;overflow:hidden;max-block-size:0;opacity:0;transform:translate(-.5rem);font:600 var(--text-xs) / 1.4 var(--font-headline);letter-spacing:var(--tracking-label);text-transform:uppercase;transition:opacity var(--dur) var(--ease-out),transform var(--dur) var(--ease-out),max-block-size var(--dur) var(--ease-out),margin var(--dur) var(--ease-out)}[dir=rtl] .flow-hint{transform:translate(.5rem)}.flow-hint:before{content:"↓ "}.flow-hint.is-shown{max-block-size:3em;margin-block-end:var(--space-1);opacity:1;transform:none}.flow-step__goal,.flow-step__clarify{border-inline-start:3px solid transparent;margin-inline-start:calc(-3px - var(--space-2));padding-inline-start:var(--space-2);transition:border-color var(--dur) var(--ease-out)}.flow-step__goal.is-explained{border-inline-start-color:var(--color-red)}.flow-step__clarify.is-explained{border-inline-start-color:var(--color-black)}