/**
 * Fonts CSS - Wiki Hundestaffel
 *
 * Font: Assistant (Google Font)
 *
 * Author: Fabian Rossbacher
 * LinkedIn: https://www.linkedin.com/in/fabian-rossbacher/
 */

@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@400;600;700&display=swap');

:root {
    /* Schriftfamilien */
    --font-family-base: 'Assistant', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-family-primary: 'Assistant', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-family-heading: 'Assistant', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-family-headline: 'Assistant', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-family-secondary: 'Assistant', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-family-mono: 'Courier New', 'Monaco', monospace;

    /* Schriftgroessen */
    --font-size-xs: 0.75rem;
    --font-size-small: 0.875rem;
    --font-size-base: 1rem;
    --font-size-medium: 1rem;
    --font-size-large: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;

    /* Zeilenhoehen */
    --line-height-tight: 1.25;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.75;
    --line-height-base: 1.6;
    --line-height-heading: 1.3;

    /* Schriftgewichte */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* Buchstabenabstand */
    --letter-spacing-tight: -0.025em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: 0.025em;

    /* Text-Transformationen */
    --text-transform-uppercase: uppercase;
}

html {
    font-size: 16px;
}

body,
div,
p,
span,
a,
button,
input,
textarea,
select {
    font-family: var(--font-family-base);
    font-weight: var(--font-weight-normal);
}

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