.process-flow-container{display:flex;align-items:stretch;gap:20px;padding:20px 0}.process-flow-container.layout-horizontal{flex-direction:row;flex-wrap:wrap;justify-content:center}.process-flow-container.layout-horizontal .process-step-item{flex:1;min-width:200px;max-width:300px}.process-flow-container.layout-vertical{flex-direction:column;align-items:center}.process-flow-container.layout-vertical .process-step-item{width:100%;max-width:500px;margin-bottom:30px}.process-step-item{position:relative;text-align:center;background:#fff;border-radius:10px;padding:30px 20px;box-shadow:0 2px 15px rgb(0 0 0 / .1);transition:all 0.3s ease}.process-step-item:hover{transform:translateY(-5px);box-shadow:0 5px 25px rgb(0 0 0 / .15)}.process-step-number{position:absolute;top:-15px;left:50%;transform:translateX(-50%);width:40px;height:40px;background-color:#e91e63;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;z-index:10;box-shadow:0 2px 10px rgb(233 30 99 / .3)}.process-step-content{position:relative;z-index:5}.process-step-image{margin-bottom:20px;border-radius:8px;overflow:hidden;max-height:200px}.process-step-image img{width:100%;height:200px;object-fit:cover;transition:transform 0.3s ease}.process-step-item:hover .process-step-image img{transform:scale(1.05)}.process-step-icon{font-size:48px;color:#e91e63;margin-bottom:20px}.process-step-icon i{transition:transform 0.3s ease}.process-step-item:hover .process-step-icon i{transform:scale(1.1)}.process-step-title{font-size:20px;font-weight:600;color:#333;margin:15px 0 10px;line-height:1.3}.process-step-description{font-size:14px;color:#666;line-height:1.6;margin:0}.process-step-connector{position:absolute;background-color:#e91e63;z-index:1}.layout-horizontal .process-step-connector{top:50%;right:-20px;width:20px;height:3px;transform:translateY(-50%)}.layout-horizontal .process-step-connector::before{content:'';position:absolute;right:-8px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:8px solid #e91e63;border-top:6px solid #fff0;border-bottom:6px solid #fff0}.layout-vertical .process-step-connector{bottom:-30px;left:50%;width:3px;height:30px;transform:translateX(-50%)}.layout-vertical .process-step-connector::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:0;height:0;border-top:8px solid #e91e63;border-left:6px solid #fff0;border-right:6px solid #fff0}@media (max-width:768px){.process-flow-container.layout-horizontal{flex-direction:column;align-items:center}.process-flow-container.layout-horizontal .process-step-item{width:100%;max-width:400px;margin-bottom:30px}.layout-horizontal .process-step-connector{display:none}.process-flow-container.layout-horizontal .process-step-item:not(:last-child)::after{content:'';position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);width:3px;height:30px;background-color:#e91e63;z-index:1}.process-step-number{width:35px;height:35px;font-size:16px;top:-12px}.process-step-item{padding:25px 15px}.process-step-title{font-size:18px}.process-step-icon{font-size:36px}}@media (max-width:480px){.process-step-item{padding:20px 10px}.process-step-title{font-size:16px}.process-step-description{font-size:13px}.process-step-icon{font-size:32px;margin-bottom:15px}}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{box-shadow:0 0 0 0 rgb(233 30 99 / .7)}70%{box-shadow:0 0 0 10px #fff0}100%{box-shadow:0 0 0 0 #fff0}}@keyframes slideConnector{from{transform:scaleX(0)}to{transform:scaleX(1)}}.process-step-item{opacity:0;animation:fadeInUp 0.6s ease forwards}.process-step-item:nth-child(1){animation-delay:0.1s}.process-step-item:nth-child(2){animation-delay:0.2s}.process-step-item:nth-child(3){animation-delay:0.3s}.process-step-item:nth-child(4){animation-delay:0.4s}.process-step-item:nth-child(5){animation-delay:0.5s}.process-step-item:nth-child(6){animation-delay:0.6s}.process-step-item:hover .process-step-number{animation:pulse 2s infinite}.process-step-connector{transform-origin:left center;animation:slideConnector 0.5s ease forwards;animation-delay:0.8s;transform:scaleX(0)}.layout-vertical .process-step-connector{transform-origin:center top}.process-step-item.active{transform:scale(1.05);z-index:10}.process-step-item.active .process-step-number{background:linear-gradient(45deg,#e91e63,#f06292);transform:scale(1.2)}.process-step-item.keyboard-focus{outline:3px solid #71d7f7;outline-offset:3px}.process-step-item{cursor:pointer;user-select:none}.process-step-item:active{transform:translateY(-2px) scale(.98)}.process-step-item.animate-in{opacity:1;transform:translateY(0)}.process-step-progress{position:absolute;bottom:0;left:0;height:3px;background:linear-gradient(90deg,#e91e63,#f06292);border-radius:3px;transition:width 0.5s ease}.process-step-tooltip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:#333;color:#fff;padding:8px 12px;border-radius:4px;font-size:12px;white-space:nowrap;opacity:0;visibility:hidden;transition:all 0.3s ease;z-index:1000}.process-step-tooltip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid #fff0;border-top-color:#333}.process-step-item:hover .process-step-tooltip{opacity:1;visibility:visible}.process-flow-container.loading .process-step-item{opacity:.5;pointer-events:none}.process-flow-container.loading::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30px;height:30px;border:3px solid #f3f3f3;border-top:3px solid #e91e63;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(360deg)}}