/**
 * Section 3: Solution intro — Figma desktop 4095:4781 · mobile 4095:6006
 *
 * Figma: khoảng cách headings ↔ ảnh là 40 (ảnh ở y=235, headings cao 195),
 * KHÔNG phải section-gap 80 → ghi đè gap của .cr-stack.
 */

#cr-introducing .cr-introducing__stack {
	gap: var(--var-40);
}

/* Figma desktop: ảnh 1400×719.5 */
#cr-introducing .cr-introducing__media img {
	width: 100%;
	height: auto;
	aspect-ratio: 1400 / 719.5;
}

@media (max-width: 1024px) {
	/* Figma mobile: ảnh 350×310.9, headings 164, gap 40 (ảnh ở y=204).
	   <picture> đổi sang file introducing-mobile.webp nhưng attribute width/height
	   trên <img> vẫn là của bản desktop → trình duyệt suy ra sai tỉ lệ (350×180).
	   Phải ghi đè aspect-ratio theo đúng asset mobile. */
	#cr-introducing .cr-introducing__media img {
		/* asset mobile là frame export 4095:5356 = 810×719 (cùng tỉ lệ với
		   350×310.9 của frame trang, nhưng nguồn to hơn nên nét hơn) */
		aspect-ratio: 810 / 719;
	}
}