@import "tailwindcss";

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-Black-BF6438cc58744d4.ttf') format('truetype');
    font-weight: 900;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-ExtraBold-BF6438cc5881baf.ttf') format('truetype');
    font-weight: 800;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-Bold-BF6438cc587b5b5.ttf') format('truetype');
    font-weight: 700;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-SemiBold-BF6438cc588a48a.ttf') format('truetype');
    font-weight: 600;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-Medium-BF6438cc5883899.ttf') format('truetype');
    font-weight: 500;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-Regular-BF6438cc4d0e493.ttf') format('truetype');
    font-weight: 400;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-Light-BF6438cc5899919.ttf') format('truetype');
    font-weight: 300;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-ExtraLight-BF6438cc58a2634.ttf') format('truetype');
    font-weight: 200;
}

@font-face {
    font-family: 'Nohemi';
    src: url('../assets/fonts/Nohemi-Thin-BF6438cc5896c67.ttf') format('truetype');
    font-weight: 100;
}

@font-face {
    font-family: 'Nohemi VF';
    src: url('../assets/fonts/Nohemi-VF-BF6438cc58ad63d.ttf') format('truetype');
    font-weight: 100 900;
}

@font-face {
    font-family: 'Inter';
    src: url('../assets/fonts/Inter-VariableFont.ttf') format('truetype');
    font-weight: 100 900;
}

@font-face {
    font-family: 'Inter-Italic';
    src: url('../assets/fonts/Inter-Italic-VariableFont.ttf') format('truetype');
    font-weight: 100 900;
}

html {
    scroll-behavior: smooth;
}

@theme {
    --color-black: #000000;
    --color-offwhite: #F3F3F3;
    --color-offwhite-translucent: #F3F3F380;
    --color-gray: #b3b3b3;
    --color-blue: #253465;
    --color-red: #F7422C;
    --color-orange: #D17A00;
    --color-green: #7F7B00;
    --color-salmon: #EEA9A9;
    --font-main: 'Nohemi', sans-serif;
    --font-secondary: 'Inter', sans-serif;
    --font-secondary-italic: 'Inter-Italic', sans-serif;
    --breakpoint-3xl: 120rem;
}

html {
    scrollbar-gutter: stable;
    /* overflow-x: hidden; */
}

body {
    font-family: 'Nohemi', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    color: #333;
    /* overflow: auto; */
    /* overflow-x: hidden; */
}

/* Initial state of elements */
.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Fade-in animation */
.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.stop-scrolling {
    height: 100svh;
    overflow: hidden;
}