:root{--neutral-900: black;--neutral-400: #6A6662;--galactic-blue-500: #755CDE;--light-red-500: #E16B5B;--summer-yellow-500: #F6A560;--neutral-0: white;--neutral-200: #FFF7F0;--pink-500: #F39E9E;--cyan-500: #61C4B7;--dark-purple-500: #552049}body{font-family:Plus Jakarta Sans,sans-serif;background-color:var(--neutral-200);display:flex;flex-direction:column;gap:40px;padding:16px;margin:0}@media screen and (min-width:1024px){body{max-width:1110px;margin:0 auto}}#root{display:flex;flex-direction:column;gap:40px}h2{margin:0}.button{color:var(--neutral-0);font-size:16px;border:none;padding:15px 16px;cursor:pointer;border-radius:999px;width:200px}.button-dark{background-color:var(--neutral-900)}.button-dark:hover{background-color:var(--galactic-blue-500)}.button-dark:focus{outline:solid 3px var(--galactic-blue-500);outline-offset:2px}.button-light{background-color:var(--light-red-500)}.button-light:hover{background-color:var(--summer-yellow-500)}.button-light:focus{outline:solid 3px var(--summer-yellow-500);outline-offset:2px}.button-arrow{background-color:var(--neutral-900);border:none;padding:15px;cursor:pointer;border-radius:999px;width:64px;height:64px}.button-arrow:hover{background-color:var(--galactic-blue-500)}.button-arrow:focus{outline:solid 3px var(--galactic-blue-500);outline-offset:2px}.nav{display:flex;height:52px;justify-content:space-between}.hero-content{text-align:center;margin:0 auto}.hero-content p{font-size:18px;color:var(--neutral-400)}.hero-content h1{font-size:40px}@media screen and (min-width:426px){.hero-content{max-width:500px}.hero-content h1{font-size:56px}}@media screen and (min-width:1024px){.hero-content{max-width:755px}}.graphic-design-card{display:flex;color:#fff;flex-direction:column;background-color:var(--galactic-blue-500);padding:20px;border-radius:8px;gap:5rem}.graphic-design-card img{width:50%;height:auto;align-self:flex-end}.ui-card{display:flex;color:#fff;flex-direction:column;background-color:var(--summer-yellow-500);padding:20px;border-radius:8px;gap:3rem}.ui-card img{width:50%;height:auto;align-self:flex-end}.services-container{display:flex;width:100%;gap:20px}.services-section{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:20px;grid-template-areas:"graphic-design graphic-design" "ui apps" "illustrations illustrations" "photography photography" "motion-graphics motion-graphics"}@media screen and (min-width:426px){.services-section{grid-template-columns:2fr 1fr 1fr;grid-template-rows:auto auto auto;grid-template-areas:"graphic-design ui apps" "graphic-design illustrations illustrations" "photography motion-graphics motion-graphics"}}@media screen and (min-width:1024px){.services-section{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;grid-template-rows:auto;grid-template-areas:"graphic-design graphic-design ui apps photography photography" "graphic-design graphic-design illustrations illustrations motion-graphics motion-graphics"}}.graphic-design-card{grid-area:graphic-design}.ui-card{grid-area:ui}.apps-card{grid-area:apps}.photography-card{grid-area:photography}.illustrations-card{grid-area:illustrations}.motion-graphics-card{grid-area:motion-graphics}.apps-card{display:flex;color:#fff;flex-direction:column;background-color:var(--pink-500);padding:20px;border-radius:8px;gap:3rem}.apps-card img{width:45%;height:auto;align-self:flex-end}.illustrations-card{display:flex;color:#fff;flex-direction:column;background-color:var(--light-red-500);padding:20px;border-radius:8px;gap:3rem}.illustrations-card img{width:45%;height:auto;align-self:flex-end}.photography-card{display:flex;color:#fff;flex-direction:column;background-color:var(--cyan-500);padding:20px;border-radius:8px;gap:3rem}.photography-card img{width:45%;height:auto;align-self:flex-end}.motion-graphics-card{display:flex;color:#fff;flex-direction:column;background-color:var(--dark-purple-500);padding:20px;border-radius:8px;gap:3rem}.motion-graphics-card img{width:45%;height:auto;align-self:flex-end}.about{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}.about img{width:90%;height:auto;border-radius:8px}@media screen and (min-width:426px){.about img{width:300px;height:auto}}@media screen and (min-width:1024px){.about{flex-direction:row;text-align:left;gap:90px;padding:35px}.about img{width:445px;height:auto}}.about-title{font-size:40px;padding:0 20px}@media screen and (min-width:1024px){.about-title{padding:0}}.about-description{font-size:18px;padding:0 20px;color:var(--neutral-400)}@media screen and (min-width:1024px){.about-description{padding:0}}.my-work{display:flex;flex-direction:column;align-items:center;gap:20px}.my-work h2{font-size:40px}.carousel{display:flex;align-items:center;justify-content:center;position:relative;width:100%;max-width:600px;margin:0 auto;overflow:hidden}.carousel-image{width:100%;height:auto;border-radius:8px}.carousel-button{background:none;border:none;cursor:pointer;position:absolute;top:50%;transform:translateY(-50%);z-index:10}.carousel-controls{display:flex;gap:16px}.carousel-button.prev{left:10px}.carousel-button.next{right:10px}.carousel-button img{width:24px;height:24px}.contact{display:flex;flex-direction:column;align-items:center;text-align:center;color:var(--neutral-0);background-color:var(--neutral-900);padding:40px 20px;border-radius:10px;gap:20px}.contact h2{font-size:40px}.contact p{font-size:18px}@media screen and (min-width:426px){.contact p{padding:0 80px}}@media screen and (min-width:1024px){.contact{flex-direction:row;justify-content:center;gap:90px;text-align:left;padding:80px 64px}.contact p{padding:0}}.contact-text-container{padding:0 20px}@media screen and (min-width:1024px){.contact-text-container{padding:0;width:540px}}
