body{font-family:Onest,sans-serif;color:var(--txt-color);background-color:var(--bg-color);margin:0}html{scroll-behavior:smooth;font-family:Onest,sans-serif}#root *{box-sizing:border-box}h2{font-family:Onest,sans-serif;font-weight:700;font-size:22px}#phone-name{display:none;z-index:111}#projects{background-color:#bbbfca}#header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:1.25em 6em;background-color:var(--primary-color);box-shadow:#fe7b7b14 0 4px 12px;position:fixed;z-index:55555;transition:all .5s ease}#header ol{padding:0}.dark-mode #header{box-shadow:#00000073 0 25px 20px -20px}.dark-mode{color:var(--txt-color-dark)}.dark-mode #header{background-color:var(--primary-color-dark)}#header.scrolled-header{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:.3em 6em}#header nav ol{gap:2.5em;font-weight:600;display:flex}#header a{text-decoration:none;color:var(--font-color)}#header li{list-style-type:none}#header ol a:hover{transition:all .4s ease;color:var(--hover-color)}#header .icon{display:none;justify-content:center}#header h2{display:flex;align-items:center;justify-content:center;gap:.6em}.theme-toggle{padding:0;margin:0}.theme-toggle{display:flex;align-items:start}.theme-btn{padding-top:1px;margin:0;display:flex;align-items:center}.theme-toggle svg{max-width:20px;max-height:20px;margin:0;padding:0;fill:var(--txt-color);transition:all .5 ease}.dark-mode .theme-toggle svg{fill:var(--txt-color-dark)}.theme-toggle svg:hover{fill:var(--hover-color)}.dark-mode .theme-toggle svg:hover{fill:var(--hover-color-dark)}.icon>svg{width:24px;height:24px}.main-section{max-width:1080px;margin:0 auto}.main-section article{width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.hero-h1{display:flex;line-height:2.5em;font-weight:500;gap:2em;flex-direction:column}h2{font-family:Fugaz One,sans-serif}.hero-h1 span span{font-size:84px;font-family:Fugaz One,sans-serif;font-weight:700;transform:scale3d(1)}.hero-hovered{animation:jello-horizontal .5s both}@keyframes jello-horizontal{0%{-webkit-transform:scale3d(1,1,1);transform:scaleZ(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scaleZ(1)}}.hero-h1 span{display:flex;justify-content:center}#hero,#projPage{min-height:100vh}#projPage h2{padding-top:100px}#projPage .proj-grid{display:grid}.dark-mode .hero-h1 span span{color:var(--secondary-color-dark)}.hero-h1 span span:hover{color:var(--hover-color);cursor:default}.dark-mode .hero-h1 span span{color:var(--txt-color-dark)}.dark-mode .hero-h1 span span:hover{color:var(--hover-color-dark);cursor:default}.rounded-image{width:50px;height:50px;border-radius:50%;overflow:hidden}.rounded-image div{background-image:url(./images/mirkodev.jpg);width:50px;height:50px;background-size:cover;background-position:center center;overflow:hidden;transform:scale(4)}#hero p{text-align:center;margin:25px 0 15px;font-size:20px;max-width:500px;font-weight:500}.section-background{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--bg-color) radial-gradient(var(--txt-color) 10%,transparent 1%);background-size:11px 11px;z-index:-111;opacity:.3}.dark-mode .section-background{background-color:var(--bg-color-dark);opacity:1}#waves{z-index:111}#waves svg{left:0;position:absolute;bottom:-1px;z-index:1;width:100%;pointer-events:none}#about #waves:nth-child(1){transform:rotateX(180deg);margin:0 auto;height:200px}.dark-mode #waves svg path{fill:var(--waves)}button{position:relative;display:inline-block;cursor:pointer;outline:none;border:0;vertical-align:middle;text-decoration:none;background:transparent;padding:0;font-size:inherit;font-family:inherit;margin-top:10px;z-index:1111}button.learn-more{width:12rem;height:auto}button.learn-more .circle{transition:all .45s cubic-bezier(.65,0,.076,1);position:relative;display:block;margin:0;width:3rem;height:3rem;background:var(--hover-color);border-radius:1.625rem}.dark-mode button.learn-more .circle{background:var(--hover-color-dark)}button.learn-more .circle .icon{transition:all .45s cubic-bezier(.65,0,.076,1);position:absolute;top:0;bottom:0;margin:auto;background:#fff}button.learn-more .circle .icon.arrow{transition:all .45s cubic-bezier(.65,0,.076,1);left:.625rem;width:1.125rem;height:.125rem;background:none}button.learn-more .circle .icon.arrow:before{position:absolute;content:"";top:-.29rem;right:.0625rem;width:.625rem;height:.625rem;border-top:.125rem solid #fff;border-right:.125rem solid #fff;transform:rotate(45deg)}button.learn-more .button-text{transition:all .45s cubic-bezier(.65,0,.076,1);position:absolute;top:0;left:0;right:0;bottom:0;padding:.75rem 0;margin:0 0 0 1.85rem;color:var(--txt-color);font-weight:700;line-height:1.6;text-align:center;text-transform:uppercase}.dark-mode button.learn-more .button-text{color:var(--txt-color-dark)}@media screen and (min-width: 768px){button:hover .circle{width:100%;background-color:var(--hover-color)}}button:hover .circle .icon.arrow{background:#fff;transform:translate(1rem)}button:hover .button-text{color:#fff}#socials .theme-toggle{display:none}#socials .theme-toggle svg{min-width:32px;min-height:32px}@media screen and (max-width: 768px){#header{position:fixed;bottom:0;justify-content:center;padding:.5em 0;border-top-left-radius:12px;border-top-right-radius:12px;gap:5em}#header.scrolled-header{padding:.5em}#header nav ol{gap:.6em;font-weight:600;font-size:14px;margin:0}#header h2,#header .theme-toggle{display:none}#phone-name{display:flex;position:absolute;top:.8em;left:1em}#header .icon{display:flex;justify-content:center}#waves{display:none}#socials .theme-toggle{display:flex}}#skills{background-color:var(--primary-color);width:100%;padding:70px 0 125px;margin:0}.dark-mode #skills{background-color:var(--primary-color-dark)}.divider{margin:.6em 0;display:flex;justify-content:center;align-items:center}.divider span{width:55px;height:6px;background-color:var(--hover-color);border-radius:10px}.section-heading p{max-width:500px;text-align:center;margin:0 auto}#skills-grid{display:grid;grid-template:1fr 1fr /1fr 1fr 1fr 1fr;gap:30px 0;width:100%;padding:50px 0}@media screen and (max-width: 876px){#skills-grid{grid-template:1fr 1fr 1fr /1fr 1fr 1fr}}@media screen and (max-width: 662px){#skills-grid{grid-template:1fr 1fr 1fr /1fr 1fr;width:90%;margin:0 auto;gap:50px 0}}#skills .card{width:190px;height:254px;margin:0 auto;background-color:var(--secondary-color);border-radius:8px;z-index:1;box-shadow:#959da533 0 8px 24px;transition:all .5s ease}.dark-mode #skills .card{background-color:var(--bg-color-dark);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}#skills .card:hover{transform:scale(1.1)}#skills .card__content{display:flex;justify-content:center;align-items:center;flex-direction:column;height:75%;gap:10px}#skills .card__content svg{width:89px;height:89px}#skills .tools{display:flex;align-items:center;padding:9px}.circle{padding:0 4px}.box{display:inline-block;align-items:center;width:10px;height:10px;padding:1px;border-radius:50%}.red{background-color:#ff605c}.yellow{background-color:#ffbd44}.green{background-color:#00ca4e}#about .card{max-height:400px}.dark-mode #projects{background-color:var(--primary-color-dark)}.dark-mode #projects .card .card__descr-wrapper{background-color:var(--bg-color-dark);color:var(--txt-color-dark)}.card__img{width:100%;height:100%;max-height:250px;min-height:225px;object-fit:cover;border-radius:20px 20px 0 0;background-color:var(--hover-color)}.card__img img{border-radius:20px 20px 0 0;object-fit:cover;object-position:center;width:100%;min-height:100%;max-height:200px}#projects-grid .card:nth-child(1) .card__img img{object-position:top}.card__descr-wrapper{padding:15px;display:grid;background-color:var(--bg-color);min-height:100%}.card__title{color:currentColor;text-align:center;margin-bottom:5px;font-weight:900;font-size:16px}.card__descr{color:currentColor;max-height:175px;text-overflow:ellipsis;overflow:hidden}.svg{width:25px;height:25px;fill:var(--font-color)}.card__links{margin-top:10px;display:flex;justify-content:space-between;align-self:flex-end}.card__links svg{fill:currentColor}.card__links div{display:flex;align-items:center;gap:.3em}.card__links .link{color:currentColor;font-weight:600;font-size:15px;text-decoration:none}.card__links .link:hover{text-decoration:underline}.section-heading{margin:0 0 30px;padding-top:25px;text-align:center}.section-heading .divider{margin-bottom:25px}#about{width:100%;padding:0 0 150px;position:relative;margin:0;z-index:1111}.dark-mode #about{background-color:var(--bg-color-dark)}#about>section{display:flex;justify-content:center;margin:90px 0}#about>section>article:nth-child(2){border-radius:12px;padding:100px auto}#about .main-section{margin:70px auto;gap:10em}#about .card{width:20em;height:875.5px;background:var(--primary-color);transition:1s ease-in-out;clip-path:polygon(30px 0%,100% 0,100% calc(100% - 30px),calc(100% - 30px) 100%,0 100%,0% 30px);border-top-right-radius:20px;border-bottom-left-radius:20px;display:flex;flex-direction:column}.dark-mode #about .card{background-color:var(--primary-color-dark);color:var(--txt-color-dark)}#about .card span{font-weight:700;text-align:center;display:block;font-size:1em}#about .card .info{font-weight:500;display:block;text-align:center;font-size:.72em;margin:1em}#about .card .img{width:4.8em;height:4.8em;background-image:url(/assets/orsoBianco-bd0cf710.jpg);background-size:cover;background-position:center center;border-radius:15px;margin:auto}#about .card .share{margin-top:1em;display:flex;justify-content:center;gap:1em}#about .card a{color:currentColor;transition:.4s ease-in-out}#about .card button{padding:.8em 1.7em;display:block;margin:auto;border-radius:25px;border:none;font-weight:700;background:var(--secondary-color);color:currentColor;border:1px solid var(--primary-color);transition:.4s ease-in-out}.dark-mode #about .card button{color:var(--bg-color-dark)}#about .card button a{text-decoration:none}#about .card button a:hover{color:var(--bg-color)}#about .card button:hover{background:var(--hover-color);border-color:var(--hover-color);color:#fff;cursor:pointer}.dark-mode #about .card button:hover{background:var(--hover-color-dark);border-color:var(--hover-color)}#about .share svg{transition:.5s ease}#about .share svg:hover{color:var(--hover-color)}.dark-mode #about .share svg:hover{color:var(--hover-color-dark)}.form-container{width:100%;background:linear-gradient(#313131,#313131) padding-box,linear-gradient(145deg,transparent 35%,#313131,#40c9ff) border-box;border:2px solid transparent;padding:32px 24px;font-size:14px;font-family:inherit;color:var(--font-color);display:flex;flex-direction:column;gap:20px;box-sizing:border-box;border-radius:16px;background-size:200% 100%;animation:gradient 5s ease infinite}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.form-container button:active{scale:.95}.form-container .form{display:flex;flex-direction:column;gap:20px}.form-container .form-group{display:flex;flex-direction:column;gap:2px}.form-container .form-group label{display:block;margin-bottom:5px;color:var(--secondary-color);font-weight:600;font-size:12px}.form-container .form-group input{width:100%;padding:12px 16px;border-radius:8px;color:var(--secondary-color);font-family:inherit;background-color:transparent;border:1px solid #414141}.form-container .form-group textarea{width:100%;padding:12px 16px;border-radius:8px;resize:none;color:var(--secondary-color);height:96px;border:1px solid #414141;background-color:transparent;font-family:inherit}.form-container .form-group input::placeholder{opacity:.5}.form-container .form-group input:focus{outline:none;border-color:var(--primary-color)}.form-container .form-group textarea:focus{outline:none;border-color:var(--primary-color)}.form-container .form-submit-btn{display:flex;align-items:flex-start;justify-content:center;align-self:flex-start;font-family:inherit;color:#717171;font-weight:600;width:40%;background:#313131;border:1px solid #414141;padding:12px 16px;font-size:inherit;gap:8px;margin-top:8px;cursor:pointer;border-radius:6px}.form-container .form-submit-btn:hover{background-color:var(--hover-color);border-color:var(--hover-color);color:var(--secondary-color)}#about>section>article:nth-child(1).about-card{display:flex;justify-content:start;flex:50%}#about .main-section{padding:0 40px}#footer{width:100%;display:flex;justify-content:center;background-color:var(--primary-color);padding:5px 0}.dark-mode #footer{background-color:var(--primary-color-dark)}#hearth{display:inline-block}#footer #hearth{color:red;animation:pulse 1s linear infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}#socials{position:absolute;left:0;top:38%;transform:translateY(-50%);padding:10px;background-color:var(--primary-color);border-top-right-radius:10px;border-bottom-right-radius:10px;color:var(--font-color)}.dark-mode #socials{background-color:var(--primary-color-dark)}#socials div{display:flex;justify-content:center;flex-direction:column;gap:10px}#socials svg{width:32px;height:32px}#socials div a{color:var(--font-color)}#socials div a:hover{color:var(--hover-color)}.dark-mode #socials div a:hover{color:var(--hover-color-dark)}@media screen and (max-width: 768px){#socials{position:absolute;right:5%;left:auto;top:25px;padding:10px;transform:translateY(0);background-color:var(--primary-color);border-radius:10px;color:var(--font-color);z-index:111}#socials div{flex-direction:row;gap:15px;align-items:center}#socials div a{display:flex;align-items:center}#projects .card{max-width:500px;margin-bottom:50px}#projects{padding:0;margin:0}#projects #projects-grid{grid-template:1fr / 1fr;gap:225px}#about{padding-top:0}#about .main-section{flex-direction:column;gap:2em}#about .main-section .about-card div{margin:0 auto;padding:20px 0}.hero-h1{display:flex;flex-direction:column;line-height:2.5em;font-weight:500}#phone-name a{text-decoration:none;color:var(--font-color)}#skills{padding:0}button.learn-more .circle{width:100%}button.learn-more .button-text{color:var(--bg-color)}}@media screen and (max-width: 502px){#skills-grid{gap:20px 0}#skills .card{width:150px;height:204px;margin:0 auto;background-color:var(--secondary-color);border-radius:8px;z-index:1;box-shadow:#959da533 0 8px 24px}#projects .card{width:100%;max-height:none}#projects #projects-grid{gap:255px 0px;max-height:none;padding:0 auto;margin:0}#projects-grid .card__desc p{padding:0!important;margin:0!important;min-height:none}}#reviews{background-color:var(--primary-color);width:100%;padding:0 10px}.revs{display:flex;padding:0 0 50px;gap:1.5em;flex-wrap:wrap;justify-content:center}.one-rev h4{font-size:12px}.one-rev{background-color:var(--bg-color);max-width:450px;padding:15px;border-radius:16px}.one-rev>header{display:flex;justify-content:space-between;align-items:center}.one-rev header div:nth-child(1){display:flex;gap:.8em;align-items:start}.one-rev img{border-radius:50%;width:60px;height:60px}.dark-mode .one-rev{background-color:var(--bg-color-dark)}.dark-mode #reviews{background-color:var(--primary-color-dark)}.client-letter{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background-color:var(--primary-color);border-radius:50%}.dark-mode .client-letter{background-color:var(--primary-color-dark)}.demo-link{border:2px solid #495464;color:#495464;margin-bottom:1em;border-radius:12px;padding:.5em 1em;margin-right:auto;cursor:pointer}.dark-mode .demo-link{border:2px solid #bbbfca;color:#bbbfca}:root{line-height:1.5;font-weight:400;scroll-behavior:smooth;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;--bg-color: #f4f4f2;--txt-color: #495464;--primary-color: #bbbfca;--secondary-color: #e8e8e8;--hover-color: #4682a9;--bg-color-dark: #283149;--txt-color-dark: #dbedf3;--primary-color-dark: #404b69;--secondary-color-dark: #6b728e;--hover-color-dark: #00818a;--waves: #404b69}.progetto h3{font-size:1.5rem;font-weight:600;color:#495464;margin-bottom:.5rem;text-align:left;width:100%}.dark-mode .progetto h3{color:#dbedf3}.progetto p{font-size:1.25rem;margin-bottom:1rem}.progetto img{display:block;border-radius:.5rem;box-shadow:0 0 1rem #ffffff1a;object-fit:cover;width:100%}#projects-container{width:80%;margin:auto;padding-bottom:6rem;padding:0 50px}@media screen and (max-width: 740px){#projects-container{width:100%;margin:auto;padding-bottom:6rem;padding:0 20px}}.tag-container{align-self:flex-start;display:flex;align-items:center;justify-content:start;gap:1em;padding:20px 0}.tag-container span{display:flex;align-items:center;justify-content:center;gap:.4em;background-color:var(--secondary-color);color:var(--txt-color);padding:5px 15px;border-radius:12px}.dark-mode .tag-container span{background-color:var(--bg-color-dark);color:var(--txt-color-dark)}