:root{--primary-color: #aeadf0;--primary-color-pale: #f3e2f3;--primary-color-light: #d8dcff;--primary-color-lighter: #edeffd;--primary-color-dark: #a0a4ff;--primary-color-darker: #7a7eff;--primary-color-darkest: #5458ff;--secondary-color: #f0f0f0;--text-color: #222222;--font-family: "Cascadia Code", sans-serif}.dark{--primary-color-pale: #16161e;--primary-color-light: #1c1c2b;--primary-color-lighter: #0f0f14;--secondary-color: #12121a;--text-color: #e0e0ed;--primary-color-dark: #b8b8ff;--primary-color-darker: #9381ff;--primary-color-darkest: #9b9eff;--top-nav: #3b3979;--footer-color: #36437a}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--primary-color-lighter);overflow-x:hidden;line-height:1.6;font-size:.8rem;color:var(--text-color);scroll-behavior:smooth;transition:background-color .3s ease,color .3s ease}::-webkit-scrollbar{display:none}main{box-sizing:border-box;margin:0;text-align:center;font-family:var(--font-family)}.fade-in-on-scroll{opacity:0;transform:translateY(30px);transition:opacity .8s ease-out,transform .8s ease-out;visibility:hidden}.fade-in-on-scroll.visible{opacity:1;transform:translateY(0);visibility:visible}#about,#education,#projects,#skills,#experiences,#certifications,#languages,#contact{scroll-margin-top:100px;margin-top:6rem;margin-bottom:2rem}.about,.contact{margin:1rem 0 120px}.nav{display:flex;justify-content:space-between;background:var(--top-nav);position:sticky;z-index:1;top:0;box-shadow:0 5px 10px #0000001a}.nav ul{display:flex;padding:20px 0;gap:20px;align-items:center}.nav-list{list-style:none;font-size:16px}.nav-list a{text-decoration:none;color:inherit}.nav>ul>li:hover{color:var(--primary-color-darkest)}.dark nav>ul>li:hover{color:#fb3c65}.nav-list li a.active{color:var(--primary-color-darkest);font-weight:700;border-bottom:2px solid var(--primary-color-darkest);transition:all .1s ease-in-out}.rightnav-icons{display:flex;justify-content:space-between;margin-right:20px}.sun{cursor:pointer}.hamburger{display:none}.logo-container{display:flex;align-items:center}.matini-logo{margin-left:20px;display:flex;align-items:center;cursor:pointer}.dark .matini-logo img{filter:invert(93%) sepia(5%) saturate(885%) hue-rotate(202deg) brightness(105%) contrast(88%)}.header{min-height:90svh;display:flex;flex-direction:column}.matini{margin:0 auto 20px;border-radius:50%}.intro-wrapper{flex:1;display:flex;justify-content:center;align-items:center}.intro-text{display:flex;flex-direction:column;flex-grow:1}.intro-name{font-size:45px;font-weight:900;margin-bottom:10px;line-height:5rem}.intro-title{font-weight:400}.about{padding:0 5rem}.hoverable{border:.5px solid transparent;border-radius:5px;background:var(--primary-color-light);box-shadow:#0000000d 0 4px 6px;text-align:left}.hoverable:hover{border-color:var(--primary-color-darkest)}.hoverable>h2,.hoverable>h3{font-size:1.1rem;margin-bottom:5px;font-weight:500}.hoverable>h4{font-size:.85rem;margin-bottom:5px;font-weight:100}.hoverable>p,.hoverable>ul>li,.project>p{font-size:.9rem;margin:15px 0;font-weight:300;flex-grow:1}.with-grid{display:grid;width:80%;max-width:1100px;justify-content:center;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin:0 auto}.skills{background-color:#dfdbe5;background-image:url("data:image/svg+xml,%3Csvg width='42' height='44' viewBox='0 0 42 44' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='Page-1' fill='none' fill-rule='evenodd'%3E%3Cg id='brick-wall' fill='%239C92AC' fill-opacity='0.4'%3E%3Cpath d='M0 0h42v44H0V0zm1 1h40v20H1V1zM0 23h20v20H0V23zm22 0h20v20H22V23z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");padding:15px 0;width:100%}.dark .skills{filter:brightness(.75) contrast(1.2)}.carousel-wrapper{overflow:hidden;position:relative;width:100%}.carousel-track{display:flex;animation:scroll-left 10s linear infinite;width:fit-content}.carousel-track>*{margin-right:70px}@keyframes scroll-left{0%{transform:translate(0)}to{transform:translate(-50%)}}.skill{display:flex;flex-wrap:wrap;width:100px;height:100px;flex-direction:column;justify-content:center;align-items:center}.education-item,.experience{padding:1.5rem 2rem}.project{padding:0 1.5rem}.preview-container{height:200px}.project-links{display:flex;padding:.5rem 0 2rem;justify-content:space-between}.link-btn{border:1px solid var(--primary-color-dark);text-decoration:none;background-color:var(--secondary-color);padding:10px 20px;border-radius:10px;color:inherit}.link-btn:hover{background-color:var(--primary-color-dark);color:var(--secondary-color)}.certifications{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.dark .certifications .certification:nth-of-type(2) img,.dark .certifications .certification:nth-of-type(3) img{filter:invert(93%) sepia(5%) saturate(885%) hue-rotate(202deg) brightness(105%) contrast(88%)}.certification{padding:2rem 0;display:flex;flex-direction:column;align-items:center}.certification>img{margin-bottom:1rem}.certifications>.certification:nth-of-type(1)>img{object-fit:cover}.languages{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.language{padding:1rem 3rem;text-align:center}.contact{display:flex;justify-content:center;margin-bottom:3.5rem}.contact-item{display:flex;gap:10px;flex-direction:column}.contact-item>input,textarea{padding:20px;border-radius:10px;background:none;border:1px solid var(--primary-color-darkest);color:var(--text-color)}.submit-btn{padding:15px 20px;border-radius:10px;border:1px solid var(--primary-color-darkest);background:var(--primary-color-pale);font-weight:600;color:var(--text-color)}.dark .submit-btn{background:#424e88}.submit-btn:hover{background:var(--primary-color-dark);font-weight:700;color:var(--secondary-color)}footer{background:var(--primary-color-dark);padding:15px;box-shadow:0 2px 10px #0000001a;color:var(--text-color)}.dark footer{background:var(--footer-color)}@media (max-width: 610px){.with-grid{width:85%}.contact{padding:0 2rem}.hamburger{display:block;margin-left:20px;padding:20px 0;cursor:pointer}.nav ul{display:none}}@media (min-width: 611px) and (max-width: 800px){.nav ul{font-size:.7rem}#experiences,#projects,#certifications,#languages,#contact{margin-top:5rem;margin-bottom:2rem}}@media (min-width: 801px) and (max-width: 900px){.about{padding:0 2rem}.nav ul{font-size:.8rem}}