/* Local Fonts CSS - Using system fonts as fallback */

/* Try to use local system fonts first, then fallback to web-safe fonts */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans'), local('OpenSans'), local('Arial'), local('Helvetica');
}

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 500;
    src: local('Open Sans Medium'), local('OpenSans-Medium'), local('Arial'), local('Helvetica');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), local('Arial'), local('Helvetica');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), local('Arial Bold'), local('Helvetica Bold');
}

/* System font stack for maximum compatibility */
:root {
    --font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-family-heading: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}

/* Apply fonts globally */
body {
    font-family: var(--font-family-base);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-heading);
}