/* This file is compiled to /assets/styles/tailwind.css via script/tailwind */

@import url('https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;1,200;1,300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100;0,300;0,600;1,100;1,300;1,600&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    html {
        font-size: 125%;
        text-rendering: geometricPrecision;
    }
    h1 {
        @apply text-4xl;
        @apply tracking-tighter;
    }
    h2 {
        @apply text-3xl;
        @apply tracking-tighter;
    }
    h3 {
        @apply text-2xl;
        @apply tracking-tighter;
    }
    h4 {
        @apply text-xl;
    }
.underline, .hover\:underline:hover {
        text-underline-offset: 4px;
    }
    
    /* This fixes scrollbar jump */
    @media screen and (min-width: 960px) {
        html {
            margin-left: calc(100vw - 100%);
            margin-right: 0;
        }
    }
}