html body.home-page .home-order-flow{padding:64px 24px;background:#fff;}
.home-flow-inner{max-width:1192px;margin:auto;}
.home-flow-heading{text-align:center;margin-bottom:36px;}
.home-flow-heading>p{margin:0 0 10px;color:#6e6e73;font-size:14px;font-weight:500;}
html body.home-page .home-flow-heading h2{font:600 28px/1.5 inherit;font-size:28px!important;font-weight:600!important;line-height:1.5!important;color:#1d1d1f!important;margin:0;letter-spacing:.02em;}
.home-flow-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;list-style:none;margin:0;padding:0;}
.home-flow-step{position:relative;display:flex;flex-direction:column;align-items:flex-start;background:#f5f5f7;border:1px solid #eaebed;border-radius:18px;padding:22px 20px 24px;min-width:0;box-sizing:border-box;}
.home-flow-step:not(:last-child):after{content:'';position:absolute;top:38px;left:100%;width:19px;height:1px;background:#cbd2dc;}
.home-flow-number{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#fff;color:#0071e3;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;}
.home-flow-image{height:112px;width:100%;display:flex;align-items:center;justify-content:center;margin:14px 0 20px;}
.home-flow-image img{width:100%;height:100%;max-width:120px;object-fit:contain;}
html body.home-page .home-flow-step h3{font-size:16px!important;line-height:1.6!important;font-weight:600!important;color:#1d1d1f!important;margin:0 0 10px;}
.home-flow-step>p{font-size:13px;line-height:1.85;color:#6e6e73;margin:0;}
.home-flow-notes{margin-top:24px;text-align:center;}
.home-flow-notes p{font-size:12px;line-height:1.8;color:#86868b;margin:0;}
@media(max-width:900px){.home-flow-steps{grid-template-columns:repeat(3,minmax(0,1fr));}.home-flow-step:after{display:none;}}
@media(max-width:600px){html body.home-page .home-order-flow{padding:40px 16px;}.home-flow-heading{margin-bottom:24px;}html body.home-page .home-flow-heading h2{font-size:23px!important;}.home-flow-steps{grid-template-columns:1fr;gap:12px;}.home-flow-step{display:grid;grid-template-columns:32px 64px 1fr;gap:6px 14px;padding:18px;align-items:center;}.home-flow-number{grid-column:1;grid-row:1 / 3;}.home-flow-image{grid-column:2;grid-row:1 / 3;height:68px;margin:0;}.home-flow-step h3{grid-column:3;margin:0!important;}.home-flow-step>p{grid-column:3;font-size:12px;}.home-flow-notes{text-align:left;}}
.home-order-flow{scroll-margin-top:110px;}
/* Membership detail icons, scoped to homepage flow. */
html body .home-order-flow .ic-flow-symbol {
position: relative !important;
display: block !important;
width: 96px !important;
height: 76px !important;
margin: 0 0 34px !important;
}
html body .home-order-flow .ic-flow-symbol::before,
html body .home-order-flow .ic-flow-symbol::after {
content: "" !important;
position: absolute !important;
display: block !important;
}
html body .home-order-flow .ic-flow-symbol-card::before {
width: 86px !important;
height: 52px !important;
left: 5px !important;
top: 12px !important;
border-radius: 12px !important;
background: linear-gradient(135deg, #eaf5ff, #8dccff) !important;
box-shadow: 0 12px 24px rgba(0, 113, 227, 0.16) !important;
transform: rotate(-8deg) !important;
}
html body .home-order-flow .ic-flow-symbol-card::after {
width: 54px !important;
height: 8px !important;
left: 20px !important;
top: 38px !important;
border-radius: 999px !important;
background: #0071e3 !important;
transform: rotate(-8deg) !important;
}
html body .home-order-flow .ic-flow-symbol-order::before {
width: 54px !important;
height: 72px !important;
left: 21px !important;
top: 2px !important;
border-radius: 14px !important;
border: 4px solid #1d1d1f !important;
background: #fff !important;
}
html body .home-order-flow .ic-flow-symbol-order::after {
width: 42px !important;
height: 22px !important;
left: 27px !important;
top: 36px !important;
border-radius: 999px !important;
background: #0071e3 !important;
}
html body .home-order-flow .ic-flow-symbol-proof::before {
width: 72px !important;
height: 52px !important;
left: 12px !important;
top: 10px !important;
border-radius: 14px !important;
border: 4px solid #8fc5f4 !important;
background: #fff !important;
}
html body .home-order-flow .ic-flow-symbol-proof::after {
width: 28px !important;
height: 28px !important;
right: 2px !important;
bottom: 3px !important;
border-radius: 50% !important;
border: 5px solid #0071e3 !important;
box-shadow: 16px 14px 0 -12px #0071e3 !important;
}
html body .home-order-flow .ic-flow-symbol-print::before {
width: 76px !important;
height: 48px !important;
left: 10px !important;
top: 16px !important;
border-radius: 14px !important;
background: linear-gradient(180deg, #f2f7ff, #c9e7ff) !important;
border: 3px solid #b8d7f5 !important;
}
html body .home-order-flow .ic-flow-symbol-print::after {
width: 64px !important;
height: 18px !important;
left: 16px !important;
top: 42px !important;
border-radius: 8px !important;
background: linear-gradient(90deg, #13a8e8 0 25%, #ff3b30 25% 50%, #ffcc00 50% 75%, #34c759 75%) !important;
}
html body .home-order-flow .ic-flow-symbol-ship::before {
width: 78px !important;
height: 46px !important;
left: 9px !important;
top: 24px !important;
border-radius: 10px !important;
background: #d99a43 !important;
}
html body .home-order-flow .ic-flow-symbol-ship::after {
width: 50px !important;
height: 30px !important;
left: 23px !important;
top: 8px !important;
border-radius: 8px !important;
background: #f6c06f !important;
transform: skewX(-18deg) !important;
}
html body.home-page .home-order-flow .home-flow-step{align-items:center;text-align:center;}
html body.home-page .home-order-flow .home-flow-step h3,
html body.home-page .home-order-flow .home-flow-step>p{text-align:center;width:100%;}
html body.home-page .home-order-flow .home-flow-number{margin-left:auto;margin-right:auto;}
@media(max-width:600px){
html body.home-page .home-order-flow .home-flow-step{display:flex;flex-direction:column;padding:22px;gap:10px;}
html body.home-page .home-order-flow .home-flow-image{height:96px;margin:4px 0 8px;}
}