.project-hero{width:100%;height:400px;background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:var(--negro) 0 10px 15px -3px,var(--boxShadow2) 0 4px 6px -2px}.project-content{display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%;gap:20px;padding:0;color:var(--blanco)}@media screen and (min-width:768px){.project-content{flex-direction:row;align-items:flex-end;gap:10px}}.project-info{width:100%;padding:20px;box-shadow:var(--negro) 0 10px 15px -3px,var(--boxShadow2) 0 4px 6px -2px}@media screen and (min-width:768px){.project-info{width:auto}}.project-name{margin:0!important}.work-description{margin:10px 0 0;font-size:17px!important}.cafete{background-image:url(/imgs/CafeTe.png)}.tattqian{background-image:url(/imgs/Tattqian.png)}.apv{background-image:url(/imgs/APVLian.png)}.nyanusic{background-image:url(/imgs/nyanusic.png)}.VUvuCRM{background-image:url(/imgs/VUvuCRM.png)}.project-content-max{width:100%;display:flex;flex-direction:column;gap:20px}@media screen and (min-width:768px){.project-content-max{width:70%}}.projectSection{width:100%;margin:auto;height:auto;display:flex;flex-direction:column;gap:20px;padding:30px;align-items:center;justify-content:center;background:linear-gradient(to bottom,#e8d4b8,#cfb890);position:relative;overflow:hidden;color:var(--blanco)}@media screen and (min-width:768px){.projectSection{flex-direction:column;height:100dvh;gap:20px;padding:0}}.projectSection:before{content:"";position:absolute;top:-25%;left:-25%;width:150%;height:150%;background:radial-gradient(circle at 20% 50%,#cfb890 0%,transparent 90%),radial-gradient(circle at 60% 70%,#c7aa78 0%,transparent 90%),radial-gradient(circle at 80% 20%,#d4915e 0%,transparent 90%),radial-gradient(circle at 40% 80%,#cfb890 0%,transparent 90%),radial-gradient(circle at 90% 60%,#c7aa78 0%,transparent 90%);animation:lavaLamp 20s ease-in-out infinite;opacity:.5;z-index:0}.projectSection:after{content:"";position:absolute;top:-25%;left:-25%;width:150%;height:150%;background:radial-gradient(circle at 70% 30%,#d4915e 0%,transparent 90%),radial-gradient(circle at 30% 60%,#cfb890 0%,transparent 90%),radial-gradient(circle at 50% 90%,#c7aa78 0%,transparent 90%);animation:lavaLamp 15s ease-in-out infinite reverse;opacity:.4;z-index:0}.projectSection>*{position:relative;z-index:1}@keyframes lavaLamp{0%,to{transform:translate(0) rotate(0)}33%{transform:translate(20px,-30px) rotate(120deg)}66%{transform:translate(-15px,15px) rotate(240deg)}}@media(max-width:768px){.projectSection:before{top:-15%;left:-15%;width:130%;height:130%;background:radial-gradient(circle at 20% 50%,#cfb890 0%,transparent 90%),radial-gradient(circle at 70% 70%,#c7aa78 0%,transparent 90%),radial-gradient(circle at 85% 25%,#d4915e 0%,transparent 90%);opacity:.4}.projectSection:after{top:-15%;left:-15%;width:130%;height:130%;background:radial-gradient(circle at 75% 35%,#d4915e 0%,transparent 90%),radial-gradient(circle at 25% 65%,#cfb890 0%,transparent 90%);opacity:.3}@keyframes lavaLamp{0%,to{transform:translate(0) rotate(0)}33%{transform:translate(10px,-20px) rotate(120deg)}66%{transform:translate(-10px,10px) rotate(240deg)}}}.project-tags{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;margin:0;padding:0}.project-tag-li{padding:7px;box-shadow:var(--negro) 0 10px 15px -3px,var(--boxShadow2) 0 4px 6px -2px}.project-tag{display:flex;flex-direction:row;align-items:center;gap:10px;font-weight:900;font-size:13px}.project-tag-icon{width:25px;height:25px}@media screen and (min-width:768px){.project-tag-li{padding:10px}.project-tag{font-size:16px!important}}.project-description-content{width:100%;padding:20px;box-shadow:var(--negro) 0 10px 15px -3px,var(--boxShadow2) 0 4px 6px -2px;color:var(--negro);line-height:25px}.project-description-info{font-size:13px;color:var(--blanco);font-weight:900}@media screen and (min-width:768px){.project-description-info{font-size:16px}}.project-link{display:block;width:fit-content;align-items:flex-end;color:var(--blanco);padding:10px;box-shadow:var(--negro) 0 10px 15px -3px,var(--boxShadow2) 0 4px 6px -2px;text-decoration:none;font-size:18px;font-weight:900;margin:0 0 10px auto;transition-property:all;transition-duration:.5s}.project-link:hover{scale:1.05}
