@import'https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap" rel="stylesheets';*{box-sizing:border-box;margin:0;padding:0}:root{--body-bg: #1b2d53;--secondary: #6281dc;--btn-bg: #4b608f;--header-text: #f4ede9;--body-text: #f4ede9;--headings: #f4ede9;--primary: #6281dc;--proj-name: #e0bacf;--primary-shadow: #021948;--secondary-shadow: #9e4770;--white: #1b2d53;font-family:DM-sans,sans-serif;text-align:center;scroll-behavior:smooth}body{background-color:var(--body-bg)}main{display:flex;flex-direction:column;align-items:center;padding:3rem 1rem;background-color:var(--white);margin-inline:1rem}section{display:flex;flex-direction:column;align-items:center;max-width:470px;margin-bottom:3.5rem}section:last-of-type{margin-bottom:0}h1{font-weight:400;font-size:2.4rem;line-height:1;margin-bottom:1rem;color:var(--headings)}h2{font-weight:400;margin-bottom:1rem;color:var(--headings)}h3{font-weight:400;margin-bottom:.5rem;font-size:1.3rem;color:var(--proj-name)}li{list-style:none}a{text-decoration:none;color:inherit}img{display:block;width:100%;height:auto}.section-square{rotate:10deg}.hero p:last-of-type,.about p:last-of-type{margin-bottom:1.5rem}.btn{padding:.5rem 1rem;border-radius:5px;color:var(--header-text);background-color:var(--btn-bg);box-shadow:0 2px var(--secondary-shadow);transition:background-color .3s ease;margin-bottom:2.3rem}.btn:hover{background-color:var(--secondary-shadow)}.divider{position:relative;margin-bottom:6rem}.divider:after{content:"";width:15px;height:15px;background-color:var(--primary);position:absolute;bottom:-3rem;left:50%;transform:translate(-50%);rotate:15deg}.body-text,.about p,.project p{font-family:Open Sans,sans-serif;font-size:1rem;line-height:2;color:var(--body-text)}header{position:relative;display:flex;justify-content:space-between;align-items:center;padding:1rem;color:var(--header-text);background-color:var(--primary);width:100%}header span{min-width:fit-content;z-index:999}header button{cursor:pointer;height:24px;width:24px;background:none;border:none;fill:var(--header-text);transition:fill .3s ease;z-index:100}header button:hover{fill:var(--secondary)}.hero .image{display:flex;justify-content:center;margin-bottom:3rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.hero .image:after{content:"";position:absolute;rotate:10deg;position:relative;width:200px;height:200px;background-color:var(--secondary);animation:fadeIn 2s ease-in-out;opacity:1}.hero .image img{position:absolute;z-index:10;width:200px;background-color:var(--body-bg);animation:fadeIn 2s ease-in-out}.hero p{font-size:1.2rem;color:var(--secondary)}.hero p:last-of-type{font-size:.9rem}.about p{margin-bottom:1rem}.project{margin-bottom:4rem}.project:last-of-type{margin-bottom:0}.project .image{width:100%;height:auto;margin-bottom:.9rem;aspect-ratio:16/9;border-radius:4px;overflow:hidden}.project .content{display:flex;flex-direction:column;gap:.6rem;text-align:left}.project .content ul{display:flex;gap:.5rem}.project .content ul li{padding:.4rem .7rem;border-radius:10px;font-size:.9rem;color:var(--header-text);background-color:var(--primary);box-shadow:0 1px var(--primary-shadow)}.project .content p{margin-bottom:1rem;font-size:1rem;line-height:1.5}.project .content div{display:flex;gap:.3rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{position:relative;max-width:90%;max-height:90%;overflow:auto}.modal-content img{width:100%;height:auto}.close{position:absolute;top:10px;right:20px;cursor:pointer;color:#fff;font-size:24px}.contact p{margin-bottom:.5rem;font-size:.9rem;color:var(--primary)}.socials-container{display:flex;gap:1rem}.socials-container svg{width:20px;height:20px;fill:var(--secondary);transition:transform .3s ease,fill .3s ease}.socials-container svg:hover{transform:scale(1.2);fill:var(--secondary-shadow)}footer{padding-block:1.5rem;font-size:.9rem;color:var(--header-text);background-color:var(--primary);width:100%;margin-inline:1rem}.nav{position:absolute;z-index:50;top:40px;left:0;width:100%;padding-block:2rem;font-size:2.5rem;background-color:var(--primary);transform:translateY(-120%);transition:transform .3s ease}.nav.open{transform:translate(0)}@media (min-width: 1024px){header button{display:none}.nav{position:static;display:flex;justify-content:flex-end;padding-top:0;font-size:1.5rem;background-color:transparent;transform:translateY(0);padding-block:0}.nav ul{display:flex;gap:3rem}.hero{flex-direction:row-reverse;justify-content:space-between;text-align:left}.project{display:flex;gap:2rem;align-items:center;text-align:left;margin-bottom:4rem}.project div{flex-basis:50%}.socials-container{gap:2rem}.socials-container svg{width:35px;height:35px}header,main,footer{margin-inline:auto;padding-inline:3rem}main{margin:auto;padding-block:6rem}section{width:100%;max-width:100%;margin-bottom:6.5rem}.section-square{margin-bottom:6rem}.about p{margin-bottom:2rem}.project .content{display:flex;flex-direction:column;align-items:flex-start;gap:.75rem}.contact p{margin-bottom:1rem}footer{padding-block:3rem}h1{font-size:4rem}h2{margin-bottom:2rem;font-size:2.5rem}h3,.hero p{font-size:1.5rem}.body-text,.about p,.project p{font-size:1.25rem}header{font-size:1.15rem}.project .content p,.hero p:last-of-type,.contact p,footer{font-size:1rem}}
