:root {
    --primary: rgb(255, 190, 0);
    --secondary: rgb(255, 100, 0);
    --light: rgb(255, 252, 245);
    --dark: rgb(6, 2, 0);
    --primary-100: color-mix(in lch, var(--primary), var(--light) 90%);
    --primary-200: color-mix(in lch, var(--primary), var(--light) 80%);
    --primary-300: color-mix(in lch, var(--primary), var(--light) 70%);
    --primary-400: color-mix(in lch, var(--primary), var(--light) 60%);
    --primary-500: color-mix(in lch, var(--primary), var(--light));
    --primary-600: color-mix(in lch, var(--primary), var(--light) 40%);
    --primary-700: color-mix(in lch, var(--primary), var(--light) 30%);
    --primary-800: color-mix(in lch, var(--primary), var(--light) 20%);
    --primary-900: color-mix(in lch, var(--primary), var(--light) 10%);
    --primary-dark-100: color-mix(in lch, var(--primary), var(--dark) 90%);
    --primary-dark-200: color-mix(in lch, var(--primary), var(--dark) 80%);
    --primary-dark-300: color-mix(in lch, var(--primary), var(--dark) 70%);
    --primary-dark-400: color-mix(in lch, var(--primary), var(--dark) 60%);
    --primary-dark-500: color-mix(in lch, var(--primary), var(--dark));
    --primary-dark-600: color-mix(in lch, var(--primary), var(--dark) 40%);
    --primary-dark-700: color-mix(in lch, var(--primary), var(--dark) 30%);
    --primary-dark-800: color-mix(in lch, var(--primary), var(--dark) 20%);
    --primary-dark-900: color-mix(in lch, var(--primary), var(--dark) 10%);
    --secondary-light-100: color-mix(in lch, var(--secondary), var(--light) 90%);
    --secondary-light-200: color-mix(in lch, var(--secondary), var(--light) 80%);
    --secondary-light-300: color-mix(in lch, var(--secondary), var(--light) 70%);
    --secondary-light-400: color-mix(in lch, var(--secondary), var(--light) 60%);
    --secondary-light-500: color-mix(in lch, var(--secondary), var(--light));
    --secondary-light-600: color-mix(in lch, var(--secondary), var(--light) 40%);
    --secondary-light-700: color-mix(in lch, var(--secondary), var(--light) 30%);
    --secondary-light-800: color-mix(in lch, var(--secondary), var(--light) 20%);
    --secondary-light-900: color-mix(in lch, var(--secondary), var(--light) 10%);
    --secondary-100: color-mix(in lch, var(--secondary), var(--dark) 90%);
    --secondary-200: color-mix(in lch, var(--secondary), var(--dark) 80%);
    --secondary-300: color-mix(in lch, var(--secondary), var(--dark) 70%);
    --secondary-400: color-mix(in lch, var(--secondary), var(--dark) 60%);
    --secondary-500: color-mix(in lch, var(--secondary), var(--dark));
    --secondary-600: color-mix(in lch, var(--secondary), var(--dark) 40%);
    --secondary-700: color-mix(in lch, var(--secondary), var(--dark) 30%);
    --secondary-800: color-mix(in lch, var(--secondary), var(--dark) 20%);
    --secondary-900: color-mix(in lch, var(--secondary), var(--dark) 10%);
    --trans: 300ms;
	--image: 24rem;
	--post: 75ch;
    --round: 16px;
    --pad-xl: 2rem;
    --pad-lm: 1.4rem;
    --pad-l: 1rem;
    --pad-m: 0.8rem;
    --pad-sm: 0.4rem;
    --paw: url("/assets/img/theme/paw.svg");
}
@font-face {
    font-family: Rubik;
    src: url("/assets/fonts/Rubik.ttf") format("truetype");
}

@font-face {
    font-family: Urbanist;
    src: url("/assets/fonts/Urbanist-Bold.ttf") format("truetype");
}