:root {
	--color-1: #ffc000;
	--color-2: #046380;

	--background-primary: #f2f2f2;
	--background-secondary: #ffffff;
	--background-tertiary: #333333;

	/* Sombras */
	--shadow-light: 0px 2px 4px rgba(0, 0, 0, 0.1);
	--shadow-medium: 0px 4px 8px rgba(0, 0, 0, 0.2);
	--shadow-dark: 0px 8px 16px rgba(0, 0, 0, 0.3);
}
body {
	background-color: var(--background-primary);
}

@media (min-width: 1024px) {
	.px-sm-6 {
		padding-left: 5rem !important;
		padding-right: 5rem !important;
	}
}

@media (min-width: 768px) {
	#story {
		background-image: url("/assets/doodle-2.svg");
		background-size: cover;
		background-repeat: no-repeat;
		background-position: 10% 15%;
	}
	.scale {
		transition: transform 0.5s ease;
	}

	.scale:hover {
		transform: scale(1.1);
		z-index: 1;
	}
}

.box {
	background: rgba(255, 255, 255, 0.877);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(7.3px);
	-webkit-backdrop-filter: blur(7.3px);
}