@import"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap";.dark{--background: black;--text: #bfbebf;--title: white;--accent-color: #554258;--accent-color-light: #715875;--accent-color-dark: #2b212c;--accent-color-transparent: #55425880;--border-radius: 2rem;--card-padding: 2rem;--card-background: #0b0b0c;--header-background: rgba(62, 45, 78, 1);--header-title: rgba(228, 174, 255, 1);--nav-button: rgb(255 255 255 / .1)}.light{--background: white;--text: #111111;--title: black;--accent-color: #dcb0df;--accent-color-light: #883fd0;--accent-color-dark: #e7ceff;--accent-color-transparent: #dcb0df80;--border-radius: 2rem;--card-padding: 2rem;--card-background: #fcf6ff;--header-background: #c2a1e1;--header-title: #47006b;--nav-button: rgb(0 0 0 / .1)}.light .inverts,.light #header-right .container:after{filter:invert(1)}*{box-sizing:border-box;margin:0}a{color:inherit}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background-color:#191919}::-webkit-scrollbar-thumb{background:#554258;border:2px solid rgb(25,25,25);border-radius:25px}::-webkit-scrollbar-thumb:hover{background:#715875}#app{background:var(--background);color:var(--text);font-family:Inter,sans-serif;transition:.2s ease;overflow:hidden;--horizontal-padding: 10vw}#app h1,#app h2,#app h3,#app h4,#app h5,#app h6{color:var(--title)}#app p{font-weight:300;line-height:1.5}@media (max-width: 600px){#app{--horizontal-padding: 7.5vw}}@keyframes fade-up{0%{transform:translateY(1em);opacity:0}to{transform:translateY(0);opacity:1}}#navbar{position:fixed;top:0;padding:var(--card-padding) var(--horizontal-padding);width:100vw;display:flex;justify-content:space-between;align-items:center;z-index:100}#navbar .logo{animation-name:fade-up;animation-duration:1s;animation-delay:1.5s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar .link:hover{cursor:pointer}#navbar .theme-switcher{background:var(--nav-button);border:none;border-radius:.5rem;padding:.5rem;animation-name:fade-up;animation-duration:1s;animation-delay:2.2s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar .theme-switcher img{max-height:.75rem}#navbar #nav-right{display:flex;align-items:center;gap:1rem}#navbar #nav-right .link{text-decoration:none;transition:.1s ease;text-decoration:underline 1px;text-decoration-color:#fff0}@media (max-width: 900px){#navbar #nav-right .link{font-size:.8rem}}#navbar #nav-right .link:last-of-type{border:1px solid var(--accent-color);border-radius:.5rem;padding:.5rem 2rem;color:var(--title);text-decoration:none}#navbar #nav-right .link:last-of-type:hover{background:var(--accent-color);text-decoration:none}#navbar #nav-right .link:hover{color:var(--title);text-decoration-color:#ffffff4d;cursor:pointer}#navbar #nav-right .link:nth-of-type(1){animation-name:fade-up;animation-duration:1s;animation-delay:1.7s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar #nav-right .link:nth-of-type(2){animation-name:fade-up;animation-duration:1s;animation-delay:1.8s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar #nav-right .link:nth-of-type(3){animation-name:fade-up;animation-duration:1s;animation-delay:1.9s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar #nav-right .link:nth-of-type(4){animation-name:fade-up;animation-duration:1s;animation-delay:2s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar #nav-right .link:nth-of-type(5){animation-name:fade-up;animation-duration:1s;animation-delay:2.1s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar #nav-menu .button-open{background:var(--nav-button);border:none;border-radius:.5rem;padding:.5rem;animation-name:fade-up;animation-duration:1s;animation-delay:1.7s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#navbar #nav-menu .button-open img{max-height:.75rem}#navbar #nav-menu #modal{position:absolute;top:var(--card-padding);left:var(--horizontal-padding);right:var(--horizontal-padding);background:var(--card-background);border:1px solid var(--accent-color);color:var(--title);padding:var(--card-padding) 0;border-radius:.5rem;transition:.4s ease}#navbar #nav-menu #modal .button-close{position:absolute;right:.75rem;top:.75rem;background:none;border:none}#navbar #nav-menu #modal .button-close img{max-width:1rem}#navbar #nav-menu #modal .scroll-group{background:var(--background);margin:.5rem 0;font-size:10vw;font-weight:600;display:flex;align-items:center;justify-content:center;position:relative;height:11vw;overflow:hidden;--offset: 0s}#navbar #nav-menu #modal .scroll-group:nth-of-type(2){--offset: .5s}#navbar #nav-menu #modal .scroll-group:nth-of-type(3){--offset: 1s}#navbar #nav-menu #modal .scroll-group:nth-of-type(4){--offset: 1.5s}#navbar #nav-menu #modal .scroll-group:nth-of-type(5){--offset: 2s}#navbar #nav-menu #modal .scroll-group .link{position:absolute;animation:link-scroll 10s linear infinite;animation-delay:calc(-1 * var(--offset))}#navbar #nav-menu #modal .scroll-group .link:nth-of-type(2){animation-delay:calc(-5s - var(--offset))}@keyframes link-scroll{0%{left:100%}to{left:-80%}}#navbar #nav-menu #modal.hidden{opacity:0;transform:translateY(1rem) scale(.9);pointer-events:none}.logo{color:var(--title);font-weight:400;text-decoration:none}.logo span{opacity:.2}#header{display:flex;justify-content:space-between;align-items:center;height:90vh;padding:2rem var(--horizontal-padding);gap:3vmax;overflow-y:hidden;isolation:isolate}#header:before{content:"";width:min(100vh,100vw);aspect-ratio:1/1;background:radial-gradient(circle,var(--header-background) 0%,rgba(0,0,0,0) 70%);position:absolute;pointer-events:none;left:max(-40vh,-30vw);top:max(-10vh,-10vw);z-index:-1}#header #header-left{max-width:50rem}#header #header-left h1{font-size:4.5rem;margin-bottom:.2em;background:radial-gradient(at -10% 40%,var(--header-title) 0%,var(--title) 100%);color:transparent;background-clip:text;-webkit-background-clip:text;font-weight:700;letter-spacing:-.04em;animation-name:fade-up;animation-duration:1s;animation-delay:.5s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}@media (max-width: 800px){#header #header-left h1{font-size:3rem}}@media (max-width: 550px){#header #header-left h1{font-size:2.5rem}}#header #header-left p{font-size:1.2rem;max-width:55ch;line-height:1.5;font-weight:300;letter-spacing:.01em;animation-name:fade-up;animation-duration:1s;animation-delay:.75s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}@media (max-width: 800px){#header #header-left p{font-size:1rem}}@media (max-width: 1100px){#header #header-right{display:none}}#header #header-right .container{position:relative!important;width:25vw;aspect-ratio:1/1;animation-name:fade-up;animation-duration:1s;animation-delay:1s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}#header #header-right .container canvas{position:relative!important;width:100%;height:100%}#header #header-right .container:after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background-image:url(../../../images/house-mask.svg);background-size:contain;background-repeat:no-repeat;pointer-events:none}main{padding:0 var(--horizontal-padding) 2rem;display:flex;flex-direction:column;gap:3rem}main #big-nav{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,25vh);gap:1.5rem}@media (max-width: 1190px){main #big-nav{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,25vh)}}@media (max-width: 550px){main #big-nav{grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(4,10rem)}}main #big-nav .card{display:grid;place-items:center;border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:var(--card-padding);text-decoration:none;position:relative;isolation:isolate;transition:transform .4s ease}@media (min-width: 550px){main #big-nav .card:nth-of-type(1){grid-column:span 2;grid-row:span 2}main #big-nav .card:nth-of-type(2){grid-column:span 2}}main #big-nav .card .content{width:100%;height:100%;display:flex;justify-content:space-between;align-items:flex-end;transition:.4s ease}main #big-nav .card .content h2{font-weight:550;font-size:1.25rem}main #big-nav .card .content img{height:1.25rem;max-width:1.5rem}main #big-nav .card .center-image{position:absolute;opacity:.45;height:30%;max-width:30%;z-index:-1;transition:transform .4s ease}main #big-nav .card .text-scroller{position:absolute;overflow-x:hidden;white-space:nowrap;width:100%;display:flex;font-size:3.3vw;color:var(--title);font-weight:600;transition:font-size .4s ease}main #big-nav .card .text-scroller span{display:inline-block;animation:scroll 10s linear infinite;animation-play-state:paused;padding-left:2vw;opacity:0;transition:opacity .2s ease}main #big-nav .card.big .text-scroller{font-size:4.8vw}main #big-nav .card.big .text-scroller span{padding-left:3vw}main #big-nav .card.big:hover .text-scroller{font-size:5vw}main #big-nav .card.small .text-scroller span{animation-duration:6s}main #big-nav .card:hover{transform:scale(.98);cursor:pointer}main #big-nav .card:hover .content{transform:scale(.96);opacity:.1}main #big-nav .card:hover .center-image{transform:scale(1.1)}main #big-nav .card:hover .text-scroller{font-size:3.5vw}main #big-nav .card:hover .text-scroller span{opacity:1;animation-play-state:running}main #big-nav .card:before{content:"";width:100%;height:100%;position:absolute;top:0;left:0;border-radius:var(--border-radius);background:radial-gradient(20vh circle at var(--mouse-x) var(--mouse-y),var(--accent-color-transparent),transparent 110%);opacity:0;transition:opacity .5s ease}main #big-nav .card:hover:before{opacity:1}main #about{border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:5vmax;background:var(--card-background)}main #about h2{font-weight:400;text-transform:uppercase;margin-bottom:.4em;width:fit-content}@media (max-width: 1200px){main #about h2{font-size:1rem}}main #about h2:hover{animation:shake 1s 1 ease}@keyframes shake{0%{transform:scale(1) rotate(0)}20%{transform:scale(.95) rotate(0)}40%{transform:scale(.95) rotate(10deg)}60%{transform:scale(.95) rotate(-10deg)}80%{transform:scale(.95) rotate(0)}to{transform:scale(1) rotate(0)}}main #about p{font-size:4.5vw;color:var(--title);font-weight:500;line-height:1.1;position:relative;isolation:isolate;word-break:break-word}@media (max-width: 1200px){main #about p{font-size:3rem}}@media (max-width: 700px){main #about p{font-size:2rem}}main #about p .main{position:absolute;z-index:-1}main #about p .cover{color:transparent;background:linear-gradient(90deg,var(--card-background) 0%,var(--card-background) 50%,transparent 50%,transparent 100%);background-size:200% 100%}main #services{display:grid;display:flex;flex-direction:column;gap:1.5rem}main #services article{display:grid;grid-template-columns:repeat(2,1fr)}@media (max-width: 800px){main #services article{display:flex;flex-direction:column}}main #services article .title{border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:var(--card-padding);display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,var(--accent-color-dark) 0%,var(--card-background) 50%);z-index:2}main #services article .title h2{font-weight:500;text-align:center;font-size:2.2rem}main #services article .title h2 span{display:block;font-size:1.2rem;margin-bottom:-.5em;font-weight:400}main #services article .content{border:1px solid var(--accent-color-dark);border-left:none;border-radius:0 var(--border-radius) var(--border-radius) 0;padding:var(--card-padding);position:relative}@media (max-width: 800px){main #services article .content{border-radius:0 0 var(--border-radius) var(--border-radius);border-left:1px solid var(--accent-color-dark);border-top:none}}main #services article .content .content-title{display:flex;align-items:center;gap:1ch;margin-bottom:.5rem}main #services article .content .content-title img{height:.75rem}main #services article .content .content-title h3{font-weight:400}main #services article .content:before{content:"";border-top:1px solid var(--accent-color-dark);position:absolute;top:-1px;left:-1.5rem;width:1.5rem;height:1px}@media (max-width: 800px){main #services article .content:before{width:1px;height:1.5rem;top:-1.5rem;left:-1px;border-left:1px solid var(--accent-color-dark);border-top:none}}main #services article .content:after{content:"";border-bottom:1px solid var(--accent-color-dark);position:absolute;bottom:-1px;left:-1.5rem;width:1.5rem;height:1px}@media (max-width: 800px){main #services article .content:after{width:1px;height:1.5rem;top:-1.5rem;right:-1px;left:inherit;border-right:1px solid var(--accent-color-dark);border-top:none}}main #testimonials{border:1px solid var(--accent-color);border-radius:var(--border-radius);display:flex;flex-direction:column;gap:var(--card-padding);padding:3vmax 0}main #testimonials h2{margin:0 0 0 3vmax;font-weight:500;font-size:1.6rem}main #testimonials .scroller{overflow-x:hidden;position:relative;display:flex}@keyframes scroll{0%{transform:translate(100%)}to{transform:translate(0)}}main #testimonials .scroller .scroller-inner{display:grid;gap:3vmax;grid-template-columns:repeat(4,30rem);padding-left:3vmax;position:relative;animation:scroll 30s linear infinite reverse}main #testimonials .scroller .scroller-inner article{width:30rem;border:1px solid var(--accent-color);border-radius:calc(var(--border-radius) / 2);padding:var(--card-padding);background:radial-gradient(circle at 10% 30%,var(--accent-color-dark) 0%,var(--card-background) 50%)}main #testimonials .scroller .scroller-inner article .header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}main #testimonials .scroller .scroller-inner article .header img{height:2.3rem;aspect-ratio:1/1;border-radius:50%}main #testimonials .scroller .scroller-inner article .header .text h3{font-weight:400;margin-bottom:.1em}main #testimonials .scroller .scroller-inner article .header .text h4{font-weight:400;font-size:.8rem;color:var(--text)}main #work{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,30vh);gap:1.5rem}@media (max-width: 600px){main #work{grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(3,20vh)}}main #work a{text-decoration:none;border:1px solid var(--accent-color);padding:var(--card-padding);border-radius:var(--border-radius);display:grid;place-items:center;position:relative;transition:.4s ease}main #work a .content{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;transition:.4s ease}main #work a .content div{display:flex;justify-content:space-between}main #work a .content div h3{font-weight:550}main #work a .content div p{color:var(--title);font-weight:450}main #work a .content div img{height:1.75rem}main #work a .content div:last-of-type{align-items:flex-end}main #work a .center-image{position:absolute;height:30%;transition:.4s ease}@media (min-width: 600px){main #work a.big{grid-column:span 2}}main #work a .image-scroller{position:absolute;overflow-x:hidden;white-space:nowrap;width:100%;display:flex}main #work a .image-scroller .image-group{width:fit-content;display:flex;gap:2vw;padding-left:2vw;animation:scroll 10s infinite linear;animation-play-state:paused;opacity:0;transition:opacity .2s ease}main #work a .image-scroller .image-group img{height:12.25vh;width:12.25vw;object-fit:cover;transition:.4s ease;border-radius:.5rem}main #work a.big .image-group{animation-duration:20s}main #work a:hover{transform:scale(.98)}main #work a:hover .content{transform:scale(.96);opacity:.1}main #work a:hover .center-image{transform:scale(1.1)}main #work a:hover .image-group{animation-play-state:running;opacity:1}main #work a:hover .image-group img{height:13vh;width:13vw}main #work a:before{content:"";width:100%;height:100%;position:absolute;top:0;left:0;border-radius:var(--border-radius);background:radial-gradient(25vh circle at var(--mouse-x) var(--mouse-y),var(--accent-color-transparent),transparent 110%);opacity:0;transition:opacity .5s ease}main #work a:hover:before{opacity:1}main #contact{border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:calc(var(--card-padding) * 2) var(--card-padding);background:var(--card-background);overflow:hidden;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}main #contact h2{font-size:4rem;font-weight:500}@media (max-width: 900px){main #contact h2{font-size:3rem}}@media (max-width: 750px){main #contact h2{font-size:2rem}}main #contact h3{font-weight:400}@media (max-width: 750px){main #contact h3{font-size:1rem}}main #contact h3 a{background:var(--background);border:1px solid var(--accent-color);border-radius:var(--border-radius);text-decoration:none;font-size:.8rem;padding:.3em 1em;display:inline-block}main #contact h3 a{text-align:center;margin-top:1rem}@keyframes shake{0%{transform:scale(1) rotate(0)}20%{transform:scale(.95) rotate(0)}40%{transform:scale(.95) rotate(10deg)}60%{transform:scale(.95) rotate(-10deg)}80%{transform:scale(.95) rotate(0)}to{transform:scale(.98) rotate(0)}}main #contact #email-scroller{position:absolute;top:1vw;left:10vw;transform:rotate(9deg);display:flex;padding:.25em 0;background:var(--accent-color);text-decoration:none;overflow:hidden;width:75vw}@media (max-width: 600px){main #contact #email-scroller{top:2vw;width:80vw;transform:rotate(15deg)}}main #contact #email-scroller .scroll-group{animation:scroll 10s linear infinite;display:flex;gap:1.5rem;padding-left:1.5rem;color:var(--title)}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-100%)}}main #contact #email-scroller .scroll-group span{transition:.2s ease}main #contact #email-scroller:hover .scroll-group{animation-play-state:paused}main #contact #email-scroller:hover .scroll-group span{transform:scale(.95)}#footer{padding:var(--card-padding);margin:0 var(--horizontal-padding);display:flex;justify-content:space-between;align-items:center;z-index:100;border:1px solid var(--accent-color-light);border-bottom:none;border-radius:var(--border-radius) var(--border-radius) 0 0}@media (max-width: 850px){#footer{flex-direction:column;align-items:flex-start;justify-content:center;gap:.75rem}}#footer #footer-right{display:flex;align-items:center;gap:1vmax 2vmax}@media (max-width: 850px){#footer #footer-right{flex-direction:row-reverse;flex-wrap:wrap;justify-content:flex-end}}#footer #footer-right .link{text-decoration:none;transition:.1s ease;text-decoration:underline 1px;text-decoration-color:#fff0}@media (max-width: 900px){#footer #footer-right .link{font-size:.8rem}}#footer #footer-right .link:hover{color:var(--title);cursor:pointer;text-decoration-color:#ffffff4d}
