/**
 * Section 5: Comeback rewards — Figma desktop 4095:4789 · mobile 4095:6014
 *
 * item 680×809 = ảnh 680×680 + 40 + section-headings 89
 *   headings: heading 680×29 (h5 25 × 115%), description y+45 → gap 16, rộng 600
 * Nút 295×42 căn giữa, cách list 80 (mobile 261×40, cách list 40).
 */

#cr-rewards .cr-rewards__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--var-40);
}

#cr-rewards .cr-rewards__item {
	display: flex;
	flex-direction: column;
	gap: var(--var-40);
}

/* Figma: ảnh VUÔNG ở mọi breakpoint (680 / 616 / 794 / 350) */
#cr-rewards .cr-rewards__media img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

#cr-rewards .cr-rewards__text {
	display: flex;
	flex-direction: column;
	gap: var(--var-16);
}

/* Figma: description bị giới hạn 600 kể cả trong cột 680 */
#cr-rewards .cr-rewards__text .cr-description {
	width: 600px;
	max-width: 100%;
}

#cr-rewards .cr-rewards__cta {
	display: flex;
	justify-content: center;
}

@media (max-width: 1024px) {
	/* Figma tablet/mobile: 2 item xếp dọc, gap 80 (mobile item 496, cách nhau 576) */
	#cr-rewards .cr-rewards__list {
		grid-template-columns: 1fr;
		gap: var(--var-80);
	}

	/* mobile: ảnh 350 + 40 + headings 106 = 496 → gap trong item vẫn 40 */
	#cr-rewards .cr-rewards__item {
		gap: var(--var-40);
	}
}