:root{font-size:62.5%;--primary-color:#7b5fff;--w:#ffffff;--c1:#f7f7f7;--c2:#ededed;--c3:#dedede;--c4:#cccccc;--c5:#b2b2b2;--c6:#9c9c9c;--c7:#717171;--c8:#595959;--c9:#404040;--c10:#2e2e2e;--c11:#111111;--black:#000000}*,::after,::before{margin:0;padding:0;box-sizing:border-box;font:inherit}:focus{outline-color:var(--primary-color)}html{scroll-behavior:smooth}img,picture,svg,video{display:block;max-width:100%}body,button,input,textarea{font:400 1.6rem "Fira Sans",Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh;color:var(--c11);background-color:var(--c1)}a{color:inherit;text-decoration:none}ul{list-style:none}p{line-height:1.5}.main-container{width:min(90vw,1200px);margin:0 auto}.padding-container{padding:12rem 0}@media (max-width:800px){:root{font-size:55%}}.close-btn{width:4rem;height:4rem;background-color:#c3b7ff;border-radius:50%;display:flex;justify-content:center;align-items:center;padding:.5rem;box-shadow:0 8px 0 #907dee,0 8px 2px rgba(77,50,204,.1);transition:box-shadow .3s,transform .3s}.close-btn:focus,.close-btn:hover{transform:translateY(4px);box-shadow:0 0 0 #907dee,0 8px 2px rgba(77,50,204,.1)}.filter-box,.filter-list{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;user-select:none}.filter-item{font-size:1.4rem;letter-spacing:.5px;font-weight:500;text-transform:uppercase;border-radius:2rem;border:1px solid var(--c5);padding:.4rem .6rem .4rem 1.2rem;display:flex;align-items:center;gap:.8rem}.filter-item:hover{border-color:var(--c9)}.filter-item button{border:none;background:0 0;cursor:pointer}.remove-filters-btn{color:var(--c9);font-size:1.4rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.4rem;appearance:none;background:0 0;border:none}.remove-filters-btn:hover{filter:brightness(.1)}#projects{margin-top:6rem}#projects>ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:2rem;padding-bottom:4rem}.project-card{display:block;background-color:var(--w);border:1px solid var(--c2);box-shadow:0 1px 2px 0 rgba(0,0,0,.1);border-radius:1rem;overflow:hidden;height:100%;max-width:520px;width:100%;flex:1}.project-card:focus-within,.project-card:hover{background-color:var(--c2);border-color:var(--c6)}.project-card a>img{width:100%;height:23rem;object-fit:cover;object-position:center}.project-card a>div{padding:2rem 2rem 3rem}.project-card h3{font-weight:500;margin-bottom:1rem}.project-name{color:var(--c8);font-size:1.4rem;letter-spacing:.42px;text-transform:uppercase}.tags{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--c1);display:flex;align-items:center;flex-wrap:wrap;gap:1rem}.tag{background-color:var(--c2);color:var(--c9);font-size:1.2rem;font-weight:500;letter-spacing:.5px;text-transform:uppercase;border-radius:2rem;padding:.5rem 1rem;display:flex;justify-content:center;align-items:center;gap:.5rem}@media (max-width:780px){#projects>ul{display:flex;flex-direction:column;align-items:center}}body:has(#filters-panel.active){overflow:hidden}.overlay{position:fixed;inset:0;background:rgba(0,0,0,.3);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:10}.overlay:has(+ #filters-panel.active){opacity:1;pointer-events:all}#filters-panel{background-color:var(--c1);box-shadow:-2px 0 10px rgba(0,0,0,.1);transition:right .3s ease;width:52rem;height:100vh;position:fixed;top:0;right:-600px;z-index:11;user-select:none;display:flex;flex-direction:column}#filters-panel.active{right:0}#filters-panel header{background-color:var(--c3);border-bottom:1px solid var(--c4);padding:1.6rem 3.2rem;display:flex;justify-content:space-between;align-items:center}#filters-panel header h2{font-size:2rem;font-weight:500}#filters-panel header button{cursor:pointer;border:none;background:0 0;appearance:none;width:4rem;height:4rem}#filters-panel header button:focus svg path,#filters-panel header button:hover svg path{fill:var(--c5)}#filters-panel form{padding:3.2rem;display:flex;flex-direction:column;gap:3.2rem;flex:1;overflow:auto;padding-bottom:14rem}#filters-panel form fieldset{appearance:none;border:none}#filters-panel form fieldset legend{color:var(--c9);font-weight:500}.filters-options{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.6rem}.filter-checkbox{color:var(--c9);font-size:1.2rem;font-weight:500;text-transform:uppercase;letter-spacing:.6px;border:1px solid var(--c5);border-radius:2rem;padding:.4rem 1.2rem;display:flex;align-items:center;gap:.8rem;width:fit-content;min-height:2.8rem;cursor:pointer;position:relative}.filter-checkbox:focus-within,.filter-checkbox:hover{border-color:var(--c9)}.filter-remove-btn{display:none}.filter-checkbox:has(input:checked){padding:.4rem .6rem .4rem 1.2rem;background-color:var(--primary-color);border-color:var(--primary-color);color:var(--c1)}.filter-checkbox:has(input:checked) .filter-remove-btn{display:block}#area .filter-checkbox:has(input:checked) svg path{stroke:var(--c1)}.filter-checkbox input{position:absolute;opacity:0;cursor:pointer}#filters-panel footer{background-color:var(--c3);border-top:1px solid var(--c4);padding:4rem 3.2rem;display:flex;justify-content:space-between;align-items:center;position:absolute;bottom:0;left:0;right:0}.filters-apply,.filters-clear{border:none;cursor:pointer;appearance:none}.filters-clear{font-size:1.8rem;font-weight:500;color:var(--c9);background:0 0}.filters-clear:focus,.filters-clear:hover{color:var(--c6);text-decoration:underline}.filters-apply{font-weight:500;color:var(--c1);background-color:var(--primary-color);border-radius:1rem;padding:1rem 1.2rem;transition:filter .3s}.filters-apply:focus,.filters-apply:hover{filter:brightness(1.2)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (max-width:400px){.filter-checkbox{font-size:1rem}}@media (max-width:500px){#filters-panel{width:100%}}.close-btn{position:absolute;right:0;top:4rem}body{width:min(90vw,1280px);margin:0 auto;position:relative}body>header{padding:8rem 0 4rem;margin-bottom:4rem;border-bottom:1px solid var(--c4)}body>header h1{color:var(--primary-color);font-size:4rem;font-weight:500;margin-bottom:2rem}body>header p{color:var(--c9)}body>header+div{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}h2{font-size:1.8 rem;color:var(--c10);font-weight:500}.filter-btn{color:var(--c1);background-color:var(--primary-color);font-weight:500;cursor:pointer;border-radius:1rem;padding:1rem 1.2rem;display:flex;align-items:center;gap:1rem;border:none;appearance:none;transition:filter .3s}.filter-btn:focus,.filter-btn:hover{filter:brightness(1.2)}