/**
 * Enhanced Heading Styles
 * Makes section headers more prominent and visually striking
 */

/* Main section headings (h2) */
section h2.font-display {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.03em;
	margin-bottom: 0.75rem;
	position: relative;
}

@media (min-width: 640px) {
	section h2.font-display {
		font-size: 2.5rem;
	}
}

@media (min-width: 1024px) {
	section h2.font-display {
		font-size: 3rem;
	}
}


/* Hero heading (h1) - already large, just enhance weight */
h1.font-display {
	font-weight: 700;
	letter-spacing: -0.04em;
}

/* Card headings (h3) - make them stand out more */
article h3.font-display,
aside h3.font-display {
	font-weight: 600;
	letter-spacing: -0.02em;
	margin-bottom: 0.5rem;
}

/* Newsletter and resource card headings */
h3.font-display,
h4.font-display {
	font-weight: 600;
	letter-spacing: -0.02em;
}

/* Add more spacing between heading and description */
section h2.font-display + p {
	margin-top: 1rem;
}

/* Enhance heading contrast on cream backgrounds */
.bg-cream h2.font-display,
.bg-cream h3.font-display {
	color: #2A0D1A;
}

/* Add subtle shadow to large headings for depth */
section h2.font-display {
	text-shadow: 0 1px 2px rgba(42, 13, 26, 0.1);
}

/* Hero heading gets extra emphasis */
h1.font-display {
	text-shadow: 0 2px 4px rgba(42, 13, 26, 0.15);
}