/* ============================================================
   SALAFORMA — type.364a.css
   @font-face + escala tipografica.
   ============================================================ */

@layer base {
	@font-face {
		font-family: "Manrope";
		font-style: normal;
		font-weight: 400 800;
		font-display: swap;
		src: url("../fonts/manrope-latin.woff2") format("woff2");
		unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
	}

	@font-face {
		font-family: "Manrope";
		font-style: normal;
		font-weight: 400 800;
		font-display: swap;
		src: url("../fonts/manrope-latin-ext.woff2") format("woff2");
		unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
	}

	@font-face {
		font-family: "Unbounded";
		font-style: normal;
		font-weight: 500 800;
		font-display: swap;
		src: url("../fonts/unbounded-latin.woff2") format("woff2");
		unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
	}

	@font-face {
		font-family: "Unbounded";
		font-style: normal;
		font-weight: 500 800;
		font-display: swap;
		src: url("../fonts/unbounded-latin-ext.woff2") format("woff2");
		unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
	}

	html {
		font-size: 16px;
		-webkit-text-size-adjust: 100%;
	}

	body {
		font-family: var(--ff-text);
		font-weight: 400;
		font-size: 17px;
		line-height: 1.6;
		color: var(--c-grey-900);
		letter-spacing: .1px;
	}

	h1, h2, h3, h4 {
		font-family: var(--ff-display);
		font-weight: 600;
		line-height: 1.08;
		letter-spacing: -.01em;
		color: var(--c-black);
		margin: 0;
	}

	.eyebrow, .h1, h1 {
		text-transform: none;
	}

	h1, .fs-h1 {
		font-size: clamp(38px, 5vw + 14px, 76px);
		font-weight: 700;
	}

	h2, .fs-h2 {
		font-size: clamp(30px, 2.6vw + 16px, 48px);
	}

	h3, .fs-h3 {
		font-size: clamp(22px, 1.4vw + 14px, 28px);
	}

	h4, .fs-h4 {
		font-size: 18px;
		font-weight: 600;
	}

	p {
		margin: 0 0 var(--sp-4);
		max-width: 62ch;
	}

	a {
		color: inherit;
	}

	.lede {
		font-size: clamp(17px, .6vw + 15px, 20px);
		line-height: 1.65;
		color: var(--c-grey-700);
	}

	.eyebrow {
		font-family: var(--ff-text);
		font-weight: 700;
		font-size: 13px;
		letter-spacing: .16em;
		text-transform: uppercase;
		color: var(--c-accent);
	}

	.num {
		font-family: var(--ff-display);
		color: var(--c-accent);
		font-weight: 600;
	}

	.sr-only {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}
}
