@font-face {
    font-family: 'Cairo-Light';
    src: url('https://www.goethe.de/resources/relaunch/fonts/Cairo-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 300 !important;
    font-display: swap;
}
@font-face {
    font-family: 'Cairo-Regular';
    src: url('https://www.goethe.de/resources/relaunch/fonts/Cairo-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 400 !important;
    font-display: swap;
}
@font-face {
    font-family: 'Cairo-Medium';
    src: url('https://www.goethe.de/resources/relaunch/fonts/Cairo-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 600 !important;
    font-display: swap;
}
@font-face {
    font-family: 'Cairo-Bold';
    src: url('https://www.goethe.de/resources/relaunch/fonts/Cairo-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 650 !important;
    font-display: swap;
}
:root {
	--gi-font-bold: 'Cairo-Bold', "Helvetica Neue", Helvetica, Arial, sans-serif;
	--gi-font-medium: 'Cairo-Medium', "Helvetica Neue", Helvetica, Arial, sans-serif;
	--gi-font-news: 'Cairo-Regular', "Helvetica Neue", Helvetica, Arial, sans-serif;
	--gi-font-regular: 'Cairo-Light', "Helvetica Neue", Helvetica, Arial, sans-serif;
}
html:lang(ar) .webfont-bold { font-family: var(--gi-font-bold) !important; font-weight: 650 !important; }
html:lang(ar) .webfont-medium { font-family: var(--gi-font-medium) !important;  font-weight: 600 !important; }
html:lang(ar) .webfont-news { font-family: var(--gi-font-news) !important; font-weight: 400 !important; }
html:lang(ar) .webfont-regular { font-family: var(--gi-font-regular) !important; font-weight: 300 !important; }
.hero, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	font-weight: 650 !important;
}
.kicker {
	font-weight: 400 !important;
}
button, .btn {
	font-weight: 600 !important;
}
strong,
b {
    font-family: var(--gi-font-medium);
    font-weight: 600;
}
@media (min-width: 1200px) {
	html:lang(ar) .webfont-xl-regular {
		font-family: var(--gi-font-regular) !important;
		font-weight: 300 !important;
	}
	html:lang(ar) .webfont-xl-news {
		font-family: var(--gi-font-news) !important;
		font-weight: 400 !important;
	}
	html:lang(ar) .webfont-xl-medium {
		font-family: var(--gi-font-medium) !important;
		font-weight: 600 !important;
	}
	html:lang(ar) .webfont-xl-bold {
		font-family: var(--gi-font-bold) !important;
		font-weight: 650 !important;
	}
}