:root{--surface: #1C1B1F;--primary: #D0BCFF;--secondary: #CCC2DC;--text: #E6E1E5;--highlight: rgba(110, 106, 134, .2);--max-width: 72rem;--padding-x: 2rem}html{scroll-behavior:smooth;scroll-snap-type:y mandatory}body{padding:0;margin:0;font-family:Fira Code,monospace;background-color:var(--surface);color:var(--text)}a{text-decoration:none;color:var(--primary)}main{margin:0 auto;max-width:var(--max-width);display:flex;flex-direction:column}.container{min-height:90vh;padding:5vh var(--padding-x);display:flex;flex-direction:column;justify-content:center;align-items:center}#about{flex-direction:row;justify-content:space-around;max-width:50rem;margin:auto}#about div h1{line-height:.8}.intro-header{font-size:1.8rem}.intro-content{line-height:1.5}.showcase span{display:grid;grid-template-columns:auto}.showcase span a{padding:.5rem 1.8rem;margin:.8rem;border-radius:2rem}.showcase span a:hover{background-color:var(--highlight)}.showcase span a h2{color:var(--text);font-size:1.2rem}.showcase span a h3{color:var(--secondary);margin:-.5rem 0}.showcase span a p{color:var(--secondary)}footer{height:7rem;justify-content:space-between;text-align:center;align-items:center}footer>span{padding:0 var(--padding-x);align-items:center;max-width:var(--max-width);width:100%;margin:auto;justify-content:space-between}@media(max-width:700px){.showcase span{grid-template-columns:auto}.showcase{padding-left:0;padding-right:0}}