.process-section { position:relative; isolation:isolate; overflow:hidden; padding:clamp(54px,7vw,92px) clamp(16px,4.5vw,68px); color:#fff; background:radial-gradient(ellipse at 50% 40%,#153f60 0%,#0b2944 44%,#061a30 100%); }
.process-section::before,.process-section::after { position:absolute; z-index:-1; width:400px; height:400px; border:1px solid #21b9ff26; border-radius:50%; content:""; pointer-events:none; }
.process-section::before { top:-220px; left:-200px; box-shadow:0 0 0 30px #21b9ff08,0 0 0 70px #21b9ff06; }
.process-section::after { right:-220px; bottom:-280px; box-shadow:0 0 0 38px #21b9ff08,0 0 0 82px #21b9ff06; }
.process-inner { max-width:1510px; margin:0 auto; }
.process-heading { margin:0 auto 32px; text-align:center; }
.process-eyebrow { display:flex; align-items:center; justify-content:center; gap:12px; margin:0 0 8px; color:#e7f6ff; font-size:clamp(12px,1.1vw,16px); font-weight:850; letter-spacing:.16em; }
.process-eyebrow::before,.process-eyebrow::after { width:46px; height:1px; background:#13b8ff; content:""; }
.process-eyebrow span { color:#14baff; font-size:20px; line-height:1; }
.process-heading h2 { margin:0; color:#fff; font-size:clamp(36px,5vw,68px); font-weight:900; line-height:1.05; letter-spacing:-.035em; }
.process-heading > p:last-child { margin:12px auto 0; color:#e0eaf1; font-size:clamp(15px,1.55vw,22px); line-height:1.45; }
.process-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 24px; margin:0; padding:0; list-style:none; }
.process-card { position:relative; overflow:visible; min-width:0; border:1px solid #d7edff; border-radius:23px; background:linear-gradient(150deg,#f7fbff,#dbe7f0); color:#0c1c2c; box-shadow:0 0 0 1px #19b7ff20,0 8px 24px #0003,0 0 16px #00adff20; transition:transform .22s ease,box-shadow .22s ease; }
.process-card:hover { transform:translateY(-4px); box-shadow:0 12px 30px #0004,0 0 24px #12baff5c; }
.process-image { position:relative; height:clamp(125px,14vw,185px); overflow:hidden; border-radius:22px 22px 0 0; background:#bdd0de; }
.process-image::after { position:absolute; inset:35% 0 0; background:linear-gradient(transparent,#e8f1f8); content:""; }
.process-image img { display:block; width:100%; height:100%; object-fit:cover; }
.process-number { position:absolute; z-index:1; top:16px; left:17px; display:grid; place-items:center; min-width:65px; height:45px; padding:0 12px; border:1px solid #8de0ff; border-radius:24px; background:linear-gradient(135deg,#16c5ff,#0064b5 68%,#063a72); box-shadow:0 5px 13px #006bb75e; color:#fff; font-size:23px; font-weight:900; }
.process-copy { min-height:142px; padding:5px 22px 22px; }
.process-copy h3 { margin:0 0 8px; color:#071a2a; font-family:'Roboto Condensed',Arial,sans-serif; font-size:clamp(20px,1.8vw,26px); font-weight:900; line-height:1.18; }
.process-copy p { margin:0; color:#26394a; font-size:clamp(14px,1.15vw,17px); font-weight:550; line-height:1.4; }
.process-card:not(:nth-child(3n))::after { position:absolute; z-index:2; top:50%; right:-25px; display:grid; place-items:center; width:48px; height:48px; border:1px solid #72d7ff; border-radius:50%; background:linear-gradient(145deg,#058fdd,#003e78); box-shadow:0 0 18px #19baff99; color:#fff; content:"→"; font-size:27px; font-weight:700; transform:translateY(-50%); }
.process-cta { display:flex; align-items:center; justify-content:center; gap:18px; width:min(500px,100%); min-height:72px; margin:32px auto 0; padding:12px 28px; border:1px solid #65d7ff; border-radius:40px; background:linear-gradient(110deg,#098edc,#0050a0 64%,#07346a); box-shadow:0 0 0 2px #13aaff38,0 0 24px #08aaff8c,inset 0 1px #ffffff55; color:#fff; font-size:clamp(19px,2vw,27px); font-weight:900; text-align:center; text-decoration:none; transition:transform .2s ease,box-shadow .2s ease; }
.process-cta:hover { transform:translateY(-2px); box-shadow:0 0 0 3px #13aaff55,0 0 34px #08aaffb8,inset 0 1px #ffffff66; }
.process-drop { display:grid; place-items:center; width:38px; height:38px; border:2px solid #fff; border-radius:50% 50% 52% 8%; color:#fff; font-size:20px; transform:rotate(-45deg); }
.process-arrow { margin-left:auto; font-size:32px; font-weight:400; line-height:1; }
@media (max-width:1000px) { .process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 24px; }.process-card:not(:nth-child(3n))::after { display:none; }.process-card:not(:nth-child(2n))::after { display:grid; } }
@media (max-width:640px) { .process-section { padding:54px 16px 58px; }.process-heading { margin-bottom:24px; }.process-eyebrow { gap:8px; font-size:11px; letter-spacing:.12em; }.process-eyebrow::before,.process-eyebrow::after { width:24px; }.process-heading h2 { font-size:clamp(34px,10vw,46px); }.process-heading > p:last-child { max-width:420px; font-size:15px; }.process-grid { grid-template-columns:1fr; gap:14px; }.process-card:not(:nth-child(2n))::after { display:none; }.process-card:not(:last-child)::after { top:auto; right:50%; bottom:-20px; display:grid; width:32px; height:32px; font-size:20px; content:"↓"; transform:translateX(50%); }.process-image { height:160px; }.process-number { top:12px; left:13px; min-width:58px; height:40px; font-size:20px; }.process-copy { min-height:0; padding:7px 17px 18px; }.process-copy h3 { font-size:21px; }.process-copy p { font-size:14px; }.process-cta { min-height:60px; margin-top:25px; padding:10px 16px; gap:12px; font-size:19px; }.process-drop { width:32px; height:32px; font-size:17px; }.process-arrow { font-size:28px; } }
@media (prefers-reduced-motion:reduce) { .process-card,.process-cta { transition:none; } }

/* Visually separate the workflow from neighboring sections. */
.process-section { border-top: 5px solid #13b8ff; background: radial-gradient(ellipse at 50% 42%, #1b688b 0%, #115273 42%, #082f4c 100%); box-shadow: inset 0 18px 38px #00172a55, 0 -14px 34px #001a2d40; }
.process-section::before { border-color: #84dcff50; box-shadow: 0 0 0 30px #6bcfff12, 0 0 0 70px #6bcfff0a; }
.process-section::after { border-color: #84dcff40; box-shadow: 0 0 0 38px #6bcfff10, 0 0 0 82px #6bcfff08; }