header{padding:1.5rem 0 1rem;position:fixed;width:100%;top:0;z-index:3;background-color:#fff}header nav{position:relative}header img{width:90px}header .content-width{display:grid;grid-template-columns:1fr 2fr;align-items:center;gap:3rem}header h1{margin:0;line-height:0}header .menu ul{display:flex;list-style:none;justify-content:flex-end;align-items:center;gap:2.6rem;font-family:Inter,sans-serif;margin-block-end:.6rem;padding:0;margin:0}header .menu ul li,header .menu ul a{color:#2d4665;line-height:1;cursor:pointer;text-decoration:none;font-size:1.1rem}header .menu ul li:hover,header .menu ul a:hover{text-decoration:underline}header .menu ul li.active,header .menu ul a.active{font-weight:700}header .menu ul li{flex-shrink:0}header .hamburger-menu{display:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0)}header .hamburger-menu.active .bar-top{transform:translateY(-50%) rotate(-135deg);top:50%}header .hamburger-menu.active .bar-mid{opacity:0}header .hamburger-menu.active .bar-bottom{transform:translateY(-50%) rotate(-45deg);top:50%}header .ham-bar{width:100%;height:4px;background-color:#000;position:absolute;top:calc(50% - 2px);right:0;transition:transform .6s,opacity .8s,top .6s}header .ham-bar:first-child,header .ham-bar:last-child{width:85%;right:0}header .ham-bar.bar-bottom{top:calc(100% - 4px)}header .ham-bar.bar-top{top:0}.saving{position:fixed;bottom:1rem;left:50%;width:244px;color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:row;gap:10px;z-index:999;font-family:Inter,sans-serif;font-size:.8rem;font-weight:700;padding:10px 0;transform:translate(-50%);transition:bottom .3s ease-in-out;overflow:hidden;pointer-events:auto;background:linear-gradient(180deg,#13151a,#13151ae0);border:1px solid #343841;border-radius:30px;box-shadow:0 0 #13151a4d,0 1px 2px #13151a4a,0 4px 4px #13151a42,0 10px 6px #13151a26,0 17px 7px #13151a0a,0 26px 7px #13151a03}.saving.off{bottom:-80px}.saving span{display:flex;align-items:center;gap:8px}.saving svg{max-width:20px}.category-bar,.conventions{display:grid;grid-template-columns:1fr 1fr 1fr 1fr}.conventions{margin-top:.5rem;font-size:.8rem}.category-trend{height:24px;position:relative;overflow:hidden;padding:4px}.category-trend:before{position:absolute;top:50%;transform:translateY(-50%);font-size:.8rem;line-height:1;color:#fff}.category-trend:after{content:"";position:absolute;top:0;right:0;height:100%;width:4px}.category-trend:nth-child(1),.category-detail:nth-child(1):before,.category-trend:nth-child(1):after{background-color:#ff009c}.category-trend:nth-child(1):before{content:"Design"}.category-trend:nth-child(2),.category-detail:nth-child(2):before,.category-trend:nth-child(2):after{background-color:#7543ff}.category-trend:nth-child(2):before{content:"Development"}.category-trend:nth-child(3),.category-detail:nth-child(3):before,.category-trend:nth-child(3):after{background-color:#37497f}.category-trend:nth-child(3):before{content:"Data"}.category-trend:nth-child(4),.category-detail:nth-child(4):before,.category-trend:nth-child(4):after{background-color:#67b521}.category-trend:nth-child(4):before{content:"Project"}.category-detail{display:flex;align-items:center}.category-detail:before{content:"";width:12px;height:12px;margin-right:.5rem}.time-site{margin:1rem 0}.go-to-data{display:grid;grid-template-columns:1fr 1fr;max-width:480px;gap:1rem}.sources span{text-align:center}.review .title{font-weight:700;font-size:.9rem;margin-bottom:.7rem}.sources a{display:flex;align-items:center;gap:.7rem;font-family:Inter,sans-serif;padding:.5rem;color:#02832e;text-decoration:none;font-weight:400;font-size:.9rem;font-weight:700;border:1px solid;text-align:center;justify-content:center;border-radius:.3rem;position:relative}.sources a:hover{background-color:#f0f0f0}.sources a:after{content:"";position:absolute;top:0;right:0;height:100%;width:100%;display:block}.sources:last-child a{color:#4285f4}.review{margin-top:1.4rem}.advertisement{font-style:italic;font-size:.9rem;margin:0 0 1.5rem}.profile-ico{text-align:center;font-size:.5rem;font-weight:700}.user-profile{padding:1rem;border:1px solid #eee;border-radius:.8rem;max-width:25rem;margin:auto}.title-profile{display:flex;align-items:center;justify-content:space-evenly;gap:1rem}.user-events{display:grid;margin-top:2rem;padding-top:1rem;grid-template-columns:repeat(4,1fr);row-gap:1rem;column-gap:2rem;margin-bottom:1.4rem}.grid-event{position:relative;background-color:#f3f3f3;padding:1rem;border-radius:.5rem}.grid-event:first-child:before{content:"Latest Events";font-style:italic;display:block;position:absolute;left:0;top:0;transform:translateY(-150%)}#analytics-button{position:fixed;display:flex;right:2rem;bottom:1rem;padding:1rem;background-color:#fff;border-radius:.5rem;box-shadow:0 0 .5rem #0003;align-items:center;gap:1rem;font-size:.8rem;font-family:Montserrat,sans-serif;cursor:pointer;z-index:2;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0)}#analytics-button.with-notification:before{content:attr(notification-number);text-align:center;line-height:24px;position:absolute;color:#fff;top:3px;right:5px;transform:translate(50%,-50%);width:24px;height:24px;background-color:red;border-radius:50%;z-index:99}#analytics-button span{display:none}#analytics-button:hover span{display:block}#analytics-button:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%}.user-data{display:grid;grid-template-columns:1fr 1fr;max-width:16rem}.user-data .subtitle{font-weight:700;color:#333}.grid-event{font-size:.9rem}.grid-event .title{font-weight:700;margin-bottom:.5rem}#saving-alert svg path:nth-child(1){animation:rotate1 2s infinite linear forwards}#saving-alert svg path:nth-child(1),#saving-alert svg path:nth-child(2),#saving-alert svg path:nth-child(3){transform-origin:50px 50px}#saving-alert svg path:nth-child(2){animation:rotate2 1s infinite linear forwards}#saving-alert svg path:nth-child(3){animation:rotate3 2s infinite linear forwards}@keyframes rotate1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotate2{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}@keyframes rotate3{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:940px){#analytics-data .popup{padding:1.5rem 1rem;max-height:94vh;font-size:.9rem}#analytics-data .popup h3{font-size:1rem}#analytics-data .popup .scrollable{padding-right:4px}.advertisement{width:calc(100% - 56px);margin-bottom:1rem}.conventions{grid-template-columns:1fr}.title-profile{flex-direction:column}.user-events{grid-template-columns:repeat(2,1fr);row-gap:1rem;column-gap:1rem}.user-profile{max-width:20rem}#analytics-button{right:1.5rem}}@media(max-width:940px)and (orientation:landscape){#analytics-data .popup .scrollable{max-height:40vh!important}}footer{margin-bottom:2rem}footer p{margin:0;text-align:center;font-family:Inter,sans-serif}footer p.small-link{font-size:.8rem;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0)}.with-tooltip{position:relative}.with-tooltip:before,.with-tooltip:after{--scale: 0;--arrow-size: 4px;--tooltip-color: #25262d;position:absolute;top:-.25rem;left:50%;transform:translate(-50%) translateY(var(--translate-y, 0)) scale(var(--scale));transition:.15s transform;transform-origin:bottom center}.with-tooltip:before{--translate-y: calc(-100% - var(--arrow-size));content:attr(tooltip-data);color:#fff;padding:.5rem .4rem;border-radius:.3rem;text-align:center;font-size:.65rem;font-weight:600;width:min-content;font-family:Inter,sans-serif;min-width:50px;background:var(--tooltip-color)}.with-tooltip:hover:before,.with-tooltip:hover:after{--scale: 1}.with-tooltip:after{--translate-y: calc(-1 * var(--arrow-size));content:"";border:var(--arrow-size) solid transparent;border-top-color:var(--tooltip-color);transform-origin:top center}.black-and-white{filter:grayscale(100%);opacity:.4}.black-and-white.with-tooltip:after,.black-and-white.with-tooltip:before{display:none}*,*:before,*:after{box-sizing:border-box}body{margin:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body.no-scroll{overflow:hidden}html{scroll-behavior:smooth}html:focus-within{scroll-behavior:smooth}.content-width{width:clamp(0px,90rem,100% - 52px);margin-inline:auto}.content-width-section{width:clamp(0px,70rem,100% - 52px);margin-inline:auto}img{display:block}section{scroll-margin-top:5rem;margin-bottom:4rem}section#skills img{max-width:100%;height:auto}section#about-me{scroll-margin-top:10rem}section#about-me img{max-width:100%;height:auto}section#experience{scroll-margin-top:8rem}section#projects img{max-width:100%;height:auto}section#gallery{scroll-margin-top:8rem}section#gallery img{max-width:100%;width:100%;height:auto}.main-skills{padding:4rem 0 4.5rem}p.main-paragraph{font-size:1rem;font-family:Inter,sans-serif;color:#2d4665;letter-spacing:.01em;margin:0;line-height:1.6;font-weight:400}.flex-row{display:flex;gap:.4rem}.has-popup{position:fixed;overflow:hidden;height:100%;width:100%}.popup-mask{position:fixed;top:0;left:0;width:100vw;height:100%;background-color:#00000080;z-index:3}.close-popup{position:fixed;top:1rem;right:0rem;height:40px;width:40px;transform:translate(100%);line-height:40px;cursor:pointer;font-family:Montserrat,sans-serif;background-color:#e00;color:#fff;border-radius:0 .4rem .4rem 0;font-size:1.2rem;text-align:center;font-weight:600;filter:drop-shadow(0 0 .5rem rgba(0,0,0,.2))}.close-popup:hover{background-color:red}.popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:80vw;background-color:#fff;z-index:1;font-family:Inter,sans-serif;box-shadow:0 0 1rem #0003;border-radius:1rem;padding:2rem;z-index:4}.popup .scrollable{overflow:scroll}#analytics-data .popup .scrollable{max-height:60vh}.popup-controller{display:none}.popup-controller.show{display:block}.hiden{display:none!important}.sr-only{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}main{padding-top:77px}@media(max-width:940px){.popup,#gallery-popup .popup{width:94vw;max-height:78vh;padding:2rem 1rem}.popup .close-popup,#gallery-popup .popup .close-popup{transform:translateY(25%);border-radius:100%;top:1rem;right:1rem;background-color:#464646;font-size:1rem;line-height:30px;height:30px;width:30px}#gallery-popup .scrollable{max-height:calc(78vh - 6.1rem)}#gallery-popup h2{font-size:1rem;padding-bottom:.7rem;margin:0 0 .9rem}#gallery-popup img{border-radius:.5rem}#gallery-popup .image-limiter{padding-right:4px}}p.dog-text{margin:0;color:#b3dbff;font-family:Inter,sans-serif;font-size:.85rem;width:84px;padding-left:6px;font-weight:600}span.dots-cycle:before{animation:blink 1s infinite;content:"";display:inline-block}@keyframes blink{0%{content:"."}33%{content:".."}66%{content:"..."}to{content:"..."}}.bold-font{font-weight:600}.interactive-instruction{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:rgba(0,0,0,0);position:relative;border-radius:.5rem;overflow:hidden;cursor:pointer}.interactive-instruction:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%}.interactive-instruction:hover{background-color:#f6f6f6}.analytics-button-side{display:flex;gap:.6rem;align-items:center}.analytics-button-instruction{display:flex;align-items:center;justify-content:center;height:30px;width:30px;border-radius:5px;background-color:#fff;box-shadow:0 0 10px #0000001a}.bullet-content{flex:1}.flip-item{background-color:transparent;perspective:1000px;height:100%;position:relative}.flip-content{position:relative;height:100%;transition:transform .6s;transform-style:preserve-3d}.flip-item.active .flip-content{transform:rotateY(180deg)}.flip-front,.flip-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:rotateY(0);top:0}.flip-front:before,.flip-back:before{content:"";width:0px;height:0px;border-style:solid;border-width:0 0 10px 10px;border-color:transparent transparent #ff4532 transparent;border-bottom-left-radius:4px;right:.5rem;bottom:.5rem;position:absolute}.flip-back:before{border-color:transparent transparent #007aff transparent}.flip-back{padding:1rem;transform:rotateY(180deg)}.invert{filter:invert(1)}.flex-100{flex:100%}#analytics-instruction-block,#development-instruction-block,#project-instruction-block{position:fixed;transform:translateY(50%);bottom:50%;right:-200px;transition:all .5s ease-in-out;opacity:0;display:flex;flex-direction:column;align-items:center;z-index:5;gap:1rem;padding:1.4rem;max-width:260px;border-radius:.6rem}.popup-information{display:flex;flex-direction:column;gap:1rem;padding:0 1rem}#beyond-popup .popup{max-height:90vh;max-width:920px}#beyond-popup h2{margin:0;font-family:Montserrat,sans-serif;font-weight:400}.bullets-detail{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem}.bullet-image{max-width:50px;width:15%}.bullet-image img,.bullet-image svg{display:block;margin:auto;max-width:100%}.bullet-row{display:flex;gap:6%;align-items:center;padding:1rem}.bullet-row.opacity-0{opacity:0}.inline-img{display:inline-block;margin:0 0 -2px 2px}.inline-img.down-icon{margin-bottom:-4px;margin-top:-4px}.inline-img.keep-inline{margin:0}.bullet-row a{text-decoration:none;color:#333}span.span-block{display:block}#beyond-popup .subtle{font-size:.8rem;font-weight:400;color:gray}.final-instruction{margin-top:1rem}#beyond-popup .popup .scrollable{max-height:calc(90vh - 7rem);padding-right:8px}@media(max-width:940px)and (orientation:landscape){#beyond-popup .popup .scrollable{max-height:40vh!important}}@media(max-width:768px){.bullets-detail{grid-template-columns:1fr}.bullet-row{margin:0;padding:.6rem}.popup-information{padding:0;gap:.8rem}#beyond-popup{font-size:.85rem}#beyond-popup h2{font-size:1.4rem;padding-right:40px}#beyond-popup .popup{padding:1.5rem 1rem}}@media(max-width:1300px){#projects .projects-section .projects-container{width:100%;gap:2rem}#projects img{max-width:100%;position:relative;width:100%;height:auto;max-height:280px}#projects .small-project,#projects .big-project{max-width:520px}#projects .small-project{padding:1.2rem 1.4rem 1.4rem}#projects .small-project .status-controller{padding:0 0 .6rem .6rem}#projects .small-project .bg-small{padding:0 1rem;text-align:center}#projects .small-project .bg-small .status-small{top:1.2rem;right:1.4rem}#projects .small-project .bg-small img{margin-top:3.5rem;height:auto;margin-bottom:1rem}#projects .big-project{flex-direction:column-reverse;padding:1.2rem 1.4rem 2rem;border-radius:1rem}#projects .big-project .interface-bg{border-radius:1rem;padding-top:4rem}#projects .big-project .information{padding:0;width:100%}#projects .big-project .information p{font-family:Inter,sans-serif;color:#2d4665;letter-spacing:.01em;margin:0;line-height:1.6;font-weight:400;font-size:.9rem}#projects .big-project .information h2{font-size:1.4rem;margin-top:1rem;margin-bottom:.5rem}#projects .big-project .information h3{margin-top:1rem;margin-bottom:.6rem}#projects .big-project .status-head{padding:0 0 .6rem .6rem}#projects .big-project .status-head .status{font-size:.8rem;padding:.4rem 1rem}#projects .big-project .status-head .status .curve-1:after,#projects .big-project .status-head .status .curve-1:before,#projects .big-project .status-head .status .curve-2:after,#projects .big-project .status-head .status .curve-2:before{width:2rem;height:2rem}}@media(max-width:940px){header{padding:10px 0 8px}header img{max-width:80px}header .menu{display:none}header .menu.active{display:block;position:fixed;width:100%;top:50px;left:0;background-color:#fff;padding:1rem 0}header .menu.active ul{flex-direction:column;gap:0;align-items:stretch}header .menu.active ul a{display:block;padding:1rem 1.5rem}header .hamburger-menu{display:block;height:22px;width:30px;position:relative;cursor:pointer;margin-right:0;margin-left:auto}header .hamburger-menu:before{content:attr(section-menu);display:block;position:absolute;top:50%;left:0;transform:translate(-120%,-50%);width:108px;font-size:1.2rem;color:#afafaf;font-family:Inter,sans-serif;text-align:right;color:#2d4665;font-size:1.1rem;opacity:.3;transition:opacity .3s ease-in-out}header .hamburger-menu:after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%}header .hamburger-menu.active:before{opacity:0}main{padding-top:50px}section{max-width:100%}section#experience{scroll-margin-top:7rem}section#projects{scroll-margin-top:3.3rem}section#gallery{scroll-margin-top:7rem}section#contact{scroll-margin-top:3rem}#contact .contact-section{flex-direction:column;gap:0rem}#contact .contact-section .personal-info{max-width:100%;padding:1rem 0 2rem}#contact .contact-section .personal-info:before{transform:translate(-50%);width:100vw;left:50%}#contact .contact-section .form-content{width:100%}.image-gallery{flex-direction:column;align-items:center}#projects .projects-section .projects-container{flex-direction:column-reverse}}