@layer base {

:root {
	--color-primary: #005EA2;
	--color-secondary: #2491FF;
	--color-tertiary: #25D9C1;
	--red: #DD0C15;
	--yellow: #FAE600;
	--black: #11181D;
	--dark-grey: #4D5766;
	--grey: #71767A;
	--light-grey: #BEC2C6;
	--pastel-grey: #D8E0EA;
	--white: #FFF;
	--off-white: #F0F0EC;

	--font-primary: 'Montserrat', "Raleway", "Proxima Nova", "Helvetica Neue", "Roboto", sans-serif;
	--font-secondary: "Open Sans", "Source Sans 3", "Source Sans Pro", sans-serif;

	--font-weight-small: 400;
	--font-weight-medium: 500;
	--font-weight-large: 700;

	--font-size-huge: 22px;
	--font-size-large: 19px;
	--font-size-medium: 16px;
	--font-size-small: 13px;
	--font-size-tiny: 11px;

	--line-height-large: 1.65;
	--line-height-medium: 1.4;
	--line-height-small: 1.15;

	--radius-rounded: 100%;
	--radius-large: 8px;
	--radius-medium: 4px;
	--radius-small: 2px;
	
	--spacing-huge: 32px;
	--spacing-large: 24px;
	--spacing-medium: 16px;
	--spacing-small: 8px;
	--spacing-tiny: 4px;
	
	--title-size-large: 56px;
	--title-size-medium: 36px;
	--title-size-small: 28px;

	--transition-fast: 0.25s;
	--transition-normal: 0.5s;
	--transition-slow: 1s;
}




html, button {
	box-sizing: border-box;
}

body {
	background: var(--white) !important;
	color: var(--black);
	font-family: var(--font-primary);
	font-kerning: normal;
	font-size: var(--font-size-medium);
	text-rendering: geometricPrecision;
}

::placeholder {
	color: var(--grey);
	font-weight: var(--font-weight-medium);
}

/* Barra colorida */
body::before, .cf-footer::after {
	background: linear-gradient(to right,
		var(--color-primary) 0 20%,
		var(--color-secondary) 20% 40%,
		var(--color-tertiary) 40% 60%,
		var(--red) 60% 80%,
		var(--yellow) 80% 100%);
	content: "";
	height: 6px;
	left: 0;
	position: absolute;
	top: 32px;
	width: 100%;
}
body.customize-support {
	top: 32px;
}

h1, h2, h3 {
	font-family: var(--font-primary);
	font-weight: var(--font-weight-large);
	line-height: var(--line-height-small);
	margin-bottom: var(--spacing-medium);
}

h4, h5, input, p, ol {
	font-family: var(--font-secondary);
	font-weight: var(--font-weight-small);
	text-rendering: optimizeLegibility;
}

h1 {
	letter-spacing: -0.33px;
}

h2 {
	letter-spacing: -0.2px;
}

h3 {
	font-weight: var(--font-weight-medium);
}

h4 {
	font-weight: var(--font-weight-medium);
}

h5 {
	font-size: var(--font-size-small);
	font-weight: var(--font-weight-large);
	text-decoration: underline;
}

p {
	font-size: var(--font-size-small);
}
a {
	color: var(--color-primary);
	text-decoration: none;
}
a:hover, a:focus {
	color: var(--color-secondary);
}

a:disabled {
	color: var(--grey);
}

a:active {
	color: var(--color-tertiary);
	font-weight: var(--color-tertiary);
}

a:visited {
	color: var(--dark-grey);
	font-style: oblique;
}

}