/*
========================================
variables.css
Globale Design-Variablen
========================================
*/

:root {
    /* Farben */
    --color-white: #ffffff;
    --color-black: #08090a;
    --color-dark: #101214;
    --color-dark-soft: #181b1f;
    --color-gray: #6f7782;
    --color-gray-light: #f4f6f8;
    --color-border: rgba(16, 18, 20, 0.12);

    /* Akzentfarbe */
    --color-accent: #0f6fff;
    --color-accent-dark: #084fbd;

    /* Text */
    --text-primary: #101214;
    --text-secondary: #5f6772;
    --text-inverted: #ffffff;

    /* Typografie */
    --font-main: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    /* Größen */
    --container-max: 1440px;
    --container-padding: clamp(24px, 5vw, 80px);

    /* Abstände */
    --space-xs: 8px;
    --space-sm: 16px;
    --space-md: 32px;
    --space-lg: 64px;
    --space-xl: 120px;
    --space-xxl: 180px;

    /* Radius */
    --radius-sm: 12px;
    --radius-md: 24px;
    --radius-lg: 40px;
    --radius-full: 999px;

    /* Schatten */
    --shadow-soft: 0 24px 80px rgba(0, 0, 0, 0.08);
    --shadow-card: 0 16px 48px rgba(0, 0, 0, 0.10);

    /* Animation */
    --transition-fast: 180ms ease;
    --transition-medium: 320ms ease;
    --transition-slow: 700ms ease;
}

@font-face {
    font-family: "Inter";
    src: url("../fonts/Inter-Regular.woff2") format("woff2");
    font-display: swap;
}