*{box-sizing:border-box;scroll-behavior:smooth;margin:0;padding:0}:root{--cyan-1:#a1d1c7;--cyan-2:#c2fdff;--cyan-3:#82ada773;--transparent:#8382820d;--black:#000;--dark:#131212;--white:#c8c8c8;--muted:#c5c5c5}body{background-color:var(--black);color:var(--white);font-family:Inter,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}.navbar{z-index:99;background-color:#00000080;justify-content:space-between;align-items:center;width:100%;padding:0 2rem;display:flex;position:fixed;top:0}.desktop-ul{gap:2rem;list-style:none;display:flex;position:absolute;left:50%;transform:translate(-50%)}.nav-links{transition:color .2s}.contact-link{border:1px solid var(--white);color:inherit;border-radius:30px;padding:1rem 2rem;text-decoration:none;transition:background-color .2s,color .2s}.menu-btn{color:var(--white);cursor:pointer;background:0 0;border:none;display:none}.mobile-menu{background-color:var(--cyan-2);z-index:999;flex-direction:column;justify-content:space-between;gap:2rem;width:250px;padding:2rem;transition:transform .5s;display:flex;position:fixed;top:0;bottom:0;right:0;transform:translate(100%)}.close-btn{color:var(--black);cursor:pointer;background:0 0;border:none;font-family:inherit}.mobile-ul{flex-direction:column;gap:2rem;list-style:none;display:flex}.menu-links{color:var(--black);text-decoration:none;transition:color .2s}.menu-contact-link{border:1px solid var(--black);color:var(--black);text-align:center;border-radius:30px;padding:1rem 2rem;text-decoration:none;transition:all .2s}.overlay{z-index:998;background-color:#0000001a;position:fixed;inset:0}.mobile-menu.open{transform:translate(0)}@media (width<600px){.desktop-ul,.contact-link{display:none}.menu-btn{font:inherit;display:block}}@media (width>600px){.contact-link:hover{background-color:var(--cyan-2);color:var(--black)}.nav-links:hover{color:var(--cyan-2)}}.hero{background:url(/hero_bg.png) 100%/auto 100% no-repeat;flex-direction:column;justify-content:center;min-height:100svh;padding-inline:100px;display:flex;position:relative}.hero-heading{text-shadow:0px 0px 15px var(--white);margin-bottom:1rem;font-size:5rem;font-weight:600}.hero-heading-cyan{color:var(--cyan-1);text-shadow:0px 0px 15px var(--cyan-1)}.hero-paragraph{color:var(--muted);max-width:30ch;margin-bottom:3rem}.hero-btn{background-color:var(--white);text-align:center;width:fit-content;color:var(--black);cursor:pointer;padding:1rem 2rem;font-weight:600;text-decoration:none;transition:background-color .2s;display:inline-block}.hero-social-links{flex-direction:column;gap:1.5rem;padding:3rem;display:flex;position:absolute;bottom:0;right:0}.hero-social-links i{color:var(--muted);font-size:1.5rem;transition:color .2s}@media (width<600px){.hero{height:90vh;padding-inline:2rem}.hero-heading{font-size:3rem}.hero-social-links{display:none}}@media (width>600px){.hero-btn:hover{background-color:var(--cyan-2)}.hero-social-links i:hover{color:var(--cyan-2)}}.about{flex-direction:column;justify-self:center;align-items:center;width:100%;padding:10rem 5rem 5rem;display:flex}.about-text-container{flex-direction:column;gap:2rem;display:flex}.about-heading{text-transform:uppercase;letter-spacing:.5rem;font-size:1.5rem;font-weight:400}.about-paragraph{letter-spacing:.1rem;max-width:50ch;color:var(--muted);font-size:.9rem;font-weight:300;line-height:1.5rem}.skills{flex-direction:column;justify-content:center;align-items:center;gap:3rem;padding:5rem;display:flex;position:relative}.skills:before{content:"";filter:brightness(.3);z-index:0;background-image:url(/skills_bg.png);background-position:50%;background-repeat:no-repeat;background-size:contain;position:absolute;inset:0}.skills>*{z-index:1;position:relative}.skills-heading{text-transform:uppercase;letter-spacing:.5rem;font-size:1.5rem;font-weight:400}.skill-container{flex-wrap:wrap;justify-content:center;gap:1rem;width:100%;max-width:800px;display:flex}.skill-container span{border:1px solid var(--muted);color:var(--muted);text-align:center;text-transform:uppercase;letter-spacing:.3rem;border-radius:30px;flex:1;padding:1rem 1.5rem;display:block}@media (width<600px){.skill-container{flex-direction:column}}.project-card{width:100%;max-width:400px;color:inherit;border-radius:15px;flex-direction:column;justify-self:center;text-decoration:none;transition:transform .2s;display:flex;overflow:hidden}.project-card:hover{transform:scale(1.05)}.project-card img{opacity:.9;width:100%;height:auto;display:block}.project-info{background-color:var(--dark);justify-content:space-between;align-items:center;padding:1.5rem;display:flex}.project-info h3{text-transform:uppercase;letter-spacing:.2rem;font-size:1rem;font-weight:600}.project-info p{color:#9c9c9c;font-size:.8rem}@media (width<600px){.project-info{flex-direction:column;align-items:flex-start;gap:1rem}}.recent-work{flex-direction:column;align-items:center;width:100%;padding:8rem 2rem;display:flex}.recent-work-heading{text-transform:uppercase;letter-spacing:.5rem;margin-bottom:5rem;font-size:1.5rem;font-weight:400}.recent-work-card-container{flex-wrap:wrap;justify-content:center;gap:2rem;width:100%;max-width:900px;margin-bottom:5rem;display:flex}.recent-work-project-card{aspect-ratio:16/9;border-radius:30px;width:100%;max-width:400px;transition:transform .2s;overflow:hidden}.recent-work-project-card img{object-fit:cover;object-position:top;opacity:.9;width:100%;height:100%}.recent-work-btn{background-color:var(--white);text-align:center;width:10em;color:var(--black);cursor:pointer;padding:1rem;font-weight:600;text-decoration:none;transition:background-color .2s;display:inline-block}@media (width<1000px){.recent-work-card-container{flex-direction:column;align-items:center}}@media (width>600px){.recent-work-project-card{max-height:350px}.recent-work-btn:hover{background-color:var(--cyan-2)}.recent-work-project-card:hover{transform:scale(1.05)}}.contact{background:url(/contact_bg.png) 50% no-repeat;flex-direction:column;align-items:center;gap:3rem;padding:0 2rem 5rem;scroll-margin-top:8rem;display:flex}.contact-heading{text-transform:uppercase;letter-spacing:.3rem;text-align:center;font-size:1.3rem;font-weight:600}.contact-form{background:var(--transparent);border:1px solid var(--cyan-3);-webkit-backdrop-filter:blur(12px);border-radius:24px;flex-direction:column;gap:1.5rem;width:100%;max-width:480px;padding:3rem;display:flex}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-label{color:var(--muted);text-transform:uppercase;letter-spacing:.1rem;font-size:.75rem;font-weight:500}.contact-form input,.contact-form textarea{border:1px solid #0000;border-bottom:1px solid var(--cyan-3);width:100%;color:var(--white);background:0 0;outline:none;padding:.875rem 1rem;font-family:inherit;font-size:.95rem;transition:border-color .2s}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--cyan-3)}.contact-form textarea{resize:none;height:7rem}.contact-btn{background-color:var(--white);color:var(--black);cursor:pointer;border:none;width:100%;margin-top:.5rem;padding:1rem;font-family:inherit;font-size:1rem;font-weight:600;transition:background-color .2s}@media (width>600px){.contact-btn:hover{background-color:var(--cyan-1)}}footer{border-top:1px solid var(--cyan-3);grid-template-areas:"left right""bottom bottom";gap:3rem;height:25rem;padding:4rem 5rem 2rem;display:grid}.footer-left{flex-direction:column;grid-area:left;gap:2rem;display:flex}.footer-left h2{text-transform:uppercase;letter-spacing:.3rem;font-size:2rem;font-weight:700}.footer-right{grid-area:right;justify-content:flex-end;align-items:center;display:flex}.email-text{color:var(--muted);font-size:.9rem}footer ul{flex-direction:column;gap:1rem;margin:0;padding:0;list-style:none;display:flex}footer ul a{color:inherit;text-decoration:none;transition:color .2s}.footer-bottom{text-align:center;color:var(--muted);grid-area:bottom;font-size:.8rem;line-height:1.6rem}@media (width<600px){footer{grid-template-areas:"left left""right right""bottom bottom";padding:3rem 2rem 2rem}.footer-left{align-items:center}footer ul{text-align:center}.footer-right{justify-content:center}}@media (width>600px){footer ul a:hover{color:var(--cyan-2)}}.work-navbar{background-color:#00000080;justify-content:space-between;align-items:center;width:100%;padding:0 2rem;display:flex}.logo{max-width:5rem}.page-heading{background:url(/work_bg.png) 50%/cover no-repeat;justify-content:center;align-items:center;width:100%;height:200px;display:flex}.page-heading h1{text-transform:uppercase;letter-spacing:.5rem;font-size:1.5rem;font-weight:400}.work-banner-controls{padding:2rem;display:flex}.work-banner-controls .link{text-decoration:none;transition:color .2s}@media (width>600px){.work-banner-controls .link:hover{color:var(--cyan-2)}}.work-results{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:8rem 3rem;max-width:1300px;margin-inline:auto;padding:5rem;display:grid}@media (width<800px){.work-results{padding:2rem 2rem 5rem}}.return-to-work{padding:2rem}.link{text-decoration:none;transition:color .2s}.project-container{grid-template-columns:1fr 1fr;gap:2rem;max-width:1500px;margin-inline:auto;padding:2rem 5rem 5rem;display:grid}.project-container-left{flex-direction:column;gap:1rem;max-width:25rem;height:fit-content;margin-inline:auto;padding:3rem;display:flex;position:sticky;top:50px}.project-container-left h2{text-transform:uppercase;letter-spacing:.2rem;font-size:2rem;font-weight:600}.project-container-left p{letter-spacing:.1rem;max-width:50ch;color:var(--muted);font-size:.8rem;font-weight:300;line-height:1.5rem}.project-container span{background-color:var(--transparent);border:1px solid var(--cyan-3);text-transform:uppercase;letter-spacing:.2rem;border-radius:30px;width:fit-content;padding:.5rem 1rem;font-size:.7rem}.project-buttons{flex-direction:column;gap:2rem;display:flex}.project-btn-1{background-color:var(--white);text-align:center;color:var(--black);cursor:pointer;padding:1rem;font-weight:600;text-decoration:none;transition:background-color .2s}.project-btn-2{text-align:center;color:var(--white);cursor:pointer;padding:1rem;font-weight:600;text-decoration:none}.project-container-right img{object-fit:cover;border-radius:15px;width:100%;height:auto}@media (width>600px){.project-btn-1:hover{background-color:var(--cyan-2)}.link:hover{color:var(--cyan-2)}}@media (width<920px){.project-container{grid-template-columns:1fr;padding:2rem}.project-container-left{gap:2rem;padding-inline:0;position:static}}.div-404{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;width:100%;height:100vh;padding:2rem;display:flex}.return-to-home{background-color:var(--white);color:var(--black);padding:1rem 1.5rem;font-weight:600;text-decoration:none;transition:background-color .2s;display:inline-block}.return-to-home:hover{background-color:var(--cyan-2)}
