/* ===== 메인 홈페이지 전용 디자인 토큰 & 공용 유틸리티 (v2) ===== */
:root{
	/* 메인 컬러 2가지만 진하고 쨍하게 사용 */
	--color-primary:#0B3FD1;
	--color-primary-light:#2E5CE0;
	--color-primary-tint:#E8EFFE;

	--color-accent:#F0590A;
	--color-accent-tint:#FEEBDD;

	--color-text:#171B21;
	--color-text-muted:#697180;
	--color-text-faint:#9AA2B1;
	--color-border:#EBEEF2;
	--color-bg:#ffffff;
	--color-bg-subtle:#F6F8FB;

	--space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
	--space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px;

	--radius-sm:10px; --radius-md:16px; --radius-lg:24px;

	--shadow-card:0 2px 14px rgba(23,27,33,.05);
	--shadow-card-lg:0 20px 48px rgba(23,27,33,.08), 0 2px 10px rgba(23,27,33,.04);

	--container-max:1240px;
	--header-height:148px;
	--header-height-mobile:60px;
}

.hm-section{
	padding: clamp(36px, 4vw, var(--space-7)) var(--space-5);
}
.hm-section--subtle{
	background: var(--color-bg-subtle);
}
.hm-container{
	max-width: var(--container-max);
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
}
.hm-card{
	background: var(--color-bg);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-card-lg);
	box-sizing: border-box;
}
.hm-section-title{
	font-family: 'Malgun Gothic', sans-serif;
	font-weight: 800;
	font-size: 26px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--color-text);
	letter-spacing: -0.3px;
	line-height: 1;
	white-space: nowrap;
}
.hm-section-title::after{
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
	flex: 0 0 auto;
	align-self: flex-start;
	margin-top: 3px;
}
.hm-section-heading{
	display: flex;
	align-items: center;
	margin-bottom: var(--space-5);
}

@media screen and (max-width: 1024px){
	.hm-section-title{ font-size: 22px; }
}
@media screen and (max-width: 800px){
	.hm-section{
		padding: var(--space-6) var(--space-4);
	}
	.hm-section-title{ font-size: 18px; }
}
