@import "https://fonts.googleapis.com/css2?family=Bagel+Fat+One&family=Funnel+Display:wght@300;400;500&display=swap";@import "https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&family=Pixelify+Sans&display=swap";@import "https://fonts.googleapis.com/css2?family=Cherry+Bomb+One&family=Sour+Gummy:ital,wght@0,100..900;1,100..900&family=Story+Script&display=swap";:root{--text-size-small:.8rem;--text-size-medium-small:.9rem;--text-size-medium:1.1rem;--text-size-large:2rem;--text-size-larger:2.1rem;--icon-size-larger:3rem;--icon-size-large:2.5rem;--icon-size-medium:1.5rem;--icon-size-small:1rem;--border-radius:15px}html{scroll-behavior:smooth}body.light{--color-background:#faebd7;--color-text:black;--gradient-color-1:#e98bc0;--gradient-color-2:#e98bc0;--gradient-color-3:#b0cf97;--primary-color:#d56eb6;--accent-color:#770d4b;--color-muted:black;--color-blur:#db1daf12;--color-card:#d5cbb5}body.dark{--color-background:#2f2d2e;--color-text:#e4d4d4;--gradient-color-1:#0d324d;--gradient-color-2:#0d324d;--gradient-color-3:#792359;--primary-color:#d34ea2;--accent-color:#ea66be;--color-muted:#9b9696;--color-blur:#b9bec114;--color-card:#614054}body{background:radial-gradient(circle at -10% 0%,var(--gradient-color-1),transparent 50%),radial-gradient(circle at 130% 50%,var(--gradient-color-2),transparent 60%),radial-gradient(circle at -100% 100%,var(--gradient-color-3),transparent 100%);background-color:var(--color-background);color:var(--color-text);margin:0;padding-top:80px;transition:background-color 1s,color 1s}h1{text-align:center;font-family:Sour Gummy,sans-serif;font-weight:700;font-size:var(--text-size-larger);padding-top:70px}footer{text-align:center;color:var(--color-muted);margin-top:20px;padding:20px;font-family:Arial,Helvetica,sans-serif;font-size:14px}@media (min-width:1000px){body{--text-size-small:1rem;--text-size-medium-small:1.2rem;--text-size-medium:1.5rem;--text-size-large:2rem;--text-size-larger:2.9rem;--icon-size-larger:6rem;--icon-size-large:2.5rem;--icon-size-medium:3.5rem;--icon-size-small:1.2rem}}@media not (max-width:1500px){body{--icon-size-medium:4rem}}@media not (max-width:1700px){body{--icon-size-medium:5rem}}@media (min-height:751px){body{--icon-size-medium:4rem}}@media (max-height:750px),(max-width:750px){body{--icon-size-medium:3rem}}@media (max-height:650px){body{--icon-size-medium:2.9rem;--text-size-medium:1.45rem}}@media (max-height:550px){body{--icon-size-medium:2.5rem;--text-size-medium:1.25rem}}@media (max-height:400px){body{--icon-size-medium:2rem;--text-size-medium:1.2rem}}header{box-sizing:border-box;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);flex-direction:row;justify-content:space-between;width:100%;padding:1rem;transition:top .15s ease-in-out;display:flex;position:fixed;top:0;left:0}header .name-header{color:var(--color-text);font-family:Bagel Fat One;font-size:xx-large;text-decoration:none;transition:transform 1s}header .right-side{flex-direction:row;justify-content:center;align-items:center;gap:1rem;display:flex}header #toggleMode{font-size:var(--icon-size-large);cursor:pointer;color:inherit;background:0 0;border:none;transition:transform .3s}header #toggleMode:hover{transform:scale(1.2)}.toggleLanguage{color:var(--color-text);font-size:var(--font-size-larger);cursor:pointer;background-color:#0000;border:none;align-items:center;transition:transform .3s;display:flex}.toggleLanguage:hover{transform:scale(1.1)}.start-page-container{flex-direction:column;justify-content:center;align-items:center;gap:10px;height:100vh;padding-top:1rem;display:flex}.start-page-container .text-container{align-items:left;flex-direction:column;justify-content:flex-start;padding-inline:2rem;display:flex}.start-page-container .text-container .text-box-title{color:var(--color-text);flex-direction:column;align-items:center;display:flex;position:relative}.start-page-container .text-container .text-box-title h1{justify-content:center;align-items:center;gap:.5rem;margin:auto;display:flex}.start-page-container .text-container .text-box-title h1 .greeting{display:flex}.start-page-container .text-container .text-box-title h1 .name{color:var(--accent-color)}.start-page-container .text-container .text-box-title .handToggle{cursor:pointer;display:inline-block}.start-page-container .text-container .text-box-title .handToggle.animate{animation:1s ease-in-out wave}.start-page-container .text-container .text-box-title .textContent{width:100%;max-width:400px}.start-page-container .text-container .text-box-title .location{color:var(--color-muted);font-family:Funnel Display,sans-serif;font-size:var(--icon-size-small);text-align:left;align-items:center;gap:5px;width:100%;max-width:400px;margin-top:.5rem;text-decoration:none;display:flex;position:relative}.start-page-container .text-container .text-box-title .location:after{content:"";background-color:currentColor;width:0%;height:1px;position:absolute;bottom:0;left:0}.start-page-container .text-container .text-box-title .location.grow:after{animation:1s ease-in-out forwards underline-grow}.start-page-container .text-container .text-box-title .location.shrink:after{animation:1s ease-in-out forwards underline-shrink}.start-page-container .text-container .text-box{font-family:Funnel Display,sans-serif;font-size:var(--text-size-medium);-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);background-color:var(--color-blur);border-radius:6px;align-items:center;padding:1rem}.start-page-container .image-container{height:60%;position:relative}.start-page-container .image-container .image-border{z-index:9;border:3px solid #000;border-radius:10px;width:100%;height:100%;padding:0 20px;position:absolute;top:25px;left:50%;transform:translate(-50%)}.start-page-container .image-container .ash-pic{z-index:10;height:100%;position:relative}.start-page-container .image-container .image-box{z-index:11;background-color:#000;border-radius:0 0 5px 5px;align-items:center;width:calc(100% + 2px);height:25%;padding:0 20px;display:flex;position:absolute;bottom:-28px;left:50%;transform:translate(-50%)}.start-page-container .image-container .image-box .icon-list{flex-direction:row;justify-content:space-between;padding:0 20px;list-style:none;display:flex;position:absolute;left:0;right:0}.start-page-container .image-container .image-box .icon-list .icon{color:var(--primary-color);font-size:var(--icon-size-medium);box-shadow:none;cursor:pointer;background-color:#0000;border:none;transition:transform .3s}.start-page-container .image-container .image-box .icon-list .icon:hover{transform:scale(1.2)}@media (min-width:1000px){.start-page-container{flex-direction:row-reverse;width:70%;margin:auto;padding-top:0}.start-page-container .text-container .text-box-title h1{gap:.5rem;margin:auto;display:block}.start-page-container .image-container{height:70%}.start-page-container .image-container .image-box{height:20%}}@keyframes underline-grow{0%{width:0%}to{width:55%}}@keyframes underline-shrink{0%{width:55%}to{width:0%}}@keyframes wave{0%{transform:rotate(0)}25%{transform:rotate(20deg)}50%{transform:rotate(-20deg)}75%{transform:rotate(20deg)}to{transform:rotate(0)}}.education-section .timeline{justify-content:center;margin:20px auto;padding:20px;display:flex}.education-section .timeline .outer .card{opacity:0;max-width:400px;transition:all .6s ease-out;position:relative;transform:translateY(40px)}.education-section .timeline .outer .card.show{opacity:1;transform:translateY(0)}.education-section .timeline .outer .card:nth-child(odd){padding:30px 0 30px 30px}.education-section .timeline .outer .card:nth-child(odd) .info .title:before{left:-45px}.education-section .timeline .outer .card:nth-child(2n){padding:30px 30px 30px 0}.education-section .timeline .outer .card:nth-child(2n) .info .title{text-align:right}.education-section .timeline .outer .card:nth-child(2n) .info .title:before{right:-45px}.education-section .timeline .outer .card:nth-child(2n) .info p{text-align:right}.education-section .timeline .outer .card:before{content:"";border:solid var(--accent-color);width:50%;position:absolute}.education-section .timeline .outer .card:nth-child(odd):before{border-width:5px 0 5px 5px;border-radius:50px 0 0 50px;top:-5px;bottom:-4.5px;left:0}.education-section .timeline .outer .card:nth-child(2n):before{border-width:5px 5px 5px 0;border-radius:0 50px 50px 0;top:0;bottom:.5px;right:0}.education-section .timeline .outer .card:first-child:before{border-top:0;border-top-left-radius:0}.education-section .timeline .outer .card:last-child:nth-child(odd):before{border-bottom:0;border-bottom-left-radius:0}.education-section .timeline .outer .card:last-child:nth-child(2n):before{border-bottom:0;border-bottom-right-radius:0}.education-section .timeline .outer .card .info{background:var(--color-blur);color:var(--color-text);border-radius:30px;flex-direction:column;padding:10px;font-family:Funnel Display,sans-serif;display:flex}.education-section .timeline .outer .card .info p{color:var(--color-muted);margin:5px 0 0;padding:5px;font-weight:400}.education-section .timeline .outer .card .info .title{color:var(--accent-color);margin-bottom:2px;font-family:Bagel Fat One;position:relative}.education-section .timeline .outer .card .info .title:before{content:"";border:3px solid var(--primary-color);background:#fff;border-radius:999px;width:10px;height:10px;position:absolute;top:5px}@media (min-width:700px){.education-section .timeline .outer .card .info .title:before{top:15px}.education-section .timeline .outer .card .info h3{font-size:var(--text-size-large)}.education-section .timeline .outer .card .info p{font-size:var(--text-size-medium)}}@media only screen and (max-width:400px){.education-section .outer .card:nth-child(odd):before{top:-5px}.education-section .outer .card:nth-child(2n):before{bottom:.1px}}.skill-section{flex-direction:column;justify-content:center;gap:2rem;display:flex}.skill-section .skill-container{flex-flow:wrap;justify-content:center;gap:1rem;max-width:100%;margin:16px auto;padding:0 1rem;display:flex}.skill-section .skill-container .skill-card{background:var(--color-blur);border-radius:var(--border-radius);opacity:0;width:100px;height:100px;margin:0 auto;transition:transform .3s;position:relative;overflow:hidden;transform:translateY(24px);box-shadow:0 10px 40px #00000024}.skill-section .skill-container .skill-card.show{opacity:1;transform:translateY(0)}.skill-section .skill-container .skill-card .face{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;inset:0}.skill-section .skill-container .skill-card .face.face1{box-sizing:border-box;z-index:1;padding:16px;display:none}.skill-section .skill-container .skill-card .face.face1 .content{font-size:var(--text-size-medium-small);color:var(--color-text);margin:0;padding:0 0 1rem;font-family:Funnel Display}.skill-section .skill-container .skill-card .face.face2{height:100%;color:var(--color-blur);z-index:2;background:0 0;transition:all .5s;inset:auto 0 0}.skill-section .skill-container .skill-card .face.face2:before{content:"";background:var(--color-card);border-radius:var(--border-radius);z-index:0;position:absolute;inset:0}.skill-section .skill-container .skill-card .face.face2 h2{z-index:1;flex-direction:column;align-items:center;margin:0;padding:0;transition:all .5s;display:flex;position:relative}.skill-section .skill-container .skill-card .face.face2 h2 .icon-skill{font-size:var(--icon-size-medium);color:var(--accent-color);transition:all .6s ease-out;display:flex}.skill-section .skill-container .skill-card .face.face2 h2 .icon-skill-text{font-size:var(--text-size-medium);color:var(--accent-color);margin:0;font-family:Funnel Display,sans-serif;transition:all .6s ease-out;display:flex}@media (min-width:700px){.skill-section .skill-container{gap:3.5rem;max-width:1200px;margin:20px auto;padding:0}.skill-section .skill-container .skill-card{width:250px;height:250px;transform:translateY(40px);box-shadow:0 15px 60px #00000025}.skill-section .skill-container .skill-card .face.face1{padding:20px;display:flex}}@media (min-width:500px){.skill-section .skill-container .skill-card .face.face2 h2 .icon-skill{font-size:var(--icon-size-larger)}}@media (hover:hover) and (pointer:fine) and (min-width:700px){.skill-section .skill-container .skill-card:hover .face.face1{padding:20px;display:flex}.skill-section .skill-container .skill-card:hover .face.face2{height:20%;overflow:hidden}.skill-section .skill-container .skill-card:hover .face.face2 h2 .icon-skill{margin:0;padding-top:10px;font-size:clamp(40px,10vw,50px)}.skill-section .skill-container .skill-card:hover .face.face2 h2 .icon-skill-text{opacity:0;padding:0;font-size:clamp(10px,10vw,10px)}}@media (hover:none){.skill-section .skill-container .skill-card:hover .face.face2{height:100%}}.project-section{overflow:hidden}.project-section .card-container{flex-flow:wrap;justify-content:center;gap:15px;max-width:550px;margin:0 auto;padding:10px;display:flex}.project-section .card-container .project-card{background-color:var(--color-card);border-radius:var(--border-radius);border:1px solid #0000;flex-direction:column;align-items:center;gap:15px;width:100%;padding:30px 25px;font-family:Funnel Display,Arial,Helvetica,sans-serif;transition:border .3s;display:flex;box-shadow:0 2px 4px #0000001a}.project-section .card-container .project-card:hover{border:1px solid var(--primary-color)}.project-section .card-container .project-card:hover .project-card-media img{transform:scale(1.05)}.project-section .card-container .project-card h2{margin:0}.project-section .card-container .project-card img{object-fit:cover;width:100%;height:100%;transition:transform .3s}.project-section .card-container .project-card .project-text-section{text-align:left;font-size:var(--text-size-medium);margin:0}.project-section .card-container .project-card .project-text-section p{text-align:left;color:var(--color-text)}.project-section .card-container .project-card .project-card-media{border-radius:var(--border-radius);width:300px;height:200px;overflow:hidden}.project-section .card-container .project-card .project-card-media img{object-fit:cover;width:100%;height:100%;transition:transform .4s;display:block;transform:scale(1)}.project-section .card-container .project-card .bottom-section{justify-content:space-between;align-self:start;width:100%;margin-top:17px;display:flex}.project-section .card-container .project-card .bottom-section .button{border:1px solid var(--color-text);background-color:var(--color-blur);color:var(--color-text);border-radius:var(--border-radius);cursor:pointer;font-size:var(--text-size-small);align-self:flex-end;align-items:center;gap:5px;padding:10px;font-weight:700;text-decoration:none;transition:border-color .3s;display:flex}.project-section .card-container .project-card .bottom-section .button .arrow-forward{transition:transform .3s}.project-section .card-container .project-card .bottom-section .button:hover{border-color:var(--primary-color)}.project-section .card-container .project-card .bottom-section .button:hover .arrow-forward{transform:translate(.25rem)}.project-section .card-container .project-card .bottom-section .tag-section{flex-wrap:wrap;gap:5px;width:50%;display:flex}.project-section .card-container .project-card .bottom-section .tag-section .tag{background-color:var(--color-blur);color:var(--color-text);border:1px solid var(--color-text);font-size:var(--font-size-small);border-radius:99px;gap:5px;margin:0;padding:2px 20px}@media (min-width:700px){.project-section .card-container .project-card{height:100%}.project-section .card-container .project-card .project-text-section{font-size:var(--text-size-medium-small)}}.project-page{flex-direction:column;align-items:center;gap:20px;font-family:Funnel Display,sans-serif;transition:all 1s ease-in;display:flex}.project-page .title-section{flex-direction:column;align-items:center;display:flex}.project-page .title-section .project-title{font-size:var(--text-size-large);align-items:center;gap:5px;margin-bottom:10px;display:flex}.project-page .title-section .project-title .project-title-icon{color:var(--accent-color)}.project-page .title-section .description{text-align:center}.project-page .project-page-card{flex-direction:column;gap:5px;margin:0;padding:20px;display:flex}.project-page .project-page-card.project-page-box{background-color:var(--color-blur);border-radius:var(--border-radius)}.project-page .project-page-card .project-card-title{align-self:flex-start;align-items:center;gap:10px;display:flex}.project-page .project-page-card .project-card-title .project-card-title-icon{color:var(--accent-color)}.project-page .project-page-card .card-description{background-color:var(--color-blur);border-radius:var(--border-radius);padding:20px}.project-page .project-page-card .feature-list{flex-direction:column;align-self:flex-start;gap:10px;width:100%;margin:0;padding:0;list-style:none;display:flex}.project-page .project-page-card .feature-list .feature-item{border-radius:var(--border-radius);background-color:var(--color-blur);align-items:center;gap:20px;padding:10px 20px;display:flex}.project-page .project-page-card .feature-list .feature-item .feature-icon{color:var(--accent-color);font-size:var(--icon-size-large);flex-shrink:.5}.project-page .project-image-section{flex-wrap:wrap;justify-content:space-evenly;display:flex}.project-page .project-image-text-section{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.project-page .project-image-text-section .card-description{align-self:center;height:50%}.project-image-item{border-radius:var(--border-radius);width:70%}.project-image-item.double{align-self:center;width:45%}@media (min-width:1000px){.project-page .project-page-card .feature-list .feature-item .feature-icon{font-size:var(--icon-size-large)}.project-page .project-page-card .project-image-item{border-radius:var(--border-radius);width:50%}.project-page .project-page-card .project-image-item.double{align-self:center;width:45%}.project-page .project-page-card .project-image-text-section{flex-wrap:nowrap;gap:10px;display:flex}.project-page .project-page-card .project-image-text-section .card-description{align-self:center;height:50%}}.tech-stack-body{flex-direction:column;display:flex}.tech-stack-body .tech-stack-title{align-self:center;align-items:center;gap:10px;display:flex}.tech-stack-body .tech-stack{flex-wrap:wrap;justify-content:center;gap:10px;width:100%;padding:0;list-style:none;display:flex}.tech-stack-body .tech-stack .tech-item{border-radius:var(--border-radius);background-color:var(--color-blur);flex-direction:column;align-items:center;gap:10px;padding:10px 15px;display:flex}.tech-stack-body .tech-stack .tech-item .tech-icon{color:var(--accent-color);font-size:var(--icon-size-medium)}.project-content{max-width:700px;margin:0 auto;padding:20px}.project-content .project-back{align-items:center;gap:5px;margin-top:10px;display:flex}.project-content .project-back .project-back-link{color:var(--color-text);align-items:center;gap:5px;font-family:Funnel Display,sans-serif;font-weight:700;text-decoration:none;transition:color .15s;display:flex}.project-content .project-back .project-back-link .back-arrow{transition:transform .15s}.project-content .project-back .project-back-link:hover{color:var(--accent-color)}.project-content .project-back .project-back-link:hover .back-arrow{transform:translate(-.25rem)}