@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;900&family=Roboto:wght@400;900&display=swap');

:root{
	--font-default: 'Montserrat', 'sans-serif';
	--font-ui: 'Roboto', 'sans-serif';

	/* Design System Spacing Tokens */
	--btn-radius: 10px;
	--card-radius: 12px;
	--card-padding: 24px;
	--spacing-sm: 8px 12px;
	--spacing-md: 12px 16px;
	--spacing-lg: 16px 24px;
	--transition-fast: 0.3s ease;
}

.page-title{ font-display: block; font-size: 3em; font-family: var(--font-default); font-weight: 300; text-align: center; letter-spacing: -2px; line-height: 110%; display: block; color: rgba(0,0,0,0.6); }

@media (max-width: 1600px) {

}
@media (max-width: 1200px) {

}
@media (max-width: 1024px) {

}
@media (max-width: 840px) {
	.page-title{ font-size: 2.6em; }
}
@media (max-width: 720px) {

}
@media (max-width: 600px) {
	.page-title{ font-size: 2.2em; letter-spacing: -1px; }
}
@media (max-width: 480px) {
	.page-title{ font-size: 1.8em; letter-spacing: 0px; }
}
@media (max-width: 320px) {

}