@font-face {
    font-family: Roboto;
    src: url("fonts/RobotoMono-VariableFont_wght.ttf");
    font-weight: 100 900;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: Inter;
    src: url("fonts/Inter-Italic-VariableFont_wght.ttf");
    font-weight: 100 900;
    font-display: swap;
    font-style: italic;
}

@font-face {
    font-family: Inter;
    src: url("fonts/Inter-VariableFont_wght.ttf");
    font-weight: 100 900;
    font-display: swap;
    font-style: normal;
}

:root {
    color-scheme: dark;
    --page-max-width: 2200px;

    --main-background: #0D1821;
    --color-primary: #FFFFFF;
    --color-secondary: rgba(255,255,255,0.7);
    --color-tertiary: rgba(255,255,255,0.5);
    --color-quaternary: rgba(255,255,255,0.2);
    
    --error-color: #cc2a2b;
    
    --main-color: #2D68F6;
    --main-color-2: #0a4be6;
    
    --cv-width: 210mm;
    --cv-height: 297mm;
}

* {
    box-sizing: border-box;
    color: var(--color-primary);
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;    
    font-family: Inter, serif;
    outline: none;
}

body {
    background-color: var(--main-background);
}

.simple-link {
    cursor: pointer;
    text-decoration: none;
}

.simple-link:hover {
    text-decoration: underline;
}

.hide {
    display: none !important;
}

@media print {

    html, body {
        padding: 0;
        width: var(--cv-width);
        height: var(--cv-height);
    }

    body {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        color-adjust: exact !important;
    }

    img, svg {
        display: block !important;
        visibility: visible !important;
    }
    
}