/**
 * Recipefy — typography system
 */

@font-face {
	font-family: "Heebo";
	src: url("../fonts/heebo/heebo-variable.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

h1 {
	font-size: var(--rfy-type-h1);
	font-weight: 800;
	line-height: 1.2;
	color: var(--rfy-text);
}

h2 {
	font-size: var(--rfy-type-h2);
	font-weight: 700;
	line-height: 1.2;
	color: var(--rfy-text);
}

h3 {
	font-size: var(--rfy-type-h3);
	font-weight: 700;
	line-height: 1.35;
	color: var(--rfy-text);
}

h4 {
	font-size: var(--rfy-type-min);
	font-weight: 700;
	line-height: 1.35;
	color: var(--rfy-text);
}

.rfy-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	padding: 6px 14px;
	border-radius: var(--rfy-radius-pill);
	background: rgba(196, 92, 62, 0.08);
	border: 1px solid rgba(196, 92, 62, 0.15);
	color: var(--rfy-primary);
	font-weight: 600;
	font-size: var(--rfy-type-min);
	letter-spacing: 0.02em;
}

.rfy-block-hero__badge.rfy-eyebrow::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--rfy-primary);
	flex-shrink: 0;
}

.rfy-section-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
	margin-bottom: var(--rfy-space-3);
	max-width: 720px;
	margin-inline: auto;
}

.rfy-section-head--start {
	align-items: flex-start;
	text-align: start;
	margin-inline: 0;
}

.rfy-section-head .rfy-sub {
	margin: 0;
}

.rfy-sub {
	margin: 0;
	color: var(--rfy-muted);
	max-width: 56ch;
	line-height: 1.7;
}

.rfy-block-hero__note {
	margin: 12px 0 0;
	color: var(--rfy-muted);
	font-size: var(--rfy-type-min);
}

.rfy-block-hero__headline em,
.rfy-block-hero__title em {
	font-style: normal;
	color: var(--rfy-accent);
}

.rfy-block-gallery__hint {
	margin: 0;
	color: var(--rfy-muted);
	font-weight: 600;
	font-size: var(--rfy-type-min);
	white-space: nowrap;
}

.rfy-block-gallery__meta {
	margin: 0;
	color: var(--rfy-muted);
	font-size: var(--rfy-type-min);
}

.rfy-block-testimonials__quote {
	margin: 0 0 12px;
	font-style: italic;
	line-height: 1.6;
	color: var(--rfy-text);
}

.rfy-block-testimonials__item cite {
	display: block;
	margin-top: 8px;
	color: var(--rfy-muted);
	font-size: var(--rfy-type-min);
	font-style: normal;
	font-weight: 600;
}

.rfy-recipe-hero__teaser {
	color: var(--rfy-muted);
	max-width: 60ch;
	line-height: 1.7;
}

.arc-paywall-copy {
	color: var(--rfy-muted);
	max-width: 400px;
	margin-inline: auto;
	line-height: 1.6;
}

.rfy-archive__intro {
	color: var(--rfy-muted);
	margin: 0;
	max-width: 56ch;
}

.arc-section-heading {
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--rfy-line);
	font-size: var(--rfy-type-h2);
	font-weight: 700;
}

.rfy-footer__heading {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(255, 255, 255, 0.9);
}

.rfy-auth-card__title {
	text-align: center;
	font-size: var(--rfy-type-h2);
	margin: 0 0 24px;
}

.rfy-auth-card__register {
	text-align: center;
	margin: 16px 0 0;
	color: var(--rfy-muted);
	font-size: var(--rfy-type-min);
}

.rfy-auth-card__register a {
	color: var(--rfy-primary);
	font-weight: 600;
}

/* Prose / rich text */
.rfy-prose,
.arc-recipe-prose {
	color: var(--rfy-text);
	line-height: 1.7;
	font-size: var(--rfy-type-body);
}

.rfy-prose > *:last-child,
.arc-recipe-prose > *:last-child {
	margin-bottom: 0;
}

.rfy-prose h2,
.arc-recipe-prose h2 {
	margin-top: 1.5em;
	margin-bottom: 0.5em;
}

.rfy-prose h3 {
	margin-top: 1.25em;
	margin-bottom: 0.5em;
}

.arc-recipe-prose h3 {
	display: none;
}

.rfy-prose p,
.arc-recipe-prose p {
	margin-bottom: 1em;
}

.rfy-prose ul,
.rfy-prose ol,
.arc-recipe-prose ul,
.arc-recipe-prose ol {
	margin: 0 0 1em;
	padding-inline-start: 1.25em;
}

.rfy-prose blockquote {
	margin: 1.5em 0;
	padding: 16px 20px;
	border-inline-start: 4px solid var(--rfy-accent);
	background: var(--rfy-background);
	border-radius: var(--rfy-radius-sm);
	color: var(--rfy-muted);
}

.rfy-prose img {
	border-radius: var(--rfy-radius-md);
	margin-block: 1em;
}

.rfy-prose a {
	color: var(--rfy-primary);
	font-weight: 600;
}
