/* SVG and compositor transforms keep the botanical artwork crisp at every size. */
.human .garden{isolation:isolate;overflow:clip}
.garden::before,.garden::after{content:"";position:absolute;inset:-20%;pointer-events:none;z-index:-1;animation-play-state:paused}
.garden::before{background:radial-gradient(ellipse at 28% 30%,#f3e4cbb3,transparent 55%);animation:organic-light 17s ease-in-out infinite alternate paused}
.garden::after{background:radial-gradient(ellipse at 70% 70%,#86a78766,transparent 60%);animation:organic-light 23s ease-in-out -7s infinite alternate-reverse paused}
.garden-art{position:relative;z-index:1}
.garden-note{z-index:2}
.garden-sun{transform:translate(calc(var(--pointer-x,0px) * -.7),calc(var(--pointer-y,0px) * -.7))}
.garden-plant{transform:translate(var(--pointer-x,0px),var(--pointer-y,0px))}
.garden-flower{transform:translate(calc(var(--pointer-x,0px) * .3),calc(var(--pointer-y,0px) * .3))}
.garden-dots{transform:translate(calc(var(--pointer-x,0px) * -.3),calc(var(--pointer-y,0px) * -.3))}
.leaf{transform-box:fill-box;animation:leaf-sway 8s ease-in-out infinite alternate paused}
.leaf-left{transform-origin:100% 100%}
.leaf-right{transform-origin:0% 100%;animation-duration:10s;animation-delay:-4s}
.garden.is-visible::before,.garden.is-visible::after,.garden.is-visible .leaf{animation-play-state:running}
.motion-ready .draw-line{stroke-dasharray:1;stroke-dashoffset:1}
.motion-ready .has-grown .draw-line{animation:line-grow 1.8s ease-out both}
.process-growth{position:relative}
.process-trail{display:block;width:100%;height:40px;color:#6f9276;margin-bottom:20px;overflow:visible}
.mobile-trail{display:none}
.human .card{transition:transform .25s ease,box-shadow .25s ease}
.human .btn span{transition:transform .25s ease}
@media(hover:hover) and (pointer:fine){.human .card:hover{transform:translateY(-4px);box-shadow:0 14px 30px #173f3510}.human .btn:hover span{transform:translate(3px,-3px)}}
@keyframes leaf-sway{from{transform:rotate(-1.6deg)}to{transform:rotate(1.6deg)}}
@keyframes organic-light{from{transform:translate(-3%,-2%) rotate(-8deg)}to{transform:translate(5%,4%) rotate(8deg)}}
@keyframes line-grow{to{stroke-dashoffset:0}}
.motion-paused .garden::before,.motion-paused .garden::after,.motion-paused .leaf,.motion-paused .draw-line{animation-play-state:paused!important}
@media(max-width:700px){.desktop-trail{display:none}.mobile-trail{display:block;position:absolute;left:0;top:0;width:14px;height:100%;margin:0}.process-growth .steps{padding-left:28px}}
@media(prefers-reduced-motion:reduce){.garden::before,.garden::after,.leaf,.draw-line{animation:none!important}.garden-sun,.garden-plant,.garden-flower,.garden-dots,.leaf{transform:none!important}.motion-ready .draw-line{stroke-dashoffset:0}.human .card,.human .btn span{transition:none}}

.human{--muted:#445b51}.human .code-lines,.human .steps span{color:#365747}
.motion-toggle{position:absolute;top:20px;left:50%;transform:translateX(-50%);z-index:2;border:1px solid #173f3533;border-radius:20px;padding:6px 12px;background:#f6f4efd9;color:#173f35;font-size:10px}
@media(prefers-reduced-motion:reduce){.motion-toggle{display:none}}

.falling-leaves{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
