:root {
    --color-brand-orange: #FF6B35;
    --color-black: #0B0B0B;
    --color-background: #F3F1EA;
    --color-blue: #6B7FFF;
    --color-purple: #C5B0FF;
    --color-orange-light: #FF8B6B;
    --color-yellow: #FBC246;
    --color-white: #FFFFFF;
    --color-creame: #F0F0E8;


    --gradient-button-hover: linear-gradient(90deg, #C5B0FF 0%, #6B7FFF 100%);
    --gradient-card-purple: linear-gradient(135deg, #6B7FFF 0%, #C5B0FF 100%);

    --font-family-main: 'Inter', Arial, Helvetica, sans-serif;

    --font-mobile-title-family: var(--font-family-main);
    --font-mobile-title-size: 28px;
    --font-mobile-title-weight: 800;
    --font-mobile-title-line-height: 0.95;

    --font-desktop-title-family: var(--font-family-main);
    --font-desktop-title-size: 70px;
    --font-desktop-title-weight: 900;
    --font-desktop-title-line-height: 0.9;

    --font-body-size: 14px;
    --font-body-weight: 400;
    --font-body-line-height: 1.35;

    --font-nav-mobile-size: 24px;
    --font-nav-mobile-weight: 800;
    --font-nav-mobile-line-height: 1.2;

    --font-button-size: 14px;
    --font-button-weight: 800;
    --font-button-line-height: 1;

    --spacing-2xs: 4px;
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-2xl: 48px;
    --spacing-3xl: 64px;

    --container-mobile-padding: 20px;

    --radius-button: 12px;
    --radius-card: 8px;

    --background-pattern-url: url("../images/home/backgrounds/FOND.svg");

    --transition-fast: 180ms ease;
    --transition-base: 250ms ease;
}