/**
 * 共通セクション見出し（.section-heading）
 * 左に刷毛アイコンのみ、右側装飾なし。全セクションで共通使用。
 */

/*
 * color は .section-heading にのみ指定し、アイコン（currentColor）はそれを継承する。
 * 背景色が変わるセクションを追加する場合も、下記のように .section-heading の color を
 * 上書きするだけで見出し文字とアイコンが同時に色変更される。
 * 例）.section--dark .section-heading { color: #fff; }
 */
.section-heading {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 32px;
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--color-navy);
}

.section-heading__icon {
	flex-shrink: 0;
	width: 26px;
	height: 26px;
}

@media (min-width: 769px) {
	.section-heading {
		font-size: 1.75rem;
		margin-bottom: 40px;
	}

	.section-heading__icon {
		width: 30px;
		height: 30px;
	}
}