html,body{margin:0;padding:0}body{min-height:100svh;display:flex;flex-direction:column}body>.header{flex-shrink:0}body>main{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}*{box-sizing:border-box}a{text-decoration:none;color:inherit}.nav{font-size:inherit;font-weight:var(--weight-semibold)}.header .nav{font-size:1em}.nav .divider{padding:0 1.15em}.footer .nav .home:hover,.footer .nav .home.active,.footer .nav .about:hover,.footer .nav .about.active,.footer .nav .blog:hover,.footer .nav .blog.active{color:var(--ink-faint)}.footer{border-top:solid 1px black;padding:1em 2em;display:flex;align-items:center;font-size:.7em}.footer .nav{padding-left:1.5em}.footer svg{width:2em}.footer .copyright{flex-grow:1;text-align:right;font-weight:var(--weight-normal);font-size:.7em}body[data-hero-page-tone=dark] .footer{color:#fff;border-top-color:#ffffff59}body[data-hero-page-tone=dark] .footer svg{stroke:#fff}body[data-hero-page-tone=dark] .footer .nav,body[data-hero-page-tone=dark] .footer .nav a{color:#fff}body[data-hero-page-tone=dark] .footer .nav .divider{color:#ffffff73}.icon{border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;background-color:var(--icon-color)}.icon>*{pointer-events:none}.has-alt>*{transition:opacity .5s}.icon .hover{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;font-weight:700;display:flex;justify-content:center;align-items:center;color:#fff;text-shadow:black 0 .13em .1em}.has-alt:hover .hover{opacity:1}.has-alt:hover svg{opacity:.2}main .projects{display:flex;align-items:center;flex-direction:column;padding-top:4.2em}main .projects .grid{display:grid;grid-template-columns:repeat(3,1fr);width:100%;max-width:40em;grid-gap:1em}main .projects .project{display:flex;flex-direction:column;align-items:center;margin:3em 0}main .projects .project a:hover .image-container{opacity:.5}main .projects .project .image-container{width:12em;height:12em;display:flex;align-items:center;justify-content:center;padding:1em}main .projects .project img{max-width:100%;max-height:100%;height:auto}main .projects .project h4{margin:0;padding-top:.8em}@media (max-width: 50rem){.footer{padding:1em}.footer .nav{padding-left:.8em}main .projects .grid{grid-template-columns:repeat(1,1fr)}main .projects .project{margin:1em}}