/* Fill wide desktop screens while preserving the approved design proportions. */
html,body{background:#ececec}
.desktop{margin:0;zoom:var(--desktop-scale,1)}
.banner{perspective:1200px}
#hero-title,.headline-highlight,.intro,.founder-proof{translate:0 var(--hero-offset,0px)}
.cloud-left{transform:translate3d(calc(var(--cloud-spread,0px) * -1),var(--cloud-offset,0px),0) scaleX(-1)}
.cloud-right{transform:translate3d(var(--cloud-spread,0px),var(--cloud-offset,0px),0)}
.banner-media{transform:translate3d(0,var(--media-offset,0px),0) scale(var(--media-scale,1));transform-origin:50% 0;border-radius:var(--media-radius,32px);will-change:transform;box-shadow:0 -20px 70px #0000000a}
.hero-cta{translate:0 var(--cta-offset,0px)}
.motion-word{display:inline-block;font-style:normal;transform-origin:50% 100%;will-change:transform,opacity}
.motion-ready .reveal-heading:not(.is-visible) .motion-word{opacity:0;transform:translate3d(0,44px,0) rotateX(18deg);filter:blur(5px)}
.motion-ready .reveal-heading.is-visible .motion-word{animation:word-rise .9s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--word-index,0) * 45ms)}
@keyframes word-rise{from{opacity:0;transform:translate3d(0,44px,0) rotateX(18deg);filter:blur(5px)}to{opacity:1;transform:translate3d(0,0,0) rotateX(0);filter:blur(0)}}
.motion-ready .reveal-block{opacity:0;transform:translate3d(0,36px,0);transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1);transition-delay:var(--reveal-delay,0ms)}
.motion-ready .reveal-block.is-visible{opacity:1;transform:translate3d(0,0,0)}
/* The exported blue highlights reveal with their matching headings. */
.motion-ready .heading-accent{clip-path:inset(0 100% 0 0);transition:clip-path .85s cubic-bezier(.16,1,.3,1) .1s}
.motion-ready .heading-accent.is-visible{clip-path:inset(0 0 0 0)}
.button,.plan-button,.send-button{position:relative;isolation:isolate;overflow:hidden;transform:translate3d(var(--magnet-x,0px),var(--magnet-y,0px),0);transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,background-color .35s ease;will-change:transform}
/* Restore the positions of the existing, absolutely placed CTAs. */
.header-cta,.hero-cta,.comparison-cta,.faq-help .button,.plan-button{position:absolute}
.button::before,.plan-button::before,.send-button::before{content:"";position:absolute;inset:-90% -35%;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#ffffff42 48%,#ffffff0d 58%,transparent 70%);transform:translateX(-100%) rotate(-8deg);transition:transform .65s cubic-bezier(.2,.8,.2,1)}
.button:hover,.button:focus-visible{background-color:#1266ff;box-shadow:inset 0 1px 0 #ffffff70,inset 0 -3px 0 #003495,0 8px 16px #0059ff40,0 24px 38px #0059ff26,0 3px 3px #00000026;transform:translate3d(var(--magnet-x,0px),calc(var(--magnet-y,0px) - 5px),0) scale(1.025)}
.button:hover::before,.button:focus-visible::before,.plan-button:hover::before,.plan-button:focus-visible::before,.send-button:hover::before{transform:translateX(100%) rotate(-8deg)}
.button img{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.button:hover img,.button:focus-visible img{transform:translateX(5px) rotate(-35deg)}
.plan-button>span{transition:transform .4s cubic-bezier(.2,.8,.2,1),background-color .3s}
.plan-button:hover>span,.plan-button:focus-visible>span{transform:rotate(-35deg) scale(1.08)}
.plan-button:hover,.send-button:hover{transform:translate3d(var(--magnet-x,0px),calc(var(--magnet-y,0px) - 3px),0);box-shadow:0 10px 24px #0059ff25}
.button:active,.plan-button:active,.send-button:active{transform:translate3d(0,0,0) scale(.98)}
nav a{position:relative}
nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;background:#0059ff;transform:scaleX(0);transform-origin:right;transition:transform .3s ease}
nav a:hover::after,nav a:focus-visible::after{transform:scaleX(1);transform-origin:left}
.work-card img{transition:scale .7s cubic-bezier(.2,.8,.2,1)}
.work-card:hover img{scale:1.04}
.process-card{transition:box-shadow .35s ease}
.process-card:hover{box-shadow:inset 0 4px 0 #ffffff99,inset 0 -8px 0 #0000000d,0 14px 30px #0059ff16}
.process-icon{transition:translate .5s cubic-bezier(.16,1,.3,1),rotate .5s cubic-bezier(.16,1,.3,1)}
.process-card:hover .process-icon{translate:0 -7px;rotate:-5deg}
.status-dot{animation:status-pulse 3s ease-in-out infinite}
@keyframes status-pulse{0%,100%{box-shadow:0 0 0 0 #61c55435}60%{box-shadow:0 0 0 7px #61c55400}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .motion-ready .reveal-heading .motion-word,.motion-ready .reveal-block{opacity:1!important;transform:none!important;filter:none!important}
 .motion-ready .heading-accent{clip-path:none!important}
 #hero-title,.headline-highlight,.intro,.founder-proof,.hero-cta{translate:none}
 .cloud-left{transform:scaleX(-1)}.cloud-right,.banner-media{transform:none}
 .button:hover,.plan-button:hover,.send-button:hover{transform:none}
}
