/* A cinematic stage with a quiet, tactile interface. */
.hero{min-height:790px}.hero>.hero-art{display:none}.scene-stage{position:absolute;inset:-4%;transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform 1.2s ease-out}.scene{position:absolute;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.1);transition:opacity 1.4s,transform 9s ease-out}.scene.active{opacity:1;transform:scale(1);animation:scene-drift 22s ease-in-out infinite alternate}.wonder-dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hero-shade{pointer-events:none}.hero-copy,.hero-top,.hero-caption{z-index:2}.hero-copy{bottom:170px}.hero h1{max-width:1020px}.hero h1::first-line{color:#e4f7a6}.scene-controls{position:absolute;z-index:3;bottom:66px;left:4.2%;right:4.2%;display:flex;justify-content:space-between;align-items:center;gap:16px}.scene-picker{display:flex;gap:9px}.scene-picker button,.motion-toggle{color:white;background:#111a163d;border:1px solid #ffffff45;border-radius:30px;padding:12px 18px;font-size:11px;backdrop-filter:blur(12px)}.scene-picker span{margin-inline-start:9px}.scene-picker button.selected{background:#d7f16d;color:#172015;border-color:#d7f16d}.motion-toggle{font-size:10px}.motion-ribbon{overflow:hidden;background:#d7f16d;padding:20px 0;border-bottom:1px solid #b4c965}.motion-ribbon>div{display:flex;width:max-content;animation:ribbon 44s linear infinite}.motion-ribbon span{display:flex;align-items:center;gap:32px;padding-inline-end:32px;font:600 27px Manrope,'Noto Sans Arabic',sans-serif;white-space:nowrap;letter-spacing:-1px}.motion-ribbon i{font-style:normal;font-size:33px}.project-img{transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .4s ease-out;border-radius:4px}.project-arrow{transition:transform .3s,background .3s}.project:hover .project-arrow{transform:rotate(45deg);background:#d7f16d}.reveal{opacity:0;transform:translateY(32px);transition:opacity .9s,transform .9s}.reveal.revealed{opacity:1;transform:translateY(0)}.process article:nth-child(2){transition-delay:.1s}.process article:nth-child(3){transition-delay:.2s}.service:hover h3{transform:translateX(7px)}.service h3{transition:transform .3s}.motion-paused .scene,.motion-paused .motion-ribbon>div{animation-play-state:paused}.motion-paused .scene-stage,.motion-paused .project-img{transform:none}.motion-paused .wonder-dust{opacity:0}.motion-paused .reveal{opacity:1;transform:none;transition:none}
@keyframes scene-drift{from{transform:scale(1) translateY(0)}to{transform:scale(1.07) translateY(-1%)}}@keyframes ribbon{to{transform:translateX(-25%)}}
@media(max-width:800px){.hero{min-height:740px}.hero-copy{bottom:178px}.scene-controls{left:6%;right:6%;bottom:70px}.scene-picker{gap:5px}.scene-picker button{padding:11px 12px}.motion-toggle{padding:11px 10px}.motion-ribbon{padding:14px 0}.motion-ribbon span{font-size:22px;gap:22px;padding-inline-end:22px}}
@media(max-width:480px){.scene-picker span{margin-inline-start:4px}.scene-picker button{font-size:10px;padding:10px}.motion-toggle{font-size:9px;padding:10px 8px}.scene-controls{gap:8px}.hero h1{font-size:43px}.hero-top{padding-top:24px}}
@media(prefers-reduced-motion:reduce){.scene-stage,.scene.active,.project-img{transform:none!important}.reveal{opacity:1;transform:none}.wonder-dust{display:none}.scene,.motion-ribbon>div{animation:none!important}}