.process-animation-container{align-items:center;gap:var(--space-6);opacity:0;flex-direction:column;transition:opacity .6s,transform .6s;display:flex;transform:translateY(20px)}.process-animation-container.visible{opacity:1;transform:translateY(0)}.process-phone{background:linear-gradient(145deg,#2a2a2a,#1a1a1a);border-radius:40px;width:240px;padding:10px;box-shadow:0 30px 60px #0000004d,inset 0 0 0 1px #ffffff14,inset 0 1px #ffffff1a}.process-screen{background:linear-gradient(#f8fafc 0%,#fff 100%);border-radius:32px;height:480px;position:relative;overflow:hidden}.process-step{padding:var(--space-6);opacity:0;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;transition:opacity .5s,transform .5s;display:flex;position:absolute;inset:0;transform:scale(.95)}.process-step.active{opacity:1;pointer-events:auto;transform:scale(1)}.step-hint{font-size:var(--text-sm);color:var(--text-tertiary);margin-top:var(--space-4);font-weight:500}.qr-scanner{justify-content:center;align-items:center;width:160px;height:160px;display:flex;position:relative}.qr-code{border-radius:var(--radius-md);width:120px;height:120px;box-shadow:var(--shadow-md);background:#fff;padding:8px}.qr-pattern{grid-template-columns:repeat(5,1fr);gap:2px;width:100%;height:100%;display:grid}.qr-cell{background:#e5e5e5;border-radius:2px}.qr-cell.filled{background:#1a1a1a}.scan-line{background:linear-gradient(90deg,transparent,var(--color-primary-500),transparent);border-radius:2px;height:3px;animation:2s ease-in-out infinite scanAnimation;position:absolute;left:20px;right:20px}@keyframes scanAnimation{0%,to{opacity:0;top:20px}10%{opacity:1}90%{opacity:1}to{opacity:0;top:calc(100% - 20px)}}.scan-corners{position:absolute;inset:0}.scan-corners span{border:3px solid var(--color-primary-500);width:24px;height:24px;position:absolute}.scan-corners span:first-child{border-bottom:none;border-right:none;border-radius:8px 0 0;top:0;left:0}.scan-corners span:nth-child(2){border-bottom:none;border-left:none;border-radius:0 8px 0 0;top:0;right:0}.scan-corners span:nth-child(3){border-top:none;border-right:none;border-radius:0 0 0 8px;bottom:0;left:0}.scan-corners span:nth-child(4){border-top:none;border-left:none;border-radius:0 0 8px;bottom:0;right:0}.lang-selector{align-items:center;gap:var(--space-3);flex-direction:column;display:flex}.lang-current,.lang-translated{align-items:center;gap:var(--space-3);padding:var(--space-3)var(--space-4);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;min-width:180px;display:flex}.lang-flag{font-size:var(--text-2xl)}.lang-text{font-weight:500;font-size:var(--text-base)}.lang-arrow{font-size:var(--text-2xl);color:var(--color-primary-500);animation:1s ease-in-out infinite bounceArrow}@keyframes bounceArrow{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.step-lang.active .lang-translated{animation:.6s ease-out .3s both slideInTranslate}@keyframes slideInTranslate{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.image-gallery{gap:var(--space-3);display:flex}.image-card{align-items:center;gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;flex-direction:column;transition:transform .3s,box-shadow .3s;display:flex}.image-card.highlight{box-shadow:var(--shadow-lg);border:2px solid var(--color-primary-500);transform:scale(1.05)}.image-placeholder{border-radius:var(--radius-md);background-position:50%;background-size:cover;width:80px;height:60px}.image-placeholder.kitchen{background:linear-gradient(135deg,#e8f5e9 0%,#c8e6c9 100%);position:relative}.image-placeholder.kitchen:after{content:"🍳";justify-content:center;align-items:center;font-size:24px;display:flex;position:absolute;inset:0}.image-placeholder.bathroom{background:linear-gradient(135deg,#e3f2fd 0%,#bbdefb 100%);position:relative}.image-placeholder.bathroom:after{content:"🚿";justify-content:center;align-items:center;font-size:24px;display:flex;position:absolute;inset:0}.image-card span{font-size:var(--text-sm);color:var(--text-secondary);font-weight:500}.step-images.active .image-card.highlight{animation:2s ease-in-out infinite pulseHighlight}@keyframes pulseHighlight{0%,to{transform:scale(1.05)}50%{transform:scale(1.08)}}.task-list-anim{gap:var(--space-2);flex-direction:column;width:100%;max-width:180px;display:flex}.task-anim{align-items:center;gap:var(--space-3);padding:var(--space-2)var(--space-3);border-radius:var(--radius-md);font-size:var(--text-sm);background:#fff;font-weight:500;display:flex}.task-anim .check{border-radius:var(--radius-full);color:#fff;background:var(--color-gray-200);justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;display:flex}.task-anim.done .check{background:var(--color-success)}.task-anim.completing .check.animating{background:var(--color-gray-300);animation:.5s ease-out .5s forwards checkmarkPop}@keyframes checkmarkPop{0%{background:var(--color-gray-300);transform:scale(1)}50%{transform:scale(1.3)}to{background:var(--color-success);transform:scale(1)}}.completion-badge{align-items:center;gap:var(--space-2);margin-top:var(--space-4);padding:var(--space-2)var(--space-4);background:linear-gradient(135deg,var(--color-primary-500),var(--color-accent-500));color:#fff;border-radius:var(--radius-full);font-weight:600;font-size:var(--text-sm);opacity:0;display:flex;transform:scale(.8)}.step-complete.active .completion-badge{animation:.5s ease-out 1s forwards badgePop}@keyframes badgePop{0%{opacity:0;transform:scale(.8)}60%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.step-indicators{gap:var(--space-4);display:flex}.step-indicator{align-items:center;gap:var(--space-2);cursor:pointer;padding:var(--space-2);background:0 0;border:none;flex-direction:column;transition:all .3s;display:flex}.indicator-dot{border-radius:var(--radius-full);background:var(--color-gray-200);width:12px;height:12px;transition:all .3s}.step-indicator.active .indicator-dot{background:var(--color-primary-500);transform:scale(1.2)}.indicator-label{font-size:var(--text-xs);color:var(--text-tertiary);white-space:nowrap;transition:color .3s}.step-indicator.active .indicator-label{color:var(--color-primary-600);font-weight:600}.step-indicator:hover .indicator-dot{background:var(--color-primary-400)}@media (max-width:768px){.process-phone{width:200px}.process-screen{height:400px}.step-indicators{justify-content:center;gap:var(--space-2);flex-wrap:wrap}.indicator-label{display:none}}@media (prefers-reduced-motion:reduce){.scan-line,.lang-arrow,.step-images.active .image-card.highlight,.step-complete.active .completion-badge,.task-anim.completing .check.animating{animation:none}.step-complete.active .completion-badge{opacity:1;transform:scale(1)}.task-anim.completing .check.animating{background:var(--color-success)}}