.hero-background:before{width:100vw;height:100vh;position:absolute;inset:0;z-index:-1;background-image:url(/assets/hero.jpeg);background-size:cover;background-repeat:no-repeat;content:"";background-position:top center}.hero-background:after{content:"";position:absolute;inset:0;z-index:-1;background:#00000086;height:100vh}.item{position:absolute;top:50%;width:150px;height:200px;border-radius:20px;background-position:50% 50%;background-size:cover;display:inline-block;transform:translateY(-50%);transition:1s}.slide .item:nth-child(1),.slide .item:nth-child(2){top:0;left:0;transform:translate(0);border-radius:0;width:100%;height:100%}.slide .item:nth-child(3){left:calc(50% + 175px);box-shadow:0 30px 50px #505050}.slide .item:nth-child(4){left:calc(50% + 350px);box-shadow:0 30px 50px #505050}.slide .item:nth-child(n+5){left:calc(50% + 500px);opacity:0}.item .content{position:absolute;top:50%;left:100px;width:600px;text-align:left;display:none}.slide .item:nth-child(2) .content{display:block}.background{display:none}.slide .item:nth-child(2) .background{display:block}.content{top:10%}.content .name{font-size:40px;text-transform:uppercase;font-weight:700;opacity:0;animation:animate 1s ease-in-out 1 forwards}.content .des{margin-top:10px;margin-bottom:20px;opacity:0;animation:animate 1s ease-in-out .3s 1 forwards}.content button{padding:10px 20px;border:none;cursor:pointer;opacity:0;animation:animate 1s ease-in-out .6s 1 forwards}@keyframes animate{0%{opacity:0;transform:translateY(10px);filter:blur(33px)}to{opacity:1;transform:translate(0);filter:blur(0)}}
