/* Four stages, one continuous delivery cycle. */
.approach.approach-cycle{display:block;background:#fff}
.approach-heading{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);align-items:end;gap:48px}
.approach-heading h2{font-size:clamp(2rem,3.15vw,3.4rem);line-height:1.15}
.approach-heading .eyebrow{font-size:.875rem;margin-bottom:22px}
.approach-summary{max-width:380px;justify-self:end}
.approach-summary p{color:var(--muted);font-size:1rem;line-height:1.75;margin:0 0 15px}
.delivery-cycle{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,40%) minmax(0,1fr);align-items:center;max-width:1220px;margin:40px auto 0;column-gap:20px}
.cycle-wheel{position:relative;grid-column:2;grid-row:1;aspect-ratio:1;width:100%;align-self:center}
.cycle-wheel svg{display:block;width:100%;height:auto;overflow:visible}
.cycle-track{fill:none;stroke:#9cbce0;stroke-width:4}
.cycle-arrows{stroke:#53769e;stroke-width:3}
.cycle-node{fill:var(--navy);stroke:white;stroke-width:7}
.cycle-node-label{fill:white;font:600 19px Arial,Helvetica,sans-serif;letter-spacing:.5px}
.cycle-centre{position:absolute;inset:30% 15%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px}
.cycle-centre span{color:var(--muted);font-size:.8125rem;font-weight:700;letter-spacing:.12em;line-height:1.5}
.cycle-centre strong{font-size:clamp(1.85rem,2.9vw,3rem);font-weight:400;letter-spacing:-.045em;line-height:1.12;color:var(--navy)}
.cycle-stages{grid-area:1/1/2/4;display:grid;grid-template-columns:subgrid;grid-template-rows:1fr 1fr;row-gap:60px;list-style:none;padding:0;margin:0;align-self:stretch;align-items:center}
.cycle-stage{min-width:0;max-width:320px;padding:12px 0}
.cycle-understand{grid-area:1/1;text-align:right;justify-self:end}
.cycle-design{grid-area:1/3}
.cycle-deliver{grid-area:2/3}
.cycle-strengthen{grid-area:2/1;text-align:right;justify-self:end}
.cycle-stage h3{color:var(--navy);font-size:clamp(1.45rem,2.15vw,2rem);line-height:1.2;margin:0 0 14px}
.cycle-stage h3 span{display:none}
.cycle-stage p{color:var(--muted);font-size:1rem;line-height:1.7;margin:0;text-wrap:pretty}
@media(max-width:1000px){
 .approach-heading{grid-template-columns:1fr;gap:24px}
 .approach-summary{justify-self:start;max-width:580px}
 .delivery-cycle{column-gap:10px;grid-template-columns:minmax(0,1fr) 320px minmax(0,1fr)}
 .cycle-stages{row-gap:44px}
 .cycle-centre strong{font-size:2rem}
 .cycle-centre span{font-size:.75rem;letter-spacing:.09em}
 .cycle-stage h3{font-size:1.5rem}
}
@media(max-width:760px){
 .delivery-cycle{display:flex;flex-direction:column;gap:20px;margin-top:28px}
 .cycle-wheel{width:min(100%,350px)}
 .cycle-centre{gap:12px}
 .cycle-stages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 26px;width:100%}
 .cycle-stage{grid-area:auto;text-align:left;justify-self:stretch;max-width:none;padding:20px 0 0;border-top:1px solid var(--line)}
 .cycle-stage h3{display:flex;align-items:center;gap:10px;font-size:1.3rem;margin-bottom:12px}
 .cycle-stage h3 span{display:inline-flex;align-items:center;justify-content:center;flex:none;width:30px;height:30px;background:var(--card-surface);border-radius:50%;font-size:.875rem;letter-spacing:0;color:var(--navy)}
}
@media(max-width:390px){
 .cycle-stages{grid-template-columns:1fr;gap:22px}
 .cycle-stage h3{font-size:1.4rem}
}
@supports not (grid-template-columns:subgrid){
 .cycle-stages{grid-template-columns:minmax(0,1fr) minmax(320px,40%) minmax(0,1fr);column-gap:20px}
 @media(min-width:761px) and (max-width:1000px){.cycle-stages{grid-template-columns:minmax(0,1fr) 320px minmax(0,1fr);column-gap:10px}}
 @media(max-width:760px){.cycle-stages{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:26px}}
 @media(max-width:390px){.cycle-stages{grid-template-columns:1fr}}
}
