:root {
	/* COLORS */
	--white: #ffffff;
	--dark-grey: #0e1b58;
	--dark-blue: #1d2859;
	--red: #e60050;
	--dark-red: #b1013e;
	--silver: #efefef;
	--dark-silver: #8f9b9e;
	
	--b2c-blue-100: #4864e2;
	--b2c-blue-60: #8d9eea;
	--b2c-blue-30: #c2caf0;
	--b2c-blue-20: #dae0f9;
	--b2c-blue-10: #edf0fc;
	--b2c-red: #e60050;
	--b2c-dark-red: #b1013e;
	--b2c-orange: #ff4b00;
	--b2c-gold: #d9a56d;
	--b2c-green-100: #00DCB4;
	--b2c-turquoise: #65B3BD;
	
	--b2b-blue-100: #2e4291;
	--b2b-blue-60: #7e8ab9;
	--b2b-blue-30: #bac0d7;
	--b2b-blue-20: #d5d9e9;
	--b2b-blue-10: #eaecf4;
	--b2b-red: #822850;
	--b2b-dark-red: #5B1C38;
	--b2b-gold: #E6C39E;
	--b2b-green-100: #00DCB4;
	
	--fi-green-100: #022126;
	--fi-green-60: #04424b;
	--fi-green-30: #3c777f;
	--fi-green-20: #7cabb1;
	--fi-green-10: #c7dcdf; 
	--fi-red: #86002f;
	--fi-orange: #bf3800;
	--fi-gold: #bf9400;
	--fi-gold-dark: #765B00;
	
	/* FONTS */
	--typeface-1: 'CornerDisplay';
	--typeface-2: 'Inter', 'Roboto';
	--typeface-3: 'ccicon';
	
	--weight-700: 700;
	--weight-500: 500;
	--weight-400: 400;
	--weight-300: 300;
	
	--opacity-3: 0.3;
	--opacity-5: 0.5;
	--opacity-7: 0.7;
	
	--delimiter-white: 1px solid var(--white);
	--delimiter-blue: 1px solid var(--b2c-blue-30);
	--delimiter-dark-blue: 1px solid var(--dark-blue);
	
	--border-radius-sma-1: 8px;
	--border-radius-sma-2: 10px;
	--border-radius-med: 18px;
	--border-radius-big: 88px;
		
	--h1-family: var(--typeface-1);
	--h1-weight: var(--weight-700);
	--fi-h1-weight: var(--weight-400);
	--h1-size: 48px;
	--h1-size-mobile: 40px;
	--h1-line-height: 100%;
	--h1-text-transform: uppercase;
	--h1-font-feature-settings: 'ss01' on;
	--h1-color: var(--dark-blue);
	--h1-color-dark: var(--white);

	--h2-family: var(--typeface-1);
	--h2-weight: var(--weight-700);
	--fi-h2-weight: var(--weight-400);
	--h2-size: 32px;
	--h2-line-height: 110%;
	--h2-text-transform: uppercase;
	--h2-color: var(--dark-blue);
	--h2-color-dark: var(--white);

	--h3-bold-family: var(--typeface-1);
	--h3-bold-weight: var(--weight-700);
	--h3-bold-size: 24px;
	--h3-bold-line-height: 110%;
	--h3-bold-letter-spacing: -0.02em;
	--h3-bold-text-transform: uppercase;
	--h3-bold-color: var(--dark-blue);
	--h3-bold-color-dark: var(--white);

	--h3-regular-family: var(--typeface-1);
	--h3-regular-weight: var(--weight-400);
	--h3-regular-size: 24px;
	--h3-regular-line-height: 120%;
	--h3-regular-text-transform: uppercase;
	--h3-regular-color: var(--dark-blue);
	--h3-regular-color-dark: var(--white);

	--h4-family: var(--typeface-1);
	--h4-weight: var(--weight-700);
	--h4-size: 18px;
	--h4-line-height: 100%;
	--h4-text-transform: uppercase;
	--h4-color: var(--dark-blue);
	--h4-color-dark: var(--white);
	
	/* CTA - shared rules */
	--cta-hero-family: var(--typeface-1);
	--cta-hero-weight: var(--weight-700);
	--cta-hero-size: 22px;
	--cta-hero-line-height: 110%;
	--cta-hero-text-transform: uppercase;
	--cta-hero-color: var(--dark-blue);
	--cta-hero-color-dark: var(--white);
	
	--cta-display: var(--flex);
	--cta-disabled: 0.3;
	--cta-line-heigth: 110%;
	--cta-text-transform: uppercase;
	--cta-cursor: pointer;
	--cta-width: fit-content;
		
	--cta-primary-family: var(--typeface-1);
	--cta-primary-weight: var(--weight-700);
	--cta-primary-size-big: 22px;
	--cta-primary-size-sma: 18px;
	--cta-primary-height: 54px;
	--cta-primary-line-height: 120%;
	--cta-primary-padding: 16px 24px;
	--cta-primary-color: var(--dark-blue);
	--cta-primary-color-dark: var(--white);
	--cta-primary-border-radius: var(--border-radius-sma-2);
	
	--cta-tertiary-iconfont: var(--typeface-3);
	
	--cta-sec-ter-family: var(--typeface-1);
	--cta-sec-ter-weight: var(--weight-400);
	--cta-sec-ter-size: 16px;
	--cta-sec-ter-height: 42px;
	--cta-sec-ter-line-height: 110%;
	--cta-sec-ter-padding: 10px 16px;
	--cta-sec-ter-letter-spacing: 0.01em;
	--cta-sec-ter-color: var(--dark-blue);
	--cta-sec-ter-color-dark: var(--white);
	--cta-sec-ter-border-radius: var(--border-radius-sma-1);
	
	/* CTA - B2C */
	--b2c-cta-primary-bg: var(--b2c-red);
	--b2c-cta-primary-bg-hov: var(--b2c-dark-red);
	
	--b2c-cta-secondary-bg: var(--white);
	--b2c-cta-secondary-bg-hov: var(--b2c-blue-100);
	--b2c-cta-secondary-border: 2px solid var(--b2c-blue-100);
	--b2c-cta-secondary-color: var(--b2c-blue-100);
	--b2c-cta-secondary-color-hov: var(--white);
	
	--b2c-cta-secondary-bg-dark: var(--b2c-blue-100);
	--b2c-cta-secondary-bg-hov-dark: var(--white);
	--b2c-cta-secondary-border-dark: 2px solid var(--white);
	--b2c-cta-secondary-color-dark: var(--white);
	--b2c-cta-secondary-color-hov-dark: var(--b2c-blue-100);
	
	--b2c-cta-secondary-bg-reverse: var(--b2c-blue-100);
	--b2c-cta-secondary-bg-hov-reverse: var(--b2c-blue-100);
	--b2c-cta-secondary-border-reverse: 2px solid var(--b2c-blue-100);
	
	--b2c-cta-tertiary-color: var(--b2c-blue-100);
	
	/* CTA - B2B */
	--b2b-cta-primary-bg: var(--b2b-red);
	--b2b-cta-primary-bg-hov: var(--b2b-dark-red);
	
	--b2b-cta-secondary-bg: var(--white);
	--b2b-cta-secondary-bg-hov: var(--b2b-blue-100);
	--b2b-cta-secondary-border: 2px solid var(--b2b-blue-100);
	--b2b-cta-secondary-color: var(--b2b-blue-100);
	--b2b-cta-secondary-color-hov: var(--white);
	
	--b2b-cta-secondary-bg-dark: var(--b2b-blue-100);
	--b2b-cta-secondary-bg-hov-dark: var(--white);
	--b2b-cta-secondary-border-dark: 2px solid var(--white);
	--b2b-cta-secondary-color-dark: var(--white);
	--b2b-cta-secondary-color-hov-dark: var(--b2b-blue-100);
	
	--b2b-cta-secondary-bg-reverse: var(--b2b-blue-100);
	--b2b-cta-secondary-bg-hov-reverse: var(--b2b-blue-100);
	--b2b-cta-secondary-border-reverse: 2px solid var(--b2b-blue-100);
	
	--b2b-cta-tertiary-color: var(--b2b-blue-100);
	
	/* CTA - FI */
	--fi-cta-primary-bg: var(--fi-gold);
	--fi-cta-primary-bg-hov: var(--fi-gold-dark);
	
	--fi-cta-secondary-bg: var(--fi-green-100);
	--fi-cta-secondary-bg-hov: var(--fi-green-60);
	--fi-cta-secondary-color: var(--white);
	--fi-cta-secondary-color-hov: var(--white);
	
	--fi-cta-secondary-bg-dark: var(--b2b-blue-100);
	--fi-cta-secondary-bg-hov-dark: var(--white);
	--fi-cta-secondary-border-dark: 2px solid var(--fi-gold);
	--fi-cta-secondary-color-dark: var(--white);
	--fi-cta-secondary-color-hov-dark: var(--b2b-blue-100);
	
	--fi-cta-secondary-bg-reverse: var(--b2b-blue-100);
	--fi-cta-secondary-bg-hov-reverse: var(--b2b-blue-100);
	--fi-cta-secondary-border-reverse: 2px solid var(--b2b-blue-100);
	
	--fi-cta-tertiary-color: var(--b2b-blue-100);
	
	
	--body-hero-family: var(--typeface-1);
	--body-hero-weight: var(--weight-300);
	--body-hero-size: 18px;
	--body-hero-line-height: 120%;
	--body-hero-letter-spacing: -0.02em;
	--body-hero-color: var(--dark-blue);
	--body-hero-color-dark: var(--white);
	
	--body-26-light-family: var(--typeface-2);
	--body-26-light-weight: var(--weight-300);
	--body-26-light-size: 26px;
	--body-26-light-line-height: 120%;
	--body-26-light-letter-spacing: 0.02em;
	--body-26-light-color: var(--dark-blue);
	--body-26-light-color-dark: var(--white);
	
	--body-24-bold-family: var(--typeface-2);
	--body-24-bold-weight: var(--weight-700);
	--body-24-bold-size: 24px;
	--body-24-bold-line-height: 120%;
	--body-24-bold-letter-spacing: 0.02em;
	--body-24-bold-color: var(--dark-blue);
	--body-24-bold-color-dark: var(--white);
	
	--body-18-bold-family: var(--typeface-2);
	--body-18-bold-weight: var(--weight-500);
	--body-18-bold-size: 18px;
	--body-18-bold-line-height: 120%;
	--body-18-bold-letter-spacing: 0.02em;
	--body-18-bold-color: var(--dark-blue);
	--body-18-bold-color-dark: var(--white);

	--body-18-light-family: var(--typeface-2);
	--body-18-light-weight: var(--weight-300);
	--body-18-light-size: 18px;
	--body-18-light-line-height: 120%;
	--body-18-light-letter-spacing: 0.02em;
	--body-18-light-color: var(--dark-blue);
	--body-18-light-color-dark: var(--white);

	--body-16-bold-family: var(--typeface-2);
	--body-16-bold-weight: var(--weight-500);
	--body-16-bold-size: 16px;
	--body-16-bold-line-height: 120%;
	--body-16-bold-color: var(--dark-blue);
	--body-16-bold-color-dark: var(--white);

	--body-16-light-family: var(--typeface-2);
	--body-16-light-weight: var(--weight-300);
	--body-16-light-size: 16px;
	--body-16-light-line-height: 120%;
	--body-16-light-color: var(--dark-blue);
	--body-16-light-color-dark: var(--white);

	--body-14-regular-family: var(--typeface-2);
	--body-14-regular-weight: var(--weight-300);
	--body-14-regular-size: 14px;
	--body-14-regular-line-height: 120%;
	--body-14-regular-letter-spacing: 0.02em;
	--body-14-regular-color: var(--dark-blue);
	--body-14-regular-color-dark: var(--white);
	
	/* ICONS */
	--icon-size-xs: 12px;
	--icon-size-s: 16px;
	--icon-size-m: 24px;
	--icon-size-ml: 36px;
	--icon-size-l: 48px;
	--icon-size-xl: 56px;
}