:root {
    color-scheme: light;

    --font-sans:
        Inter,
        "Segoe UI",
        Tahoma,
        Arial,
        sans-serif;

    --background: #f5f5f3;
    --surface: #ffffff;
    --surface-strong: #efefec;
    --text: #111111;
    --muted: #6b6b72;
    --border: #ddddda;
    --accent: #ef3438;
    --accent-dark: #cf2025;
    --accent-soft: rgba(239, 52, 56, 0.1);
    --header-background: rgba(255, 255, 255, 0.9);
    --footer-background: #111113;
    --footer-surface: #19191d;
    --footer-text: #ffffff;
    --footer-muted: #a8a8af;
    --shadow-soft:
        0 14px 40px rgba(17, 17, 17, 0.08);
    --shadow-header:
        0 8px 30px rgba(17, 17, 17, 0.07);

    --container: 1440px;
    --radius-small: 10px;
    --radius-medium: 18px;
    --radius-large: 28px;

    --header-height: 82px;
    --transition-fast: 160ms ease;
    --transition-normal: 240ms ease;
}

html[data-theme="dark"] {
    color-scheme: dark;

    --background: #0d0d0f;
    --surface: #17171a;
    --surface-strong: #202024;
    --text: #ffffff;
    --muted: #a4a4ad;
    --border: #2c2c31;
    --accent: #ff4549;
    --accent-dark: #dc2c31;
    --accent-soft: rgba(255, 69, 73, 0.12);
    --header-background: rgba(13, 13, 15, 0.9);
    --shadow-soft:
        0 16px 44px rgba(0, 0, 0, 0.28);
    --shadow-header:
        0 8px 30px rgba(0, 0, 0, 0.24);
}