@import "https://fonts.googleapis.com/css2?family=Lekton:ital,wght@0,400;0,700;1,400&family=Red+Hat+Mono:ital,wght@0,300..700;1,300..700&display=swap";:root{--color-bg:#1e2021;--color-bg-l:#35383a;--color-txt:#f1e5c9;--color-green:#88f7ac;--color-yellow:#f6e769;--color-yellow-minor:#e5c17c;--color-pink:#b38ca7;--color-pink-l:#e7d0d4;--width-contents:1100px;--font-accent:"Red Hat Mono", monospace;--font-general:"Lekton", monospace}*{box-sizing:border-box;font-family:var(--font-general);color:var(--color-txt);scroll-behavior:smooth;margin:0;padding:0;line-height:1.6;text-decoration:none;list-style:none}html{scroll-padding-top:90px}button{background:0 0;border:none;outline:none}.contents{max-width:var(--width-contents);margin:0 auto;padding:0 10px 10rem}.soft.scr_tr.animate{opacity:1;transform:none}.soft.scr_tr{opacity:0;transition:all .6s ease-out .2s;transform:translateY(1rem)}@keyframes cursor{50%{visibility:hidden}}@keyframes typing{0%{width:0}}@keyframes blink-caret{50%{border-color:#0000}}h1,h2,h2 span,h3{font-family:var(--font-accent)}h2{align-items:center;gap:2rem;padding-bottom:2rem;font-size:4rem;display:flex}h2 .scr_tr{white-space:nowrap;border-right:.1em solid #f1e5c9aa;width:0;transition-delay:.5s;overflow:hidden}h2 .scr_tr.animate{--chars:0;width:calc(var(--chars) * 1ch);color:var(--color-green);box-sizing:content-box;animation:typing min(calc(var(--chars) * .1s), 2s) steps(var(--chars), end) forwards, blink-caret .5s step-end infinite alternate;overflow:hidden}h2:before{content:"##";color:var(--color-txt);display:inline-block}h2:after{content:"";background:var(--color-txt);vertical-align:middle;flex:1;height:.5px}.pink{background:linear-gradient(#0000 60%,#824971 60%)}.yellow{color:var(--color-yellow)}.green{color:var(--color-green)}header{background-color:var(--color-bg);border-bottom:.5px solid var(--color-bg-l);z-index:100;justify-content:space-between;width:100vw;padding:.5rem 2rem;display:flex;position:fixed}header .logo a{font-size:2rem;font-weight:600}header .nav{justify-content:end;gap:1rem;font-size:1.2rem;display:flex}header .nav nav ul{gap:1rem;display:flex}header .nav nav ul li a:before{content:":";color:var(--color-txt)}header .nav nav ul li a,header .lang #lang-icon,header .lang li{border-radius:5px;padding:.3rem .6rem;transition:all .3s;display:block}header .nav nav ul li a:hover,header .lang #lang-icon:hover,header .lang li:hover{background-color:var(--color-bg-l);color:var(--color-txt)}header a{color:var(--color-green)}header .cv a{background:linear-gradient(to right, var(--color-yellow), var(--color-green));cursor:pointer;border:1px solid var(--color-bg);color:var(--color-bg);font-size:inherit;background-position:0%;background-size:250%;border-radius:5px;padding:.3rem .6rem;transition:all .7s ease-out;display:block;position:relative;top:-1px}header .cv a:hover{color:var(--color-bg-l);background-position:100% 51%}header #lang-icon svg{width:2rem;height:2rem;fill:var(--color-green)}header #lang-icon:hover svg{fill:var(--color-txt)}header .lang{position:relative}header .lang #lang-nav{background-color:var(--color-bg);border:.5px solid var(--color-green);z-index:101;border-radius:5px;padding:.5rem;position:absolute;top:3rem;left:50%;transform:translate(-50%)}header .lang #lang-nav.hidden{display:none}header .lang #lang-nav li{cursor:pointer;border-radius:3px;padding:.3rem 1rem;transition:all .3s}#burg,#burg-bg{display:none}main{background-color:var(--color-bg);padding-top:10rem}.li-banner,.gh-banner,#to-top{z-index:180;transition:all .2s;position:fixed;right:-2.6rem;overflow:hidden}.li-banner{top:32%;transform:rotate(-90deg)}.li-banner a,.gh-banner a{opacity:.7;font-family:var(--font-accent);color:var(--color-bg);text-align:center;border-radius:5px 5px 0 0;width:7rem;padding:.5rem 1rem 2rem;font-weight:500;transition:all .2s;display:block}.li-banner a{background-color:var(--color-yellow)}.li-banner:hover,.gh-banner:hover{right:-2rem}.li-banner a:hover,.gh-banner a:hover{opacity:1}#to-top{opacity:.8;bottom:20px;right:-5rem}#to-top button{background-color:var(--color-pink);font-family:var(--font-accent);color:var(--color-bg);border:.5px solid var(--color-bg-l);border-radius:5px 0 0 5px;padding:1rem 2rem 1rem .5rem;font-weight:500;transition:all .2s;display:block}#to-top:hover{opacity:1;right:-1rem}#to-top:hover button svg{animation:.7s 2 up}@keyframes up{0%{transform:translateY(0)}50%{transform:translateY(-.4rem)}to{transform:translateY(0)}}#landing{margin-bottom:7rem}#landing .contents{gap:2rem;position:relative}#landing .xl-texts{width:80%;position:inherit;z-index:10;padding-bottom:6rem}#landing h1{box-sizing:content-box;--chars:14;width:calc(var(--chars) * 1ch);color:var(--color-green);white-space:nowrap;animation:typing 1.5s steps(var(--chars), end) forwards, blink-caret .5s step-end infinite alternate;border-right:.1em solid #f1e5c9aa;margin-bottom:2.5rem;padding-right:.1rem;font-size:5rem;line-height:1.2;position:relative;overflow:hidden}#landing .xl-texts:before{content:"Hello, I'm";color:var(--color-pink);font-size:1.5rem;font-weight:200;position:absolute;top:-2rem}#landing .xl-texts p{color:var(--color-txt);width:80%;font-size:2.8rem;font-weight:600;line-height:1}#landing .image{text-align:right;z-index:4;width:100%;position:absolute;top:6rem}#landing .image img{width:clamp(200px,25%,800px)}#landing .cv-btn-frame{vertical-align:middle;text-align:center;padding:50px 0}#landing .cv-btn{text-align:center;border:2px solid var(--color-pink);width:fit-content;color:var(--color-pink);cursor:pointer;border-radius:5px;padding:.5rem 2rem;font-size:2rem;line-height:60px;transition:color .5s;display:inline-block;position:relative}#landing .cv-btn:hover span{color:var(--color-bg);position:relative}#landing .cv-btn svg{height:inherit;fill:var(--color-txt);transform:translateY(5px)}#landing .cv-btn:hover svg{fill:var(--color-bg)}.cv-btn:hover:before{transform-origin:0;transform:scaleX(1)}.cv-btn:before{content:"";background:var(--color-pink);transform-origin:100%;width:100%;height:100%;transition:transform .5s;display:block;position:absolute;top:0;left:0;transform:scaleX(0)}#about p{margin-bottom:4rem;font-size:1rem;line-height:1.5rem}#about h3{color:var(--color-pink);font-size:2rem}#about h3:before{content:">";margin-right:1rem}#about ul{border-left:.5px solid var(--color-pink);grid-template-columns:400px 400px;margin-top:1.5rem;padding:.5rem 2rem;display:grid}#about ul li:after{content:"/";color:var(--color-pink);margin-left:.5rem}summary::marker{content:""}summary::-webkit-details-marker{display:none}#experiences .accordion{margin-bottom:1rem}#experiences .accordion-title{background:linear-gradient(-195deg,#392d39 0%,#c4a7bc 60%) 0 0/auto 200%;border-radius:5px;grid-template-columns:70% 25% 5%;padding:1rem;transition:all .2s;display:grid;position:relative}#experiences .accordion-title h3{color:var(--color-txt)}#experiences .accordion-title .company-name{color:var(--color-pink-l)}#experiences .accordion-title .company-name:before{content:"| "}#experiences .accordion-title p{color:var(--color-bg-l);font-size:1.2rem;font-weight:600}#experiences .accordion:hover .accordion-title{background-position:70% 100%}#experiences .accordion:hover .accordion-icon:before,#experiences .accordion:hover .accordion-icon:after{background-color:var(--color-txt)}#experiences .accordion-icon{flex-shrink:0;place-items:center;width:1em;height:1em;margin-top:4px;display:grid}#experiences .accordion-icon:before,.accordion-icon:after{content:"";background-color:var(--color-bg-l);grid-area:1/1;display:block}#experiences .accordion-icon:before{width:.1em;height:100%;transform:var(--icon-transform);transition:transform .5s}#experiences .accordion-icon:after{width:100%;height:.1em}#experiences .accordion[open]{--icon-transform:rotate(90deg)}#experiences .accordion-body{border:.5px solid var(--color-pink);border-radius:5px;grid-template-columns:200px auto;gap:3rem;width:100%;margin:10px auto;padding:2rem;display:grid}#experiences .accordion-body .company-link:hover{opacity:.8}#experiences .accordion-body .location:before,#experiences .accordion-body .company-link:before{content:"";width:1.2rem;height:1.2rem;margin-right:.5rem;display:inline-block}#experiences .accordion-body .company-link:before{background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20preserveAspectRatio='xMidYMid%20meet'%20style='width:%2064px;%20height:%2064px;%20transform-origin:%2050%25%2050%25;%20transform:%20scaleX(1)%20scaleY(1)%20rotate(0deg);'%3e%3cpath%20d='M15.0004875,8%20L18,8%20C20.209139,8%2022,9.790861%2022,12%20C22,14.209139%2020.209139,16%2018,16%20L12,16%20C9.790861,16%208,14.209139%208,12%20C8,11.4477153%208.44771525,11%209,11%20C9.55228475,11%2010,11.4477153%2010,12%20C10,13.1045695%2010.8954305,14%2012,14%20L18,14%20C19.1045695,14%2020,13.1045695%2020,12%20C20,10.8954305%2019.1045695,10%2018,10%20L16.5839563,10%20C16.2360594,9.20374889%2015.6867759,8.51562167%2015.0004875,8%20Z%20M8.99951255,16%20L6,16%20C3.790861,16%202,14.209139%202,12%20C2,9.790861%203.790861,8%206,8%20L12,8%20C14.209139,8%2016,9.790861%2016,12%20C16,12.5522847%2015.5522847,13%2015,13%20C14.4477153,13%2014,12.5522847%2014,12%20C14,10.8954305%2013.1045695,10%2012,10%20L6,10%20C4.8954305,10%204,10.8954305%204,12%20C4,13.1045695%204.8954305,14%206,14%20L7.41604369,14%20C7.7639406,14.7962511%208.3132241,15.4843783%208.99951255,16%20Z'%20transform='rotate(-45%2012%2012)'%20fill='%23F1E5C9'%20style='fill:%23F1E5C9;stroke:none'%20stroke='none'/%3e%3c/svg%3e") 50%/contain no-repeat}#experiences .accordion-body .location:before{background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20fill='%23F1E5C9'%20width='800px'%20height='800px'%20viewBox='0%200%20512%20512'%20xmlns='http://www.w3.org/2000/svg'%3e%3ctitle%3eionicons-v5-n%3c/title%3e%3ccircle%20cx='256'%20cy='192'%20r='32'/%3e%3cpath%20d='M256,32C167.78,32,96,100.65,96,185c0,40.17,18.31,93.59,54.42,158.78,29,52.34,62.55,99.67,80,123.22a31.75,31.75,0,0,0,51.22,0c17.42-23.55,51-70.88,80-123.22C397.69,278.61,416,225.19,416,185,416,100.65,344.22,32,256,32Zm0,224a64,64,0,1,1,64-64A64.07,64.07,0,0,1,256,256Z'/%3e%3c/svg%3e") 50%/contain no-repeat}#certificates ul{grid-template-columns:repeat(3,1fr);place-items:center;gap:2rem;width:80%;margin:0 auto 3rem;display:grid}#certificates ul li{position:relative}#certificates ul li a img{max-height:200px}#certificates ul li a:hover{opacity:.8}#certificates p{text-align:center;font-size:1.4rem}#certificates p:before{content:">";color:var(--color-green);margin-right:1rem}#contact .contents div{border:2px solid var(--color-yellow);border-radius:10px;margin:10px 0;padding:4rem}#contact h2{text-align:center;font-family:var(--font-general);font-size:5rem;font-weight:400;display:block}#contact h2 span{background-color:var(--color-txt);color:var(--color-bg);padding:0 1rem;font-family:inherit;display:inline}#contact h2:after{content:"";background-color:var(--color-txt);width:2rem;height:5rem;animation:1s step-start infinite cursor;display:inline-block;transform:translateY(-1px)}#contact h2:before,#contact p:before{display:none}#contact p{text-align:center;font-size:1.2rem}#contact a{cursor:pointer;color:var(--color-bg-l);background:linear-gradient(90deg,#88f7ac,#c2b2f1) 0%/200%;border-radius:5px;margin-top:2rem;padding:1.5rem 2rem;font-weight:700;transition:all .3s ease-out;display:inline-block}#contact a:hover{color:var(--color-bg-l);background-position:100% 51%}footer{background-color:var(--color-bg);border-top:.5px solid var(--color-bg-l)}footer .copyright{max-width:var(--width-contents);margin:0 auto;padding:1rem 0}footer .copyright small{font-weight:700}@media (width<780px){h2{gap:1.5rem;font-size:2.1rem}.contents{padding:0 20px 5rem}header{padding:.3rem;line-height:1.4}header .logo a{margin-left:40px;font-size:1.6rem}header .nav{border:.5px solid var(--color-bg-l);z-index:200;background:var(--color-bg);opacity:0;border-radius:5px;flex-direction:column;padding:10px;transition:all .6s;position:absolute;top:3rem;left:-100%}header nav ul{flex-direction:column}header .cv a{margin-left:.3rem;padding:.1rem .3rem}header .lang #lang-icon,header #lang-icon svg{display:none}header .lang #lang-nav{border:none;padding-left:0;display:flex;position:static;transform:translate(0)}header .lang #lang-nav.hidden{display:flex}header .lang #lang-nav li{padding:0 .5rem}header .lang #lang-nav li:not(:last-child):after{content:"/";color:var(--color-green);padding-left:1rem}.li-banner{top:.5rem;right:1rem;transform:rotate(0)}.li-banner a{opacity:1;border-radius:5px;padding:5px .5rem}.li-banner:hover{opacity:.8;right:1rem}#burg{cursor:pointer;z-index:300;width:40px;height:40px;display:block;position:absolute;top:4px;left:15px}#burg span,#burg span:before,#burg span:after{background-color:var(--color-yellow);width:15px;height:5px;transition:all .6s;position:absolute;top:15px;left:0}#burg span:before{content:"";display:inline-block;top:-10px}#burg span:after{content:"";display:inline-block;top:10px}#burg-bg{z-index:100;opacity:0;visibility:hidden;cursor:pointer;background-color:#333;width:100vw;height:100vh;transition:all .6s;position:fixed;top:0;left:0}.nav-open .nav{opacity:1;transition:all .6s;left:0}.nav-open #burg-bg{opacity:.8;visibility:visible;display:block}.nav-open #burg span{width:0;left:50%}.nav-open #burg span:before{width:24px;top:0;left:-30px;transform:rotate(45deg)}.nav-open #burg span:after{width:24px;top:0;left:-30px;transform:rotate(-45deg)}#landing h1{white-space:normal;border-right:none;width:auto;min-height:2.4em;margin-bottom:2rem;font-size:clamp(3rem,15vw,5rem);animation:none;display:block;overflow:visible}#landing .xl-texts{width:100%}#landing .xl-texts p{width:100%;font-size:1.6rem;font-weight:600}#landing .image{position:relative;top:-30rem}#landing .image img{border-radius:50%;width:clamp(50px,45%,200px);position:absolute;right:0}#landing .cv-btn-frame{padding:0}#landing .cv-btn{color:var(--color-bg);background:var(--color-pink);padding:.5rem 1rem;font-size:1.4rem}#landing .cv-btn svg{fill:var(--color-bg);transform:translateY(10px)}#about ul{grid-template-columns:max-content;grid-auto-columns:auto}#experiences .accordion-title{grid-template-rows:auto auto;padding:.5rem;line-height:1}#experiences .accordion-title h3{grid-area:1/1/2/3}#experiences .accordion-title p{grid-area:2/1/3/3}#experiences .accordion-icon{grid-row:1/3;place-self:center}#experiences .accordion-body{grid-template-columns:auto;gap:1rem;padding:1rem}#experiences .accordion-body ul{grid-template-columns:1fr 1fr;place-items:center;display:grid}#certificates ul{grid-template-columns:1fr}#contact h2{font-size:2.6rem}#contact h2 span{padding:0 .2rem}#contact h2:after{width:1.2rem;height:2.6rem;transform:translateY(0)}#contact a{padding:.8rem 1rem}}