/*
 * Type scale, transcribed from the Figma design-system page (node 666-11978).
 * Tokens (colors, spacing, font vars, sizes) live in tokens.css.
 *
 * Desktop values below 768px collapse to the mobile row. h3 has no mobile
 * value in the source file - h4 stays flat across breakpoints while h1/h2
 * shrink hard, so h3 was interpolated as one step down from its desktop
 * size (1.25rem -> 1.125rem) rather than left unscaled or shrunk hard.
 * Confirm against the design system page once available.
 *
 * Letter-spacing/line-height weren't in the transcribed list; these were
 * reverse-engineered from the Home - Launch pull, where every Clarendon
 * string tracks at 0.16em and every uppercase Cormorant/Azeret label
 * tracks at 0.08em, both regardless of size.
 */

body {
	background-color: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-cormorant);
	font-size: var(--text-body);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.03em;
}

.surface {
	background-color: var(--color-surface);
}

.text-secondary {
	color: var(--color-text-secondary);
}

h1,
h2,
h3 {
	font-family: var(--font-clarendon);
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

h1 {
	font-size: var(--text-h1);
}

h2 {
	font-size: var(--text-h2);
}

h3 {
	font-size: var(--text-h3);
}

h4,
h5 {
	font-family: var(--font-cormorant);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

h4 {
	font-size: var(--text-h4);
}

h5 {
	font-size: var(--text-h5);
}

p {
	font-size: var(--text-body);
}

.font-mono {
	font-family: var(--font-cormorant);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #dbdbdb;
}

.tag {
	display: inline-block;
	font-family: var(--font-cormorant);
	font-size: var(--text-tag);
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.03em;
	border: 1px solid currentColor;
	padding: 0.4em 0.9em;
}