:root{--total-duration: 50s}.stage{position:relative;width:100%;height:800px;border-radius:var(--border-radius-large);background:var(--color-background2);box-shadow:0 3px 5px -1px rgba(var(--elevation-color),.2),0 6px 10px rgba(var(--elevation-color),.14),0 1px 18px rgba(var(--elevation-color),.12);overflow:hidden;margin:0 auto}.scene-hook,.scene-flow,.scene-payout,.scene-dashboard,.scene-scale{opacity:0}.scene-hook{animation:scene1 var(--total-duration) ease-in-out infinite}.scene-flow{animation:scene2 var(--total-duration) ease-in-out infinite}.scene-payout{animation:scene3 var(--total-duration) ease-in-out infinite}.scene-dashboard{animation:scene4 var(--total-duration) ease-in-out infinite}.scene-scale{animation:scene5 var(--total-duration) ease-in-out infinite}@keyframes scene1{0%{opacity:0;transform:translateY(16px)}2%,18%{opacity:1;transform:translateY(0)}20%,to{opacity:0;transform:translateY(-16px)}}@keyframes scene2{0%,19%{opacity:0;transform:translateY(16px)}21%,38%{opacity:1;transform:translateY(0)}40%,to{opacity:0;transform:translateY(-16px)}}@keyframes scene3{0%,39%{opacity:0;transform:translateY(16px)}41%,58%{opacity:1;transform:translateY(0)}60%,to{opacity:0;transform:translateY(-16px)}}@keyframes scene4{0%,59%{opacity:0;transform:translateY(16px)}61%,78%{opacity:1;transform:translateY(0)}80%,to{opacity:0;transform:translateY(-16px)}}@keyframes scene5{0%,79%{opacity:0;transform:translateY(16px)}81%,97%{opacity:1;transform:translateY(0)}99%,to{opacity:0;transform:translateY(-16px)}}.scene-title h1{font-family:var(--font-family-headings);font-size:42px;font-weight:var(--font-weight-regular);color:var(--color-text-primary);line-height:1.2;margin-bottom:24px;position:relative;z-index:1}.scene-title h1 strong{font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.scene-timeline{display:flex;align-items:center;justify-content:center;gap:0;width:100%;position:relative}.scene-node{display:flex;flex-direction:column;align-items:center;position:relative;flex-shrink:0;z-index:2;min-width:130px}.scene-icon{width:72px;height:72px;border-radius:var(--border-radius-base);display:flex;justify-content:center;align-items:center;margin-bottom:10px;position:relative;background:var(--color-white);border:2px solid var(--color-border-divider);color:var(--color-text-secondary);transition:none}.scene-icon svg{width:48px;height:48px}.scene-icon.icon-1{animation:icon1 var(--total-duration) ease-in-out infinite}.scene-icon.icon-2{animation:icon2 var(--total-duration) ease-in-out infinite}.scene-icon.icon-3{animation:icon3 var(--total-duration) ease-in-out infinite}.scene-icon.icon-4{animation:icon4 var(--total-duration) ease-in-out infinite}.scene-icon.icon-5{animation:icon5 var(--total-duration) ease-in-out infinite}@keyframes icon1{0%,20%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}24%,26%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}}@keyframes icon2{0%,26%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}28%,30%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}}@keyframes icon3{0%,30%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}32%,34%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}}@keyframes icon4{0%,33%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}35%,37%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}}@keyframes icon5{0%,36%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}38%,39%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary)}}.scene-label-text{font-size:10px;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.scene-connector{width:100px;height:2px;background:var(--color-border-divider);position:relative;margin:0 -50px 35px;border-radius:2px;overflow:hidden;align-self:center}.scene-connector:after{content:"";position:absolute;left:-100%;top:0;width:100%;height:100%;background:var(--color-brand-primary);border-radius:2px}.scene-connector:nth-of-type(2):after{animation:connector1 var(--total-duration) ease-in-out infinite}.scene-connector:nth-of-type(4):after{animation:connector2 var(--total-duration) ease-in-out infinite}.scene-connector:nth-of-type(6):after{animation:connector3 var(--total-duration) ease-in-out infinite}.scene-connector:nth-of-type(8):after{animation:connector4 var(--total-duration) ease-in-out infinite}@keyframes connector1{0%,22%{left:-100%}24%,98%{left:0}to{left:100%}}@keyframes connector2{0%,26%{left:-100%}28%,98%{left:0}to{left:100%}}@keyframes connector3{0%,30%{left:-100%}32%,98%{left:0}to{left:100%}}@keyframes connector4{0%,34%{left:-100%}36%,98%{left:0}to{left:100%}}.scene-hook{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:60px;background:linear-gradient(45deg,var(--color-white) 0%,var(--color-brand-primary2) 100%)}.scene-hook:before{content:"";position:absolute;bottom:0;left:0;right:0;height:40%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cpath d='M0 50 L25 25 L50 50 L75 25 L100 50' fill='none' stroke='%23CBD5E1' stroke-width='0.5' opacity='0.3'/%3E%3Cpath d='M0 60 L25 35 L50 60 L75 35 L100 60' fill='none' stroke='%23CBD5E1' stroke-width='0.5' opacity='0.3'/%3E%3Cpath d='M0 70 L25 45 L50 70 L75 45 L100 70' fill='none' stroke='%23CBD5E1' stroke-width='0.5' opacity='0.3'/%3E%3Ccircle cx='25' cy='25' r='1.5' fill='%2394A3B8' opacity='0.4'/%3E%3Ccircle cx='50' cy='50' r='1.5' fill='%2394A3B8' opacity='0.4'/%3E%3Ccircle cx='75' cy='25' r='1.5' fill='%2394A3B8' opacity='0.4'/%3E%3Ccircle cx='25' cy='35' r='1.5' fill='%2394A3B8' opacity='0.4'/%3E%3Ccircle cx='50' cy='60' r='1.5' fill='%2394A3B8' opacity='0.4'/%3E%3Ccircle cx='75' cy='35' r='1.5' fill='%2394A3B8' opacity='0.4'/%3E%3C/svg%3E");background-size:120px 120px;opacity:.6;pointer-events:none}.scene-hook .accent-line{width:60px;height:4px;background:var(--color-brand-primary);border-radius:2px;position:relative;z-index:1}.scene-hook p{font-size:16px;color:var(--color-text-secondary);max-width:560px;line-height:1.6;position:relative;z-index:1}.scene-flow{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:40px 40px 20px;opacity:0}.booking-card-container{position:relative;top:0;left:0;width:220px;z-index:10;opacity:0;animation:cardAppear var(--total-duration) ease-in-out infinite}@keyframes cardAppear{0%,26%{opacity:0;transform:translateY(40px)}28%,98%{opacity:1;transform:translateY(20px)}to{opacity:0}}.booking-card{background:var(--color-background);border:1px solid var(--color-border-divider);border-radius:var(--border-radius-base);padding:14px 16px;box-shadow:0 3px 5px -1px rgba(var(--elevation-color),.2),0 6px 10px rgba(var(--elevation-color),.14),0 1px 18px rgba(var(--elevation-color),.12)}.booking-card .booking-id{font-size:11px;font-weight:700;color:var(--color-text-primary);margin-bottom:6px}.booking-card .booking-guest{font-size:12px;color:var(--color-text-primary);margin-bottom:3px}.booking-card .booking-detail{font-size:11px;color:var(--color-text-secondary);margin-bottom:4px}.booking-card .booking-revenue{font-size:11px;font-weight:600;color:var(--color-brand-primary);margin-bottom:4px}.booking-card .booking-status{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:4px;display:inline-block;animation:statusChange var(--total-duration) ease-in-out infinite}@keyframes statusChange{0%,30%{background:var(--color-blue2);color:var(--color-blue)}33%,35%{background:var(--color-orange2);color:var(--color-orange)}36%,to{background:var(--color-green2);color:var(--color-green)}}.scene-payout{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:80px 60px 40px;opacity:0}.scene-payout .scene-icon.icon-1{animation:iconPayOut1 var(--total-duration) ease-in-out infinite}.scene-payout .scene-icon.icon-2{animation:iconPayOut2 var(--total-duration) ease-in-out infinite}.scene-payout .scene-icon.icon-3{animation:iconPayOut3 var(--total-duration) ease-in-out infinite}@keyframes iconPayOut1{0%,40%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary);transform:scale(1)}42%,44%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white);transform:scale(1.1)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary);transform:scale(1)}}@keyframes iconPayOut2{0%,46%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary);transform:scale(1)}48%,50%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white);transform:scale(1.1)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary);transform:scale(1)}}@keyframes iconPayOut3{0%,50%{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary);transform:scale(1)}52%,54%{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:var(--color-white);transform:scale(1.1)}98%,to{background:var(--color-white);border-color:var(--color-border-divider);color:var(--color-text-secondary);transform:scale(1)}}.scene-payout .scene-connector:nth-of-type(2):after{animation:connectorPayOut1 var(--total-duration) ease-in-out infinite}.scene-payout .scene-connector:nth-of-type(4):after{animation:connectorPayOut2 var(--total-duration) ease-in-out infinite}@keyframes connectorPayOut1{0%,43%{left:-100%}45%,98%{left:0}to{left:100%}}@keyframes connectorPayOut2{0%,48%{left:-100%}50%,98%{left:0}to{left:100%}}.speed-badge{position:absolute;bottom:-40px;left:0;background:var(--color-brand-secondary);color:var(--color-white);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 10px;border-radius:4px;white-space:nowrap;opacity:0;animation:speedBadge var(--total-duration) ease-in-out infinite}@keyframes speedBadge{0%,48%{opacity:0;transform:translateY(20px)}50%,90%{opacity:1;transform:translateY(0)}to{opacity:0}}.scene-dashboard{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px 50px;opacity:0}.dash-header{font-family:var(--font-family-headings);font-size:16px;font-weight:600;color:var(--color-text-secondary);letter-spacing:2px;margin-bottom:20px}.dash-mockup{width:100%;background:var(--color-white);border-radius:10px;border:1px solid var(--color-border-divider);box-shadow:0 3px 5px -1px rgba(var(--elevation-color),.2),0 6px 10px rgba(var(--elevation-color),.14),0 1px 18px rgba(var(--elevation-color),.12);overflow:hidden}.dash-mockup-header{background:var(--color-text-primary);padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.dash-mockup-header span{font-size:12px;font-weight:600;color:#ffffffb3}.dash-mockup-header .dash-title{font-size:13px;font-weight:700;color:var(--color-white)}.dash-row-head{display:grid;grid-template-columns:repeat(8,1fr);align-items:center;padding:10px 16px;border-bottom:1px solid var(--color-border-divider);font-size:9px;font-weight:var(--font-weight-bold);text-transform:uppercase}.dash-row{display:grid;grid-template-columns:repeat(8,1fr);align-items:center;padding:10px 16px;border-bottom:1px solid var(--color-border-divider);opacity:0}.dash-row:nth-child(3){animation:rowAppear1 var(--total-duration) ease-in-out infinite}.dash-row:nth-child(4){animation:rowAppear2 var(--total-duration) ease-in-out infinite}.dash-row:nth-child(5){animation:rowAppear3 var(--total-duration) ease-in-out infinite}.dash-row:nth-child(6){animation:rowAppear4 var(--total-duration) ease-in-out infinite}.dash-row:nth-child(7){animation:rowAppear5 var(--total-duration) ease-in-out infinite}@keyframes rowAppear1{0%,62%{opacity:0;transform:translate(-8px)}65%,79%{opacity:1;transform:translate(0)}80%,to{opacity:0;transform:translate(0)}}@keyframes rowAppear2{0%,64%{opacity:0;transform:translate(-8px)}67%,79%{opacity:1;transform:translate(0)}80%,to{opacity:0;transform:translate(0)}}@keyframes rowAppear3{0%,66%{opacity:0;transform:translate(-8px)}69%,79%{opacity:1;transform:translate(0)}80%,to{opacity:0;transform:translate(0)}}@keyframes rowAppear4{0%,68%{opacity:0;transform:translate(-8px)}71%,79%{opacity:1;transform:translate(0)}80%,to{opacity:0;transform:translate(0)}}@keyframes rowAppear5{0%,70%{opacity:0;transform:translate(-8px)}73%,79%{opacity:1;transform:translate(0)}80%,to{opacity:0;transform:translate(0)}}.dash-row:last-child{border-bottom:none}.dash-cell{font-size:11px;text-align:left}.dash-cell.commission{text-align:right;font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.status-badge{font-size:9px;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.5px;padding:2px 8px;border-radius:4px;display:inline-block;line-height:2}.status-estimated{background:var(--color-orange2);color:var(--color-orange)}.status-inreview,.status-open{background:var(--color-blue2);color:var(--color-blue)}.status-collected{background:var(--color-orange2);color:var(--color-orange)}.status-paid{background:var(--color-green2);color:var(--color-green)}.status-confirmed{background:var(--color-blue2);color:var(--color-blue)}.status-checkedout{background:var(--color-gray2);color:var(--color-gray)}.scene-scale{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:60px;background:linear-gradient(135deg,var(--color-white) 0%,var(--color-brand-primary2) 100%);opacity:0}.scale-number{font-size:64px;font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1;margin-bottom:8px;opacity:0;animation:countUp var(--total-duration) ease-in-out infinite}@keyframes countUp{0%,81%{opacity:0;transform:scale(.88)}84%,98%{opacity:1;transform:scale(1)}to{opacity:0}}.scale-label{font-size:16px;color:var(--color-text-secondary);margin-bottom:32px;opacity:0;animation:scaleLabel var(--total-duration) ease-in-out infinite}@keyframes scaleLabel{0%,83%{opacity:0;transform:translateY(8px)}86%,98%{opacity:1;transform:translateY(0)}to{opacity:0}}a.scale-cta{background:var(--color-brand-primary);color:var(--color-white);font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:2px;padding:14px 28px;border-radius:8px;border:none;cursor:pointer;text-decoration:none;opacity:0;animation:ctaPulse var(--total-duration) ease-in-out infinite}@keyframes ctaPulse{0%,85%{opacity:0;transform:scale(.96)}86%,87%{opacity:1;transform:scale(1.04)}88%,98%{opacity:1;transform:scale(1)}to{opacity:0}}.progress-dots{position:absolute;bottom:24px;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:20}.dot{height:8px;border-radius:50%;background:var(--color-border-divider)}.dot:nth-child(1){animation:dot1 var(--total-duration) ease-in-out infinite}.dot:nth-child(2){animation:dot2 var(--total-duration) ease-in-out infinite}.dot:nth-child(3){animation:dot3 var(--total-duration) ease-in-out infinite}.dot:nth-child(4){animation:dot4 var(--total-duration) ease-in-out infinite}.dot:nth-child(5){animation:dot5 var(--total-duration) ease-in-out infinite}@keyframes dot1{0%,18%{border-radius:500px;width:16px;background:var(--color-brand-primary)}20%,to{width:8px;background:var(--color-border-divider)}}@keyframes dot2{0%,19%{width:8px;background:var(--color-border-divider)}21%,38%{border-radius:500px;width:16px;background:var(--color-brand-primary)}40%,to{width:8px;background:var(--color-border-divider)}}@keyframes dot3{0%,39%{width:8px;background:var(--color-border-divider)}41%,58%{border-radius:500px;width:16px;background:var(--color-brand-primary)}60%,to{width:8px;background:var(--color-border-divider)}}@keyframes dot4{0%,59%{width:8px;background:var(--color-border-divider)}61%,78%{border-radius:500px;width:16px;background:var(--color-brand-primary)}80%,to{width:8px;background:var(--color-border-divider)}}@keyframes dot5{0%,79%{width:8px;background:var(--color-border-divider)}81%,97%{border-radius:500px;width:16px;background:var(--color-brand-primary)}99%,to{width:8px;background:var(--color-border-divider)}}
