/*************************************************************************/

body {
	font-family : var(--font-body);
	font-size   : var(--font-size-body-lg);
	/* line-height : 1.6; */
	color       : var(--color-brown-main);
}


/*************************************************************************/
h1 {
	position       : relative;
	margin         : 0 0 20px;
	max-width      : 430px;
	padding-left   : 20px;
	text-indent    : -39px;

	font-family    : var(--font-heading);
	font-size      : var(--heading-size);
	line-height    : var(--heading-line);
	letter-spacing : var(--heading-letter);
	font-weight    : 300;
	text-transform : uppercase;
	text-align     : var(--heading-align);

	color          : rgba(75, 46, 32, 0.7);
}

	h1::first-line {
		color       : rgba(96, 58, 40, 0.94);
		font-weight : var(--font-weight-heading);
	}

	h1::before {
		content       : '';
		position      : absolute;
		left          : 0;
		top           : calc(1em * var(--heading-line) + 2px);
		bottom        : 2px;
		width         : 5px;
		border-radius : 3px;
		background    : #4b2e20;
	}

	h1 b {
		color : var(--color-brown-main);
	}

/*************************************************************************/

h2 {
	margin         : 0 0 20px;
	max-width      : 430px;
	font-family    : var(--font-heading);
	font-size      : var(--heading-size);
	line-height    : var(--heading-line);
	letter-spacing : var(--heading-letter);
	font-weight    : var(--font-weight-heading);
	text-transform : uppercase;
	color          : var(--heading-color);
	text-align     : var(--heading-align);
}

	h2 b {
		color : var(--color-brown-main);
	}


/*************************************************************************/

h3 {
	margin         : 0 0 28px;
	max-width      : 700px;
	font-family    : var(--font-heading);
	font-size      : clamp(22px, 2.5vw, 38px);
	line-height    : 1.02;
	letter-spacing : -0.015em;
	font-weight    : 500 !important;
	text-transform : none;
	text-wrap      : balance;
	color          : rgba(75, 46, 32, 0.88);
}

	h3 b {
		color : var(--color-brown-main);
	}

	h3 :is(b, strong) {
		font-weight : 400 !important;
	}


/*************************************************************************/

h4 {
	margin         : 0 0 10px -17px;
	font-family    : var(--font-ui);
	font-size      : clamp(16px, 1.2vw, 20px);
	line-height    : 1.06;
	letter-spacing : 0.09em;
	font-weight    : 400;
	text-transform : uppercase;
	color          : rgba(75, 46, 32, 0.9);
}

	h4 b {
		color : var(--color-brown-main);
	}


/*************************************************************************/

h5 {
	margin         : 0 0 24px;
	font-family    : var(--font-body);
	font-size      : clamp(17px, 1.18vw, 20px);
	line-height    : 1.5;
	letter-spacing : 0.005em;
	font-weight    : 300;
	color          : #000;
}

	h5 b {
		color : var(--color-brown-main);
	}


small {
	font-family : var(--font-body);
	font-size   : var(--font-size-body-2xs);
	line-height : 1.55;
	color       : var(--color-brown-main);
}

/*************************************************************************/

.text-button-small {
	font-family    : var(--font-ui);
	font-size      : var(--font-size-body-2xs);
	line-height    : 1;
	font-weight    : 400;
	letter-spacing : var(--letter-spacing-ui);
	text-transform : uppercase;
}

.text-button-medium {
	font-family    : var(--font-ui);
	font-size      : 14px;
	line-height    : 1;
	font-weight    : 400;
	letter-spacing : 0;
	text-transform : none;
}

.text-button-large {
	font-family    : var(--font-ui);
	font-size      : 18px;
	line-height    : 1;
	font-weight    : 400;
	letter-spacing : 0;
	text-transform : none;
}

@media (max-width : 640px) {
	h1 {
		max-width   : 240px;
		font-size   : 34px;
		line-height : 0.96;
		margin-left : 16px;
	}

	h2 {
		max-width   : 240px;
		font-size   : 34px;
		line-height : 0.96;
	}

	h3 {
		font-size   : 20px;
		line-height : 1.06;
		margin      : 0 0 20px;
	}

	h4 {
		font-size      : 13px;
		line-height    : 1.08;
		letter-spacing : 0.16em;
		margin-bottom  : 8px;
		margin-left    : 10px;
	}

	h5 {
		font-size      : 15px;
		line-height    : 1.48;
		letter-spacing : 0.004em;
		margin         : 0 0 16px;
	}

	body {
		font-size   : var(--font-size-body-sm);
		line-height : 1.52;
	}

/*************************************************************************/

	.text-button-small {
		font-size : var(--font-size-footer);
	}

	.text-button-medium {
		font-size : 15px;
	}

	.text-button-large {
		font-size : 16px;
	}
}