/* Mobile + narrow screen */
@media (max-width: 100vh) {
    .header {
        padding: 0 5vw;
        padding-top: 30em;
        padding-bottom: 35em;
    }
    .scrolled .header {
        padding: 10em 5vw;
    }
    .header h1 {
        font-size: 8vw;
    }
    .header h2 {
        font-size: 2.5vw;
    }
    .header .nav {
        margin-top: 6em;
    }
    .panel {
        padding: calc(var(--slant-amount)/2 + 50em) 5vw;
    }
    .panel .columns {
        flex-direction: column;
    }
    
    .panel h1 {
        font-size: 70em;
        line-height: 1.8em;
    }
    .panel.slab h1 {
        font-size: 100em;
        hyphens: auto;
        line-height: 1;
    }

    .socials {
        justify-content: center;
        text-align: center;
        display: flex;
        width: 100%;
        padding: 1em 0;
        margin: 0;
    }
    .socials a {
        justify-content: center;
        text-align: center;
        width:50em;
        height:50em;
        margin: 8em;
    }
    .socials a:hover span {
        opacity: 1;
        top: calc(60vh * var(--scalemult));
        filter:blur(0);
    }

    .panel:first-child {
        padding-top: 600em;
    }
}