@font-face {
    font-family: 'Universal Sans';
    src: url('../assets/fonts/UniversalSans-500.woff2') format('woff2'),
        url('../assets/fonts/UniversalSans-500.woff') format('woff');
    font-weight: 400;
    /* Mapping 500 to normal/400 for simplicity as base font */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Universal Sans';
    src: url('../assets/fonts/UniversalSans-740.woff2') format('woff2'),
        url('../assets/fonts/UniversalSans-740.woff') format('woff');
    font-weight: 700;
    /* Mapping 740 to bold/700 */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Universal Sans Headers';
    /* Using Header specific font if needed, or just map it too */
    src: url('../assets/fonts/UniversalSans-500-Headlines.woff2') format('woff2'),
        url('../assets/fonts/UniversalSans-500-Headlines.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Universal Sans Headers';
    src: url('../assets/fonts/UniversalSans-740-Headlines.woff2') format('woff2'),
        url('../assets/fonts/UniversalSans-740-Headlines.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Base styles that are better here than cluttering HTML global config */
body {
    font-family: 'Universal Sans', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Universal Sans Headers', 'Universal Sans', sans-serif;
}

.font-bn {
    font-family: 'Noto Sans Bengali', sans-serif;
}

/* Slide animation */
.slide {
    opacity: 0;
    transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: absolute;
    inset: 0;
}

.slide.active {
    opacity: 1;
}