@font-face {
    font-family: 'Syne';
    src: url('https://kreatifabrika.com/fonts/Syne-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Syne';
    src: url('https://kreatifabrika.com/fonts/Syne-ExtraBold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Syne';
    src: url('https://kreatifabrika.com/fonts/Syne-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Syne';
    src: url('https://kreatifabrika.com/fonts/Syne-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Syne';
    src: url('https://kreatifabrika.com/fonts/Syne-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-ExtraBold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('https://kreatifabrika.com/fonts/DMSans-Thin.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
:root {
    --primary: oklch(0.541 0.24666 293.01);
    --primary-foreground: oklch(1 0 0);
    --secondary: oklch(0.97 0 0);
    --secondary-foreground: oklch(0.21 0.03178 264.67);
    --accent: oklch(0.97 0 0);
    --accent-foreground: oklch(0.21 0.03178 264.67);
    --danger: oklch(0.637 0.20781 25.32);
    --danger-foreground: oklch(1 0 0);
    --info: oklch(0.613 0.0987 202.88);
    --info-foreground: oklch(1 0 0);
    --warning: oklch(0.769 0.16459 70.08);
    --warning-foreground: oklch(0.21 0.03178 264.67);
    --success: oklch(0.696 0.14907 162.51);
    --success-foreground: oklch(1 0 0);
    --light-danger: oklch(0.936 0.03086 17.58);
    --light-danger-foreground: oklch(0.577 0.21512 27.32);
    --light-info: oklch(0.956 0.04437 203.48);
    --light-info-foreground: oklch(0.609 0.11099 221.74);
    --light-warning: oklch(0.962 0.05795 95.64);
    --light-warning-foreground: oklch(0.666 0.15737 58.31);
    --light-success: oklch(0.95 0.05073 163.15);
    --light-success-foreground: oklch(0.596 0.12742 163.25);
    --background: oklch(1 0 0);
    --foreground: oklch(0.145 0 0);
    --muted: oklch(0.97 0 0);
    --muted-foreground: oklch(0.556 0 0);
    --border: oklch(0.922 0 0);
    --input: oklch(0.922 0 0);
    --ring: oklch(0.709 0 0);
    --color-gray-50: oklch(0.985 0.00179 248.57);
    --color-gray-100: oklch(0.968 0.00551 274.79);
    --color-gray-200: oklch(0.928 0.00845 271.25);
    --color-gray-300: oklch(0.87 0.0145 268.45);
    --color-gray-400: oklch(0.708 0.02511 264.4);
    --color-gray-500: oklch(0.551 0.02677 264.33);
    --color-gray-600: oklch(0.545 0 0);
    --color-gray-700: oklch(0.371 0.0222 264.26);
    --color-gray-800: oklch(0.139 0.01775 283.84);
    --color-gray-900: oklch(0.173 0 0);
    --color-gray-950: oklch(0.13 0.01211 274);
    --color-blue-50: oklch(0.97 0.01427 254.66);
    --color-blue-100: oklch(0.932 0.03167 255.61);
    --color-blue-200: oklch(0.882 0.05714 254.14);
    --color-blue-300: oklch(0.809 0.09567 251.83);
    --color-blue-400: oklch(0.714 0.14345 254.63);
    --color-blue-500: oklch(0.623 0.18809 259.82);
    --color-blue-600: oklch(0.546 0.21528 262.89);
    --color-blue-700: oklch(0.488 0.21723 264.38);
    --color-blue-800: oklch(0.424 0.18093 265.64);
    --color-blue-900: oklch(0.379 0.13781 265.53);
    --color-green-50: oklch(0.982 0.01804 156.09);
    --color-green-100: oklch(0.962 0.04336 156.85);
    --color-green-200: oklch(0.925 0.08053 156.05);
    --color-green-300: oklch(0.871 0.13625 154.48);
    --color-green-400: oklch(0.8 0.18205 151.73);
    --color-green-500: oklch(0.723 0.19199 149.6);
    --color-green-600: oklch(0.627 0.1699 149.23);
    --color-green-700: oklch(0.527 0.13709 150.09);
    --color-green-800: oklch(0.448 0.10831 151.35);
    --color-green-900: oklch(0.393 0.08961 152.56);
    --color-purple-50: oklch(0.977 0.01426 308.06);
    --color-purple-100: oklch(0.946 0.0328 307.08);
    --color-purple-200: oklch(0.902 0.06047 306.66);
    --color-purple-300: oklch(0.827 0.10829 306.36);
    --color-purple-400: oklch(0.722 0.17675 305.49);
    --color-purple-500: oklch(0.627 0.23261 303.9);
    --color-purple-600: oklch(0.558 0.25256 302.32);
    --color-purple-700: oklch(0.496 0.23694 301.92);
    --color-purple-800: oklch(0.438 0.19839 303.72);
    --color-purple-900: oklch(0.381 0.16612 304.98);
    --color-red-50: oklch(0.971 0.01291 17.04);
    --color-red-100: oklch(0.936 0.03086 17.58);
    --color-red-200: oklch(0.885 0.05923 18.27);
    --color-red-300: oklch(0.808 0.10346 19.54);
    --color-red-400: oklch(0.711 0.16612 22.2);
    --color-red-500: oklch(0.637 0.20781 25.32);
    --color-red-600: oklch(0.577 0.21512 27.32);
    --color-red-700: oklch(0.505 0.19046 27.51);
    --color-red-800: oklch(0.444 0.16129 26.89);
    --color-red-900: oklch(0.396 0.13305 25.71);
    --color-yellow-50: oklch(0.987 0.02615 102.28);
    --color-yellow-100: oklch(0.973 0.06927 103.22);
    --color-yellow-200: oklch(0.945 0.12423 101.55);
    --color-yellow-300: oklch(0.905 0.16561 98.12);
    --color-yellow-400: oklch(0.861 0.17304 91.94);
    --color-yellow-500: oklch(0.795 0.1616 86.05);
    --color-yellow-600: oklch(0.681 0.14222 75.83);
    --color-yellow-700: oklch(0.554 0.12064 66.44);
    --color-yellow-800: oklch(0.476 0.10333 61.9);
    --color-yellow-900: oklch(0.421 0.08967 57.7);
}
.dark {
    --primary: oklch(0.541 0.24666 293.01);
    --primary-foreground: oklch(1 0 0);
    --secondary: oklch(0.627 0.23261 303.9);
    --secondary-foreground: oklch(1 0 0);
    --accent: oklch(0.17 0.02487 283.44);
    --accent-foreground: oklch(0.929 0.0127 255.56);
    --danger: oklch(0.711 0.16612 22.2);
    --danger-foreground: oklch(1 0 0);
    --info: oklch(0.797 0.13394 211.56);
    --info-foreground: oklch(1 0 0);
    --warning: oklch(0.837 0.16435 84.43);
    --warning-foreground: oklch(0.21 0.03178 264.67);
    --success: oklch(0.773 0.15349 163.25);
    --success-foreground: oklch(0.21 0.03178 264.67);
    --background: oklch(0.139 0.01775 283.84);
    --foreground: oklch(0.929 0.0127 255.56);
    --muted: oklch(0.269 0 0);
    --muted-foreground: oklch(0.715 0 0);
    --border: oklch(0.269 0 0);
    --input: oklch(0.269 0 0);
    --ring: oklch(0.439 0 0);
}
:root {
    --font-heading: 'Syne', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-body: 'DM Sans', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-sans: 'DM Sans', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}