/* 23 = b2medias.com
 * Last update : 28.12.2025
*/

/* === VARIABLES === */

:root {
	/* === Colors === */		
	--color-main: #1d1d1b;
	--color-primary: #228dcd;
	--color-secondary: #333333; // footer
	--color-lightgrey: #efefef;	
	--color-light: #ffffff;
	--color-dark : #efefef; // nav
	
	--color-light-op2: rgba(255, 255, 255, .2);
	--color-light-op9: rgba(255, 255, 255, .9);
	--color-dark-op8: rgba(0, 0, 0, .8);
	--color-dark-op9: rgba(0, 0, 0, .9);
	
	/* === Typography === */
	--typo-title : 'Inter', sans-serif;
	--fw-title-medium : 500;
	--fw-title-bold : 700;
	--fw-title-extrabold : 900;
	
	--typo-main : 'Inter', sans-serif;
	--fw-light : 300;
	--fw-regular : 400;
	--fw-medium : 500;
	--fw-semibold : 600;
	--fw-bold : 700;
	--fw-extrabold : 800;
	
	--fs-title-xxl : clamp(3rem, 5vw, 6rem);				/* h1 */
	--fs-title-xl  : clamp(1.2rem, 2.5vw, 2.5rem);	/* h2 */
	--fs-title-lg  : clamp(1.1rem, 2.2vw, 2rem);		/* h3 */
	--fs-title-md  : clamp(1rem, 2vw, 1.5rem);			/* h4 */
	
	--fs-xl : clamp(1.2rem, 2.5vw, 2.5rem); 				/* big big p */
	--fs-lg : clamp(1.1rem, 2.2vw, 1.8rem);					/* big p */
	--fs-md	: clamp(1rem, 2vw, 1.2rem);							/* p */
	--fs-sm : clamp(0.9rem, 1.5vw, 1.2rem);					/* type meta */
	--fs-xs : clamp(0.8rem, 1.2vw, 1rem);						/* type ui */
	--fs-xxs : clamp(0.6rem, 1.8vw, 1rem);					/* type menu */
	
	--letter-spacing : 0.03rem;
	
	--line-height-md : 1.7;
	--line-height-sm : 1.5;
	--line-height-xs : 1;
	
	/* === width & height === */
	--width-inner-lg : 1200px;
	--width-inner-md : 800px;
	--width-inner-sm : 500px;
	
	--width-logo-header : clamp(70px, 25vw, 200px);
	--width-home-logo-cover : clamp(300px, 40vw, 700px);
	--width-logo-cover : clamp(100px, 40vw, 200px);
	--width-logo-footer : clamp(120px, 25vw, 150px);
	
	--height-lg : 70vh;
	--height-md : 50vh;
	--height-sm : 40vh;
	--height-xs : auto;
	
	/* === padding === */
	--padding-xl : clamp(3rem, 9vw, 7rem);					/* type big slider */
	--padding-lg : clamp(2rem, 6vw, 5rem);					/* type section top / botttom */
	--padding-md : clamp(1.5rem, 2.5vw, 2rem);			/* type container */
	--padding-sm : clamp(0.8rem, 1vw, 1rem);				/* type ui */
	--padding-xs : clamp(0.4rem, 1vw, 0.6rem);			/* type small scroll */
	
	/* === margin === */
	--margin-xl : clamp(2.5rem, 4vw, 4rem);					/* type section header and tagline */
	--margin-lg : clamp(1.2rem, 2.2vw, 3rem);				/* type section header and tagline */
	--margin-md : clamp(1rem, 1vw, 1.5rem);					/* type title h2, h2 */
	--margin-sm : clamp(0.8rem, 1.5vw, 1rem);				/* type title h3 */
	--margin-xs : clamp(0.5rem, 1.5vw, 0.8rem);			/* type title h4 */
	
	/* === ratio === */
	--ratio-horizontal: 3 / 1;
	--ratio-landscape: 16 / 9;
	--ratio-square: 1 / 1;
	--ratio-portrait: 4 / 5;
	
	/* === border radius === */
	--br-lg : 1rem;
	--br-md: 0.4rem;
	--br-sm : 0.3rem;
	--br-round : 50%;
	
	/* === shadow === */
	--shadow : 1px 3px 15px rgba(0, 0, 0, 0.6);
	--shadow-light : 1px -2px 12px rgba(0, 0, 0, 0.2);
	--shadow-bottom : 1px 1px 5px rgba(0, 0, 0, 0.08);
	--shadow-inset : inset 2px 2px 20px rgba(0, 0, 0, 0.8);
	
	/* === transition === */
	--transition-fast: 0.2s ease;
	--transition-medium: 0.3s ease;
	--transition-slow: 0.5s ease;
	
}

/* clean GF form */