@import"https://fonts.googleapis.com/css2?family=Jura:wght@300..700&display=swap";@import"https://fonts.googleapis.com/css2?family=Jura:wght@300..700&family=Permanent+Marker&display=swap";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;vertical-align:baseline;font-family:Jura,sans-serif;font-optical-sizing:auto;font-style:normal}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:root{--main: #d6edff;--main-dark: #80c7ff;--background: #2f6690;--text-dark: #040405;--text: #fff;--power-light: #f4e76e;--main20: rgba(214, 237, 255, .2) }body{background:left / cover no-repeat url(/assets/bg-BkUOSHEH.png);overflow-x:hidden;background-color:var(--text-dark);color:var(--text);width:100vw}#root{position:relative;overflow-x:clip;width:100vw}h1{color:var(--text);font-size:80px;font-weight:900;margin:16px}h2{color:var(--text);font-size:64px;font-weight:700;width:100%}h3{color:var(--text);font-size:32px;font-weight:700;width:100%}h4{color:var(--text);font-size:24px;font-weight:700}p,a,li{color:var(--text);font-size:20px;font-weight:400}a{color:var(--text)}a:hover,a:focus{color:var(--main)}::selection{background-color:var(--main);color:var(--text-dark)}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--text-dark)}::-webkit-scrollbar-thumb{background:var(--main);width:4px}::-webkit-scrollbar-thumb:hover{background:var(--main-dark)}header{display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;width:100vw;height:100vh;gap:64px;margin-bottom:30vh}header:after{position:absolute;content:"";z-index:-1;bottom:-50vh;height:50vh;width:100vw;background:linear-gradient(var(--text-dark) 0%,rgba(0,0,0,0) 100%)}#home{display:flex;justify-content:center;align-items:center}#home .title{display:flex;flex-direction:column;justify-content:center;gap:56px;padding:10% 5%;width:90%;height:100%}#home .title button{width:fit-content;margin-left:32px}@media (max-width: 600px){#home .title button{margin-left:0}}.three-scene{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:-1}.three-scene.active{z-index:5;position:fixed}section{max-width:1440px;justify-self:center}#portfolio{display:flex;flex-direction:column;align-items:center;position:relative;width:100%;gap:64px;margin:256px 0;padding-top:16px}#portfolio h2{padding:0 80px;width:100%;box-sizing:border-box}.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(200px,1fr));gap:32px;padding:0 160px}@media (max-width: 1024px){.portfolio-grid{grid-template-columns:repeat(2,minmax(200px,1fr));padding:0 100px}#portfolio h2{padding:0 40px}}@media (max-width: 768px){.portfolio-grid{grid-template-columns:repeat(1,minmax(200px,1fr));padding:0 40px}#portfolio h2{padding:0 20px}}#contact{display:flex;justify-content:space-evenly;align-items:center;position:relative;margin:256px 0;padding-top:24px;width:100%}#contact article{display:flex;flex-direction:column;align-items:center;width:50%;padding:0 80px;gap:56px}.social{display:flex;flex-direction:column;width:100%}.social li{width:fit-content}.social a{text-decoration:none;display:flex;align-items:center;gap:8px;padding:8px 0}form{display:flex;flex-direction:column;width:75%;padding:16px;gap:16px}form>*{z-index:2}@media (max-width: 1024px){#contact article{padding:0 40px}}@media (max-width: 768px){#contact{flex-direction:column;padding:0;gap:56px}#contact article{width:calc(100% - 40px)}}footer{background:var(--text-dark);display:flex;flex-direction:column;align-items:center;gap:16px;padding:4px 0 128px}footer ul{display:flex;flex-direction:column;gap:12px}.foot{display:flex;justify-content:space-between;width:90%}@media (max-width: 600px){.foot{flex-direction:column;gap:40px}h1{font-size:16vw}}h2{transition:all .3s ease-out;transition-delay:.15s}h2.observed{opacity:1;transform:translate(0)}h2.unobserved{opacity:0;transform:translate(-50%)}h3{transition:all .15s ease-out;transition-delay:.45s}h3.observed{opacity:1;transform:translateY(0)}h3.unobserved{opacity:0;transform:translateY(-50%)}p{transition:all .3s ease-out}p.observed{opacity:1;transform:translate(0)}p.unobserved{opacity:0;transform:translate(-50%)}li{transition:all .3s ease-out;transition-delay:.45s}li.observed{opacity:1;transform:translateY(0)}li.unobserved{opacity:0;transform:translateY(50%)}form button{transition:all .75s ease-out}.text,.email,.textarea{transition:all .45s ease-out}.text{transition-delay:.1s}.textarea{transition-delay:0s}form button.observed,.text.observed,.email.observed,.textarea.observed{opacity:1;transform:translateY(0)}form button.unobserved,.text.unobserved,.email.unobserved,.textarea.unobserved{opacity:0;transform:translateY(50%)}.intro-text{padding:24px;max-width:620px;background:var(--main20);border:4px solid var(--background);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.avatar{position:absolute;right:10%;bottom:5%}.intro{z-index:-1;position:absolute;right:10%;bottom:5%}button{font-family:Jura,sans-serif;font-size:24px;font-weight:700;padding:20px 40px;border:none;color:var(--text-dark);background:var(--main);transition:.15s ease-in;cursor:pointer}button:hover{background:var(--main-dark)}.sticky{position:sticky;display:flex;justify-content:center;align-items:center;z-index:1;padding:0;width:48px;height:48px;top:calc(100% - 80px);left:calc(100% - 80px)}.card{display:flex;flex-direction:column;position:relative;overflow:hidden;border:4px solid var(--background);aspect-ratio:384/464;cursor:pointer}.card img{width:100%;height:100%;object-fit:cover}.card h3{position:absolute;text-align:center;height:20%;width:100%;padding-top:32px;color:var(--text);background:linear-gradient(var(--text-dark) 0%,rgba(0,0,0,0) 100%)}.card .button{position:absolute;display:flex;justify-content:center;align-items:center;bottom:0;width:100%;height:20%;gap:20px;opacity:0;background:linear-gradient(rgba(0,0,0,0) 0%,var(--text-dark) 100%);transition:.1s ease-in}.button a{display:flex;height:fit-content;aspect-ratio:1/1;padding:12px;background:var(--main);color:var(--text-dark);opacity:0;transform:translateY(100%);transition:.3s ease-in-out}.card:hover .button{opacity:1}.card:hover a{opacity:1;transform:translateY(0)}.card:hover a:hover{background:var(--main-dark)}@media (min-width: 1025px){.card{opacity:0;transform:translateY(50%);transition:transform .3s ease-out,opacity .3s ease-out;transition-delay:.45s}.card.observed{opacity:1;transform:translateY(0)}.card.unobserved{opacity:0;transform:translateY(50%)}.card:nth-child(1){transition-delay:.15s}.card:nth-child(2){transition-delay:.3s}}.tag{font-weight:900;letter-spacing:-.1em;width:fit-content;padding:8px 12px;margin:4px 8px;border:2px solid transparent;color:var(--main);background:var(--background);transition:.15s ease-in}.tag:hover{filter:drop-shadow(0 0 8px var(--main))}.tag.selected{border-color:var(--main)}.med-card{display:flex;flex-direction:column;box-sizing:border-box;border:4px solid var(--background);gap:24px;padding:16px 24px;max-width:1016px;width:100%;background:var(--main20);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:.15s ease-in}@media (max-width: 1024px){.med-card{visibility:hidden}}#portfolio .med-card h2{font-size:32px;padding:0}.med-card-title{display:flex;justify-content:space-between;align-items:center}.med-card-content{display:flex;gap:16px}.med-card-title ul{display:flex}.med-card-content img{object-fit:cover;aspect-ratio:16/9;width:25%}.med-card-desc p{font-size:16px}.med-card-desc h4{font-size:24px}.med-card.hidden,.med-card.slide-out{transform:translateY(100%);opacity:0}.med-card.slide-in{transform:translateY(0);opacity:1}.carousel{display:flex;justify-content:space-between;overflow-y:hidden;width:100%;height:100%;gap:24px}.carousel-content{display:flex;gap:24px;width:100%}.img{display:flex;justify-content:center;align-items:center;width:50%}.img img{width:100%;height:100%;object-fit:cover}.carousel-desc{display:flex;flex-direction:column;max-width:50%;gap:16px}.carousel-desc-header{display:flex;justify-content:space-between;align-items:center}.carousel-desc-header ul{display:flex;gap:12px}.carousel-controls{display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;gap:12px;height:100%;width:36px;cursor:pointer}.carousel-controls:before{content:"";position:absolute;z-index:0;top:50%;left:50%;width:4px;height:100%;transform:translate(-50%,-50%);background:var(--background)}.carousel-controls-img{object-fit:cover;z-index:1;width:20px;height:20px;border:2px solid var(--background);transition:.15s ease-in}.carousel-controls-img.selected{width:32px;height:32px;border:2px solid var(--background);transition:.15s ease-in}.carousel-controls-img:hover{width:32px;height:32px}.description-large{overflow-y:scroll}.description-large::-webkit-scrollbar{width:2px}.carousel-desc-header a{display:flex;height:fit-content;aspect-ratio:1/1;padding:12px;background:var(--main);color:var(--text-dark);transition:.3s ease-in-out}.carousel-desc-header a:hover{background:var(--main-dark)}@media (max-width: 768px){.carousel-content{flex-direction:column;width:100%}.carousel{gap:12px}.img{width:100%;height:50%}.carousel-desc{max-width:100%;height:calc(50% - 24px)}.description-large{height:100%;overflow-y:scroll}}.large-card{box-sizing:border-box;position:fixed;max-width:none;top:0;left:0;z-index:3;width:100vw;height:100vh;padding:3%;background:#000000e6;will-change:transform,opacity;transform:scale(.5);opacity:0;visibility:hidden;transition:.15s ease-in}.large-card.visible{transform:scale(1);visibility:visible;opacity:1}.large-card-content{display:flex;flex-direction:column;box-sizing:border-box;position:relative;width:100%;height:100%;padding:32px 40px;gap:40px;background:var(--main20);border:4px solid var(--background)}.large-card-title{display:flex;justify-content:space-between;width:100%}.large-card-header{display:flex;flex-direction:column;gap:20px;width:100%}.large-card-header ul{display:flex;position:relative;gap:16px;width:calc(100% - 40px);overflow-x:scroll}.large-card-header ul::-webkit-scrollbar{height:0px}.large-card-header .tag{margin:0}.tag-desc-container{max-width:40%;display:flex;gap:24px}.tag-desc{display:flex;flex-direction:column;word-break:break-all;width:100%;padding:16px 20px;gap:8px;background:var(--background);border:2px solid var(--main)}.close-tab{display:flex;justify-content:center;align-items:center;width:40px;height:40px;color:var(--background);cursor:pointer}@media (max-width: 1024px){.large-card-content{padding:16px 12px;gap:24px}.tag-desc-container{max-width:55%}}@media (max-width: 768px){.large-card-title{flex-direction:column;gap:24px}.tag-desc-container{max-width:100%;position:relative}.close-tab{position:absolute;z-index:2;top:-64px;right:0}}label{font-size:24px;font-weight:700}.text,.email,.textarea{display:flex;flex-direction:column;gap:8px}textarea{font-size:20px;resize:vertical;min-height:64px;max-height:250px;height:150px;width:100%;padding:4px;color:var(--text-dark);background:var(--main);border:4px solid var(--main);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}textarea:focus{outline:none;border:4px solid var(--main-dark)}input[type=text],input[type=email]{font-size:20px;padding:4px;width:100%;color:var(--text-dark);background:var(--main);border:4px solid var(--main);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}input[type=text]:focus,input[type=email]:focus{outline:none;border:4px solid var(--main-dark)}.infinit-slider{background:var(--text-dark);width:100%;margin-bottom:24px;white-space:nowrap;overflow:hidden;display:flex}.slider{font-size:24px;line-height:120%;flex:0 0 100%;width:max-content;will-change:transform;animation:infiniteSlide 10s linear infinite}@keyframes infiniteSlide{0%{transform:translate(0)}to{transform:translate(-100%)}}.slider-container{position:absolute;left:60%;z-index:-1;color:var(--text-dark);transition:.15s ease-in}.slide-out{transform:translate(100%);opacity:0}.slide-in{transform:translate(0);opacity:1}.ui,.boss-ui,.quit-game{opacity:0;position:absolute;transition:opacity .5s ease-in-out}.active{opacity:1}.quit-game{top:24px;right:24px;padding:12px 20px}.ui{height:64px;bottom:32px;left:32px;display:flex;justify-content:space-around;align-items:baseline;gap:12px}.profil{position:absolute;left:0;bottom:8px;width:96px;height:96px;background:var(--main);border-radius:50%;border:2px solid var(--background)}.profil img{width:100%;height:100%;object-fit:cover;border-radius:50%}.lifebar{width:20vw;height:8px;z-index:1;background:var(--background);border:2px solid var(--background)}.lifepoint{height:100%;background:var(--main)}.moveset{width:56px;height:56px;background:var(--background);border-radius:50%;border:2px solid var(--background);display:flex;justify-content:center;align-items:center}.moveset img{object-fit:contain;height:50px}.moveset.dash,.moveset.attack{background:var(--main-dark)}.boss-ui{top:24px;left:50%;transform:translate(-50%);display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;gap:12px}.boss-name{font-weight:900;font-size:32px;font-family:Permanent Marker,serif;letter-spacing:4px}.boss-hp{width:30vw;height:8px;background:var(--background);border:2px solid var(--background)}.boss-health{height:100%;background:var(--main)}.game-win,.game-over{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:32px}.game-win form{width:100%;padding:0}.power-up{width:48px;height:48px;border-radius:50%;filter:drop-shadow(0px 0px 8px var(--power-light));cursor:pointer}.power-up.unactive{display:none}.power-up{position:absolute;left:50%;transform:translate(-50%)}.power-up-icon{width:48px;height:48px}.power-up-icon img{width:48px;object-fit:scale-down}#contact .power-up{position:absolute;z-index:1;top:75%;left:auto}.description-large .power-up{position:relative;right:-90%;left:auto;transform:translateY(-60%)}