.hero{height:100vh;.logo{position:absolute;z-index:1;top:1vw;left:2vw;img{max-height:var(--nuvia-logo-size);max-width:var(--nuvia-logo-size);object-fit:contain}}.nuvia-container{position:absolute;bottom:4vw;right:3vw;@media(min-width:0px)and (max-width:576px){left:0;right:0;width:fit-content;margin:auto}h2{font-size:var(--medium-text);height:var(--medium-text);letter-spacing:-.2vw;font-weight:100}}.slogan-container{position:absolute;bottom:4vw;left:3vw;@media(min-width:0px)and (max-width:576px){text-align:center;left:0;right:0;top:calc(15vh + 2vh + 3 * var(--hero-h1-font-size))}h2{font-size:var(--small-text);height:var(--small-text);font-weight:100}}.heading-container{display:flex;flex-direction:column;height:fit-content;width:fit-content;position:absolute;inset:0;margin:auto;@media(min-width:0px)and (max-width:576px){margin-top:15vh}z-index:20}.reveal-animation-container{overflow:hidden}.heading{margin:0;font-size:var(--hero-h1-font-size);height:var(--hero-h1-heigh-size);font-weight:400;letter-spacing:-.5vw;&.center{text-align:center}&.end{text-align:end}&.reveal{animation-name:reveal;animation-duration:2s;animation-fill-mode:forwards;transform:translate3d(0,100%,0)}&.reveal-dealyed{animation-delay:.5s}}.images-container{position:absolute;inset:0;overflow:hidden;perspective:0;animation-name:images-reveal;animation-fill-mode:forwards;animation-duration:3s;animation-timing-function:ease;@media(min-width:0px)and (max-width:576px){top:45%}.image-container{position:absolute;transform-style:preserve-3d;box-shadow:0 2vw 3vh #0003;border-radius:2rem;img{border-radius:2rem;max-height:27vw;max-width:27vw;object-fit:cover}&.first{transform:rotate(5deg) rotateX(11deg) rotateY(-37deg) translateZ(-200vw)}&.second{transform:rotate(3deg) rotateX(-8deg) rotateY(19deg) translateZ(-200vw)}&.third{transform:rotate(-2deg) rotateX(9deg) rotateY(16deg) translateZ(-200vw)}&.fourth{transform:rotate(-1deg) rotateX(-10deg) rotateY(-17deg) translateZ(-260vw)}&.fifth{transform:rotate(0) rotateX(20deg) rotateY(1deg) translateZ(-200vw)}&.sixth{transform:rotate(0) rotateX(-3deg) rotateY(-28deg) translateZ(-317vw)}}}}@keyframes reveal{to{transform:translateZ(0)}}@keyframes images-reveal{to{perspective:100vw}}.about-us{height:200vh;margin-top:40vh;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){margin-top:5rem;margin-bottom:5rem;height:auto}view-timeline-name:--about-us-scroller-element;.floating-container{position:sticky;top:3vw;height:100vh;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){height:auto}.texts-container{display:flex;flex-direction:column;align-items:center;text-align:center;:nth-child(2){margin-bottom:1.5vh}.text-container{overflow:hidden;z-index:1;h4{animation:hide-text-about-us;animation-timeline:--about-us-scroller-element;animation-range:entry 80% cover 84%;font-size:var(--large-text);letter-spacing:-.2vw;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){text-align:center;animation:none}}h3{animation:hide-text-about-us;animation-timeline:--about-us-scroller-element;animation-range:entry 80% cover 84%;font-size:var(--medium-text);font-weight:100;letter-spacing:-.2vw;color:gray;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){text-align:center;animation:none}}}}.image-container{display:flex;position:absolute;top:8vh;width:100%;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){margin-top:5vh;position:static;top:calc(3vh + var(--medium-text) * 2)}img{animation:image-scale;animation-timeline:--about-us-scroller-element;animation-range:entry 0% cover 100%;margin:auto;height:auto;max-width:90vw;max-height:85vh;object-fit:cover;border-radius:2rem;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){animation:none}}}}}@keyframes hide-text-about-us{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes image-scale{0%{transform:scale(.3)}to{transform:scale(1)}}:root{--primary-color: #1c5d7d;--font-color: #2d2d2d;--nuvia-logo-size: 5vw;--hero-h1-font-size: 11vw;--hero-h1-heigh-size: 11.5vw;--xs-text: 1.3vw;--small-text: 1.7vw;--medium-text: 3vw;--large-text: 5vw;--xl-text: 9vw;@media(min-width:0px)and (max-width:576px){--nuvia-logo-size: 3rem;--hero-h1-font-size: 4.5rem;--hero-h1-heigh-size: 4.5rem;--xs-text: .8rem;--small-text: 1rem;--medium-text: 2rem}@media(min-width:577px)and (max-width:768px){--nuvia-logo-size: 4rem;--hero-h1-font-size: 7rem;--hero-h1-heigh-size: 7rem;--xs-text: 1rem}}html,body{background-color:#fff;margin:0;font-family:var(--font-inter-tight);color:var(--font-color)}h1,h2,h3,h4,h5,h6{margin:0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#1a1a1a;border-radius:10px}::-webkit-scrollbar-thumb{background:#404040;border-radius:10px;border:2px solid #1a1a1a}::-webkit-scrollbar-thumb:hover{background:#555}*{scrollbar-width:thin;scrollbar-color:#404040 #1a1a1a}.portfolio{--projects-overflow: .8rem;--animation-start: 50%;--primary-color: #1c5d7d;padding:0 5rem;padding-bottom:30vh;position:absolute;top:0;width:100%;z-index:1;background-color:#fff;box-sizing:border-box;box-shadow:0 20vw 20vw -20vw #00000017;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){padding:0;position:static;box-shadow:none}.portfolio-header{padding:2rem 0 6rem;display:flex;flex-direction:column;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){padding:2rem 0 3rem;gap:1rem}}.title-container{display:flex;align-items:start;flex-direction:column}.title{font-size:var(--xl-text);@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){text-align:center}}.subtitle{font-size:var(--small-text);max-width:60%;margin:0;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){max-width:75%;text-align:center;margin-left:auto;margin-right:auto}}.portfolio-container{display:flex;view-timeline-name:--portfolio-timeline;position:relative;.floating-container{position:sticky;top:0;height:70vh;width:40%;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){display:none}.number-display{position:absolute;top:5vh;height:var(--xl-text);overflow:hidden;.available-numbers{display:flex;flex-direction:column;height:fit-content;animation:numbers-scroll;animation-timeline:--portfolio-timeline;animation-fill-mode:both;animation-range:entry var(--animation-start) exit var(--animation-start);h2{font-size:var(--xl-text);height:var(--xl-text)}}}.numbers-dot{color:var(--primary-color)}.projects-name-container{position:absolute;top:30vh;width:50vw;display:flex;flex-direction:column;span{animation-timeline:--portfolio-timeline;animation-fill-mode:both;animation-range:entry var(--animation-start) exit var(--animation-start);font-size:var(--xs-text)}:nth-child(1){animation-name:highlight-first}:nth-child(2){animation-name:highlight-second}:nth-child(3){animation-name:highlight-third}}.projects-description-display{position:absolute;top:80vh;width:50vw;overflow:hidden;height:calc(var(--medium-text) + var(--xs-text) + var(--projects-overflow));.available-project-details{animation:project-details-scroll;animation-timeline:--portfolio-timeline;animation-fill-mode:both;animation-range:entry var(--animation-start) exit var(--animation-start);div{height:calc(var(--medium-text) + var(--xs-text) + var(--projects-overflow))}h3{font-size:var(--medium-text);margin-bottom:8px;height:var(--medium-text)}h4{font-size:var(--xs-text);font-weight:100;height:var(--xs-text)}}}}.images-container{display:flex;flex-direction:column;align-items:center;width:60%;gap:3rem;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){width:100%}.image-container:nth-child(1){margin-top:10vh;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){margin-top:0}}.image-container{animation:image-scale-in-out;animation-timeline:view();animation-fill-mode:both;animation-range:entry 35% exit 70%;position:relative;.image-description-container{position:absolute;bottom:5%;margin:0 1rem;width:calc(100% - 2rem);padding:1.2rem 1rem;box-sizing:border-box;background-color:color-mix(in oklab,black 60%,transparent);backdrop-filter:blur(18px);color:#fff;border-radius:1rem;display:flex;align-items:center;justify-content:center;h2{font-size:var(--xs-text);text-align:center;white-space:pre;@media(min-width:577px)and (max-width:768px){font-size:var(--medium-text)}@media(min-width:0px)and (max-width:576px){font-size:var(--small-text)}}h2:nth-child(2){font-weight:400;@media(min-width:0px)and (max-width:576px){display:none}}}img{border-radius:1rem;height:auto;width:auto;max-height:65vh;max-width:90vw;object-fit:contain}}}}}@keyframes numbers-scroll{0%,30%{transform:translateY(0)}36%,63%{transform:translateY(calc(var(--xl-text) * -1))}69%,to{transform:translateY(calc(var(--xl-text) * -2))}}@keyframes project-details-scroll{0%,30%{transform:translateY(0)}36%,63%{transform:translateY(calc((var(--medium-text) + var(--xs-text) + var(--projects-overflow)) * -1))}69%,to{transform:translateY(calc((var(--medium-text) + var(--xs-text) + var(--projects-overflow)) * -2))}}@keyframes highlight-first{0%,30%{color:var(--primary-color);margin-left:.5rem}36%{color:var(--font-color);margin-left:0}}@keyframes highlight-second{30%{color:var(--font-color);margin-left:0}36%,63%{color:var(--primary-color);margin-left:.5rem}69%{color:var(--font-color);margin-left:0}}@keyframes highlight-third{63%{color:var(--font-color);margin-left:0}69%,to{color:var(--primary-color);margin-left:.5rem}}@keyframes image-scale-in-out{0%{transform:scale(.7)}50%{transform:scale(1)}to{transform:scale(.7)}}.contact{min-height:100vh;position:sticky;top:0;a{text-decoration:none;color:var(--font-color);&:hover{svg{transform:scale(1.1)}}}.text-container{position:absolute;top:3vw;left:3vw;@media(min-width:0px)and (max-width:576px){top:5vh;left:0;right:0;margin:0 auto;width:fit-content;h1{text-align:center}}h1{font-size:var(--large-text)}}.nuvia-logo{position:absolute;top:4vw;right:5vw;display:flex;@media(min-width:0px)and (max-width:576px){height:auto;width:16vw;top:28vh;right:0;left:0;margin:0 auto}}.contact-us-container{position:absolute;top:50%;left:3vw;@media(min-width:0px)and (max-width:576px){left:0;right:0;margin:0 auto;width:fit-content}h2{font-size:var(--small-text);font-weight:100;position:relative;display:inline-block;padding-bottom:.25em;&:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--font-color);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.contact-us-container a:hover &:after{transform:scaleX(1)}}}.contact-info-container{display:flex;gap:1vw;flex-direction:column;position:absolute;bottom:4vw;left:3vw;@media(min-width:0px)and (max-width:576px){left:0;right:0;margin:0 auto;width:fit-content;bottom:20vw;display:flex;flex-direction:column;align-items:center;justify-content:center}a{display:flex;align-items:center;gap:.75em}h3{font-size:var(--small-text);font-weight:100;position:relative;display:inline-block;padding-bottom:.25em;&:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--font-color);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}}.number-container a:hover h3:after,.mail-container a:hover h3:after{transform:scaleX(1)}}.social-media-container{position:absolute;bottom:4vw;right:3vw;display:flex;gap:1vw;@media(min-width:0px)and (max-width:576px){left:0;right:0;margin:0 auto;width:fit-content}svg{height:var(--medium-text)}}}.portfolio-contact-container{position:relative;min-height:450vh;@media(min-width:577px)and (max-width:768px),(min-width:0px)and (max-width:576px){min-height:auto}}
