.process-demo{position:relative;background:#dce4d5;min-height:650px;overflow:hidden}.demo-stage{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease;display:flex;align-items:center;justify-content:center}.demo-stage.active{opacity:1;visibility:visible}.demo-kicker{position:absolute;top:7%;left:7%;font-size:10px;font-weight:700;letter-spacing:.15em;color:#315e4d}.demo-module{position:relative;width:230px;height:112px;border-radius:50%;background:repeating-linear-gradient(104deg,#282820 0 6px,#635946 7px 13px,#3b392e 14px 19px);border:11px solid #34342b;box-shadow:inset 0 13px 8px #ffffff29,inset 0 -16px 12px #00000055;z-index:3}.demo-module i{position:absolute;width:29%;height:23%;border-radius:50%;background:#181914;left:35.5%;top:13%}.demo-message{position:absolute;left:7%;right:7%;bottom:12%;background:#f8f6f0;padding:20px 22px;display:flex;justify-content:space-between;gap:24px;align-items:center;border:1px solid #bdc8bb}.demo-message b{font:25px "Libre Caslon Display",serif;font-weight:400}.demo-message span{max-width:290px;font-size:11px;line-height:1.6;color:#66716a}.demo-dim{position:absolute;font-size:10px;color:#315e4d;font-weight:700}.demo-width{width:280px;text-align:center;border-top:1px solid #315e4d;padding-top:8px;top:24%}.demo-width:before,.demo-width:after{content:"";position:absolute;top:-5px;width:1px;height:9px;background:#315e4d}.demo-width:before{left:0}.demo-width:after{right:0}.demo-height{right:13%;height:130px;border-left:1px solid #315e4d;padding-left:10px;display:flex;align-items:center}.demo-height:before,.demo-height:after{content:"";position:absolute;left:-5px;width:9px;height:1px;background:#315e4d}.demo-height:before{top:0}.demo-height:after{bottom:0}.demo-seed{position:absolute;top:19%;width:30px;height:47px;background:#9a6943;border-radius:75% 25% 70% 30%;transform:rotate(27deg);z-index:4;animation:dropSeed 3.2s ease-in-out infinite}.phase-seed .demo-module,.demo-stage[data-stage="1"] .demo-module{position:absolute;top:49%}.demo-fall{position:absolute;top:29%;height:130px;border-left:1px dashed #718578}@keyframes dropSeed{0%,18%{transform:translateY(0) rotate(27deg)}65%,100%{transform:translateY(135px) scale(.62) rotate(27deg)}}.demo-water{position:absolute;top:13%;display:flex;gap:37px}.demo-water i{width:22px;height:32px;background:#739eaa;border-radius:60% 40% 60% 40%;transform:rotate(45deg);animation:waterFall 1.8s ease-in infinite}.demo-water i:nth-child(2){animation-delay:.35s}.demo-water i:nth-child(3){animation-delay:.7s}@keyframes waterFall{from{transform:translateY(0) rotate(45deg);opacity:0}30%{opacity:1}to{transform:translateY(125px) rotate(45deg);opacity:0}}.demo-soil{position:absolute;left:0;right:0;bottom:0;height:54%;background:linear-gradient(#8a7a60,#514b3e);display:grid;place-items:start center;padding-top:25px}.demo-soil .demo-module{transform:scale(.78);box-shadow:inset 0 13px 8px #ffffff29,inset 0 -16px 12px #00000055,0 18px 30px #302a2255}.demo-photo img{width:100%;height:100%;object-fit:cover;object-position:center 60%}.demo-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0002 0,#0000 45%,#0006 100%)}.demo-photo .demo-kicker{color:white;z-index:2;text-shadow:0 1px 8px #000}.demo-photo .demo-message{z-index:2}.demo-nav{position:absolute;z-index:6;right:6%;top:6%;display:flex;gap:6px}.demo-nav button{width:36px;height:31px;border:1px solid #315e4d;background:#f8f6f099;color:#315e4d;font-size:9px;cursor:pointer}.demo-nav button.active{background:#16362b;color:white}.process-demo:hover .demo-stage{animation-play-state:paused}@media(max-width:800px){.process-demo{min-height:600px}.demo-module{transform:scale(.82)}.demo-message{display:block}.demo-message b{display:block;margin-bottom:7px}.demo-width{top:22%;width:230px}.demo-height{right:7%}}