/* Orthogonal path layout v15 */
.gbfsa { --gold: #b89a64; --grey:#b5b5b5; --green:#2bb673; }
.gbfsa-container { position: relative; margin: 0 auto; padding: 24px 8px 56px; }
.gbfsa-overlay { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }

.step { position: relative; display: grid; grid-template-columns: 120px 1fr 120px; align-items: center; gap: 16px; margin: 38px 0; }
.step.left   .icon-wrap { grid-column: 1; justify-self: center; }
.step.left   .content   { grid-column: 2 / span 2; }
.step.right  .icon-wrap { grid-column: 3; justify-self: center; }
.step.right  .content   { grid-column: 1 / span 2; }

.icon-wrap { position: relative; width: 120px; height: 120px; }
.icon-bubble { position:absolute; inset:0; background: var(--gold); color:#fff; border-radius: 50%; display:flex; align-items:center; justify-content:center; transform: scale(0); }
.icon-bubble .icon { width: 72px; height: 72px; opacity: 0; }

.content header { display:flex; gap: 8px; align-items: baseline; margin-bottom: 10px; }
.content header .num, .content header h3 { font-weight: 800; text-transform: uppercase; letter-spacing:.02em; }
.content header .num { font-size: 24px; }
.content header h3 { font-size: 24px; }
.content .desc { margin: 0; max-width: 720px; }

.s4 .big-check { position:absolute; left: -56px; bottom: -18px; width: 72px; height:72px; color: var(--gold); transform: scale(1); opacity: 0; transform-origin: left bottom; }
.s4 .big-check svg { width: 100%; height: 100%; }

.start-dot { position:absolute; width: 12px; height: 12px; background: var(--gold); border-radius: 50%; opacity:0; transform: translate(-50%,-50%) scale(0); }

.step .desc { color:#222; line-height: 1.5; }
.step header { color:#111; }

.path { fill: none; stroke: var(--grey); stroke-width: 5; stroke-dasharray: 12 10; stroke-linecap: round; }

.pop { animation: pop 360ms cubic-bezier(.2,1,.2,1) forwards; }
@keyframes pop { 0%{ transform: scale(0); } 80%{ transform: scale(1.5);} 100%{ transform: scale(1);} }

@media (max-width: 720px){
  .step { grid-template-columns: 96px 1fr 96px; }
  .icon-wrap { width: 96px; height: 96px; }
  .icon-bubble .icon { width: 60px; height: 60px; }
}