/**
 * Jost Font Family
 * https://fonts.google.com/specimen/Jost
 */

/* Thin - 100 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url('./Jost/Jost-Thin.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 100;
    font-display: swap;
    src: url('./Jost/Jost-ThinItalic.ttf') format('truetype');
}

/* ExtraLight - 200 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url('./Jost/Jost-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 200;
    font-display: swap;
    src: url('./Jost/Jost-ExtraLightItalic.ttf') format('truetype');
}

/* Light - 300 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('./Jost/Jost-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url('./Jost/Jost-LightItalic.ttf') format('truetype');
}

/* Regular - 400 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('./Jost/Jost-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('./Jost/Jost-Italic.ttf') format('truetype');
}

/* Medium - 500 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('./Jost/Jost-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url('./Jost/Jost-MediumItalic.ttf') format('truetype');
}

/* SemiBold - 600 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('./Jost/Jost-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 600;
    font-display: swap;
    src: url('./Jost/Jost-SemiBoldItalic.ttf') format('truetype');
}

/* Bold - 700 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('./Jost/Jost-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url('./Jost/Jost-BoldItalic.ttf') format('truetype');
}

/* ExtraBold - 800 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url('./Jost/Jost-ExtraBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 800;
    font-display: swap;
    src: url('./Jost/Jost-ExtraBoldItalic.ttf') format('truetype');
}

/* Black - 900 */
@font-face {
    font-family: 'Jost';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('./Jost/Jost-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Jost';
    font-style: italic;
    font-weight: 900;
    font-display: swap;
    src: url('./Jost/Jost-BlackItalic.ttf') format('truetype');
}

/* ============================================
   Poppins Font Family
   Für Schriftgrößen < 20px
   ============================================ */

/* Thin - 100 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Thin.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 100;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-ThinItalic.ttf') format('truetype');
}

/* ExtraLight - 200 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 200;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-ExtraLightItalic.ttf') format('truetype');
}

/* Light - 300 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-LightItalic.ttf') format('truetype');
}

/* Regular - 400 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Italic.ttf') format('truetype');
}

/* Medium - 500 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-MediumItalic.ttf') format('truetype');
}

/* SemiBold - 600 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 600;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-SemiBoldItalic.ttf') format('truetype');
}

/* Bold - 700 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-BoldItalic.ttf') format('truetype');
}

/* ExtraBold - 800 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-ExtraBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 800;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-ExtraBoldItalic.ttf') format('truetype');
}

/* Black - 900 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 900;
    font-display: swap;
    src: url('./Poppins/Poppins/Poppins-BlackItalic.ttf') format('truetype');
}

/* ============================================
   CSS Variablen für Font-Families
   ============================================ */
:root {
    --font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-family-heading: 'Jost', sans-serif;
    --font-family-large: 'Jost', sans-serif;
    --font-family-small: 'Poppins', sans-serif;
}

/* ============================================
   Globale Anwendung
   Poppins für Body (< 20px)
   ============================================ */
body {
    font-family: var(--font-family);
}

/* ============================================
   Jost für große Schriftgrößen (>= 20px)
   Überschriften und große Texte
   ============================================ */
h1, h2, h3 {
    font-family: var(--font-family-heading);
}

/* Klassen für explizite Font-Wahl */
.font-large,
.font-jost {
    font-family: var(--font-family-large);
}


.font-small,
.font-poppins {
    font-family: var(--font-family-small);
}

/* ============================================
   Jost für alle Bold/Fett-Texte
   font-weight >= 600 verwendet Jost
   ============================================ */
/*b, strong,
*[style*="font-weight: bold"],
*[style*="font-weight:bold"],
*[style*="font-weight: 600"],
*[style*="font-weight: 700"],
*[style*="font-weight: 800"],
*[style*="font-weight: 900"] {
    font-family: var(--font-family-large);
}
*/
/* CSS font-weight Klassen mit Jost */
/*.fw-bold,
.fw-semibold,
.fw-600,
.fw-700,
.fw-800,
.fw-900,
.font-weight-bold,
.text-bold {
    font-family: var(--font-family-large);
}*/

/* Alle Elemente mit font-weight >= 600 */
/*@supports (font-weight: 600) {
    *:where([style*="font-weight"]) {
        font-family: var(--font-family-large);
    }
}
*/