/* Original illustrated flowchart layout with live text in the site font. */
.illustrated-flowchart{background:#fff;font-family:var(--sans);padding:18px 0 0}
.illustrated-flowchart .flow-summary{margin:0 20px 18px;border-radius:20px;padding:22px 24px;gap:20px;grid-template-columns:1fr .65fr 1.05fr .65fr 1fr;background:#071b53}
.illustrated-flowchart .flow-party{display:flex;align-items:center;justify-content:center;gap:14px}
.illustrated-flowchart .flow-party strong{font-size:var(--type-body);font-weight:600;line-height:1.35}
.illustrated-flowchart .flow-connection{font-size:var(--type-label)}
.flow-end-picture{display:block;flex:0 0 64px;width:64px;height:64px;overflow:hidden;border-radius:50%}
.illustrated-grid{position:relative;isolation:isolate}
.illustrated-flowchart .illustrated-steps{position:relative;z-index:1;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:1fr;gap:64px 32px;padding:38px 34px 32px;background:none}
.illustrated-flowchart .illustrated-steps>li{position:relative;display:flex;flex-direction:column;align-items:center;padding:32px 12px 24px;border:1px solid #ccd2dc;border-radius:12px;background:#fff;box-shadow:0 2px 4px #00168809;text-align:center}
.illustrated-number{position:absolute;top:-24px;left:calc(50% - 24px);display:grid;place-items:center;width:48px;height:48px;border:3px solid #fff;border-radius:50%;background:#071b53;color:#fff;font:600 var(--type-card)/1 var(--sans)}
.illustrated-steps>li:nth-child(even) .illustrated-number{background:var(--red)}
.flow-original-picture{display:block;width:80px;height:80px;flex-shrink:0;margin:0 0 18px;overflow:hidden;border-radius:16px}
.illustrated-flowchart .illustrated-steps h3{font:600 var(--type-body)/1.35 var(--sans);letter-spacing:0;color:var(--navy);min-height:4.05em;width:100%;margin:0 0 16px}
.illustrated-flowchart .illustrated-steps p{font:400 var(--type-body)/1.5 var(--sans);color:var(--muted);margin:0;width:100%;overflow-wrap:normal}
.illustrated-steps>li:not(:last-child)::after{content:'';position:absolute;top:48%;left:100%;width:32px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='20' viewBox='0 0 32 20'%3E%3Cpath d='M2 10h27m-8-7 8 7-8 7' stroke='%23636b76' stroke-width='2' fill='none'/%3E%3C/svg%3E") center/32px 20px no-repeat}
.illustrated-steps>li:nth-child(6n)::after{display:none}
.illustrated-row-links{position:absolute;z-index:0;inset:0;width:100%;height:100%;stroke:#636b76;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}
.row-links-three{display:none}
.flow-viewport .illustrated-flowchart{min-width:0}
@media(max-width:1199px){
 .illustrated-flowchart .flow-summary{gap:12px;padding:22px 18px}
 .flow-end-picture{flex-basis:52px;width:52px;height:52px}
 .illustrated-flowchart .flow-party{flex-direction:column;gap:10px}
 .illustrated-flowchart .illustrated-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:64px 32px}
 .illustrated-steps>li:nth-child(6n)::after{display:block}
 .illustrated-steps>li:nth-child(3n)::after{display:none}
 .row-links-six{display:none}.row-links-three{display:block}
 .illustrated-flowchart .illustrated-steps>li{padding-inline:18px}
}
@media(max-width:767px){
 .illustrated-flowchart .flow-summary{grid-template-columns:1fr;margin:0 16px 18px;border-radius:14px;padding:24px;gap:16px}
 .illustrated-flowchart .flow-party{flex-direction:row;gap:14px}
 .illustrated-flowchart .flow-party strong{font-size:var(--type-body)}
 .illustrated-flowchart .illustrated-steps{grid-template-columns:1fr;grid-auto-rows:auto;gap:54px;padding:36px 24px 28px}
 .illustrated-flowchart .illustrated-steps>li{padding:34px 22px 26px}
 .illustrated-flowchart .illustrated-steps h3{min-height:0;margin-bottom:14px}
 .illustrated-steps>li:not(:last-child)::after,.illustrated-steps>li:nth-child(3n):not(:last-child)::after,.illustrated-steps>li:nth-child(6n):not(:last-child)::after{display:block;top:100%;left:calc(50% - 16px);margin-top:15px;transform:rotate(90deg)}
 .illustrated-row-links,.row-links-three{display:none}
}

/* Keep the illustrated boxes readable at the normal page text size. */
@media(min-width:768px){
 .illustrated-flowchart .illustrated-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:64px 32px}
 .illustrated-flowchart .illustrated-steps>li{padding:34px 22px 28px}
 .illustrated-flowchart .illustrated-steps h3{min-height:2.7em}
 .illustrated-steps>li:nth-child(6n)::after{display:block}
 .illustrated-steps>li:nth-child(3n)::after{display:none}
 .row-links-six{display:none}.row-links-three{display:block}
}
.illustrated-flowchart .flow-summary{background:var(--navy)}
.illustrated-number{background:var(--navy)}