/*
  Mầm non miền Bắc — design tokens.
  Tỉ lệ tương phản ghi dưới đây tính theo WCAG 2.1 relative luminance,
  không ước lượng bằng mắt.
*/

:root {
	/* Nền — xám-lục lạnh, cố ý lệch khỏi họ "giấy ấm" (cream/be) mà mọi trang
	   mầm non khác trong bộ đã dùng. */
	--suong: #eef0e8;
	--suong-sam: #e2e6da;
	--vien: #d3d9c8; /* viền mảnh, KHÔNG bao giờ là dấu hiệu trạng thái duy nhất */

	/* Chữ */
	--muc: #20272a; /* thân bài — 14.8:1 trên --suong */
	--muc-nhat: #5a655f; /* chú thích, ngày tháng — 5.7:1 trên --suong */

	/* Cấu trúc — chàm (nhuộm chàm, nghề thủ công miền núi phía Bắc) */
	--cham: #2d3a5f; /* 9.1:1 trên --suong */
	--cham-sam: #1f2944; /* hover/active */
	--cham-nhat: #dde1ec; /* nền nhạt cho khối trên nền --cham, dải phổ nhạt */

	/* Accent — đồng (bronze), tối và xỉn hơn hẳn vàng/mật ong thường gặp */
	--dong: #8a6a3a; /* 4.4:1 trên --suong — CHỈ dùng ≥24px hoặc trên nền --cham, không dùng làm chữ nhỏ */
	--dong-muc: #6b4f28; /* 6.3:1 trên --suong — dùng khi cần CHỮ màu đồng */
	--dong-nhat: #ece2cd; /* nền nhạt cho mốc/nhãn trên --suong-sam */

	--font-display: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;
	--font-body: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		"Helvetica Neue", Arial, sans-serif;

	--measure: 70ch;
	--shell: 78rem;
	--note-w: 20rem;
	--gutter: clamp(1.25rem, 5vw, 3rem);

	/* Thang spacing t-shirt — rộng hơn hẳn thang tra cứu thông thường, để có "chỗ thở" */
	--space-2xs: 0.375rem;
	--space-xs: 0.75rem;
	--space-s: 1.25rem;
	--space-m: 2rem;
	--space-l: 3.5rem;
	--space-xl: 5.5rem;
	--space-2xl: 8rem;
	--space-3xl: 11rem;

	/* Type scale — fluid, phân cấp bằng size/weight/spacing, không bằng màu/khung */
	--text-s: 0.9rem;
	--text-body: 1.0625rem;
	--text-lead: clamp(1.15rem, 1rem + 0.6vw, 1.35rem);
	--text-h3: clamp(1.3rem, 1.1rem + 1vw, 1.7rem);
	--text-h2: clamp(1.7rem, 1.3rem + 2vw, 2.4rem);
	--text-h1: clamp(2.2rem, 1.5rem + 3.5vw, 3.6rem);
}

@media (min-width: 48rem) {
	:root {
		--text-body: 1.125rem;
	}
}

@font-face {
	font-family: "Fraunces";
	src: url("/fonts/fraunces-vietnamese.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169,
		U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323,
		U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
	font-family: "Fraunces";
	src: url("/fonts/fraunces-latin.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Fraunces";
	src: url("/fonts/fraunces-vietnamese.woff2") format("woff2");
	font-weight: 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169,
		U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323,
		U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
	font-family: "Fraunces";
	src: url("/fonts/fraunces-latin.woff2") format("woff2");
	font-weight: 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("/fonts/source-sans-3-vietnamese.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169,
		U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323,
		U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("/fonts/source-sans-3-latin.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("/fonts/source-sans-3-vietnamese.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169,
		U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323,
		U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("/fonts/source-sans-3-latin.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}