:root{font-family:Quicksand,sans-serif;line-height:1.5;font-weight:400;--primary: #211A1D;--secondary: #6320EE;--third: #8075FF;--fourth: #F8F0FB;--fifth: #CAD5CA;color-scheme:light dark;color:var(--fifth);background-color:var(--primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0}body{min-width:320px;min-height:100vh;overflow-x:hidden}.card{width:550px;height:min-content;background-color:var(--fourth);border-radius:20px;display:flex;flex-direction:column;justify-content:flex-start}.card-image{display:flex;justify-content:center}.card-image img{margin-top:2.5%;width:95%;border-top-left-radius:20px;border-top-right-radius:20px}.card-content{padding:0 20px;display:flex;flex-direction:column;justify-content:space-between;gap:25px}.card-title{font-size:2rem;font-weight:600;color:var(--primary);text-align:center}.card-description{font-size:1.2rem;color:var(--primary);text-align:justify;line-height:1.4;height:100%;container-type:inline-size}.card-links{display:flex;justify-content:space-between;padding-bottom:20px}.card-links a{display:flex;z-index:101}@media (max-width: 768px){.card-title{font-size:1.5rem}.card-description{font-size:1rem}}@media (max-width: 480px){.card{width:90%}.card-description{font-size:.9rem;line-height:1.3}}@media (max-width: 370px){.card{width:99%}.card-title{font-size:1.2rem}.card-description{font-size:.9rem}}html{scroll-snap-type:y mandatory}#example{scroll-snap-align:start}.img-container{height:100vh;scroll-snap-align:start;display:flex;justify-content:center;align-items:center;position:relative}.progress{position:fixed;left:0;right:0;height:5px;background:var( --third);bottom:20px;transform:scaleX(0)}.titleWork{min-height:100vh;width:100vw;display:flex;flex-direction:column;justify-content:center;align-items:center}.author{position:sticky;bottom:17px;height:0;width:100%;text-align:center;color:var(--third)}.bio{display:flex;width:100vw;min-height:100vh;justify-content:space-evenly;flex-wrap:wrap;scroll-snap-align:start}.bio-img{width:400px;height:400px;border-radius:50%;border:5px solid var(--third);box-shadow:0 0 20px var(--third)}.bio-content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;max-width:50%}.bio-content h1{font-size:9rem;font-weight:350;text-shadow:var(--third) 0 0 20px;color:var(--third)}.bio-content p{font-size:1.5rem;color:var(--fifth);text-align:left}.bio-image{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;align-items:center}.bio-social{position:relative;height:300px;width:min-content;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.bio-social a:first-child{position:absolute;top:0;left:-10px}.bio-social a:nth-child(2){margin-left:20px}.bio-social a:last-child{position:absolute;bottom:0;left:-10px}@media (max-width: 1200px){.bio{flex-direction:column-reverse;align-items:center;padding-top:2vh;gap:6vh;justify-content:flex-end}.bio-image{flex-direction:column;gap:0}.bio-social{width:300px;height:min-content;align-items:center}.bio-social a:first-child{position:absolute;top:-10px;left:0}.bio-social a:nth-child(2){margin-top:20px;margin-left:0}.bio-social a:last-child{position:absolute;inset:-10px 0 auto auto}.bio-content{max-width:100%;text-align:center;align-items:center}.bio-content p{text-align:center;padding:0 20px}}@media (max-width: 768px){.bio-content h1{font-size:clamp(3rem,20vw,9rem)}.bio-img{width:300px;height:300px}.bio-social{width:250px}.bio-social a:first-child{top:-20px}.bio-social a:nth-child(2){margin-top:20px}}@media (max-width: 480px){.bio-content h1{font-size:clamp(2rem,15vw,9rem)}.bio-img{width:250px;height:250px}.bio-content p{font-size:1.2rem}}@media (max-width: 480px) and (max-height: 700px){.bio-img{width:200px;height:200px}.bio-content h1{font-size:clamp(1.5rem,10vw,9rem)}.bio-content p{font-size:1rem}}.descrizione{font-size:1rem;line-height:1.6;color:#fff;margin:0 auto;text-align:left;max-width:800px}.parola-animata{display:inline-block;margin-right:.25em;white-space:pre}.btn-social{background-color:var(--third);border:0;border-radius:50%;box-shadow:0 0 20px var(--third);padding:10px;display:flex;justify-content:center;align-items:center}.btn-social:hover{background-color:var(--fifth);box-shadow:0 0 20px var(--fifth);transition:all .7s ease-in-out}.skills{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:100vh;padding:2rem;scroll-snap-align:start;position:relative;box-sizing:border-box;overflow-x:hidden}.skills-title{font-size:4rem;font-weight:350;margin-bottom:3rem;text-shadow:var(--third) 0 0 20px;color:var(--third)}.skills-grid{display:grid;grid-template-columns:repeat(4,minmax(200px,1fr));grid-gap:clamp(1rem,3vw,2rem);justify-content:center;width:100%;max-width:1200px;margin:0 auto;padding:0 1rem;box-sizing:border-box}.skill-box{width:100%;aspect-ratio:1/1;max-width:200px;background-color:var(--fourth);border-radius:10px;overflow:hidden;position:relative;box-shadow:0 5px 15px #0000001a;transition:transform .3s ease,box-shadow .3s ease;display:flex;justify-content:center;align-items:center;margin:0 auto;box-sizing:border-box}.skill-box:hover{transform:translateY(-5px);box-shadow:0 10px 20px #0003}.skill-logo{width:70%;height:70%;object-fit:contain;transition:opacity .3s ease}.skill-box:hover .skill-logo{opacity:.2}.skill-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;opacity:0;transition:opacity .3s ease}.skill-box:hover .skill-overlay{opacity:1}.skill-name{color:var(--third);font-size:1.5rem;font-weight:500;text-align:center;padding:.5rem}@media (max-width: 1200px){.skills-title{font-size:3.5rem}.skills-grid{grid-template-columns:repeat(4,minmax(20%,0fr))}}@media (max-width: 1200px) and (max-height: 700px){.skills-title{font-size:3.5rem}.skills-grid{grid-template-columns:repeat(4,minmax(15%,0fr))}}@media (max-width: 900px){.skills-grid{grid-template-columns:repeat(3,minmax(20%,22%));grid-gap:clamp(.8rem,2vw,1.5rem)}}@media (max-width: 768px){.skills-title{font-size:3rem}.skills-grid{grid-template-columns:repeat(3,minmax(150px,0fr))}.skill-name{font-size:1.3rem}}@media (max-width: 480px){.skills{padding:1rem}.skills-title{font-size:2.5rem;margin-bottom:2rem}.skills-grid{grid-template-columns:repeat(3,minmax(33%,0fr));grid-gap:clamp(.5rem,1.5vw,1rem)}.skill-name{font-size:1.1rem}}
