/**
 * Guide Article — обложка, текст и галерея записи AJ1 Guides (ТЗ V4, п. 8.3).
 *
 * Макета в Figma нет: текст — типографика .legal-content__body (колонка 860),
 * фото — скругление 14 и светлая медиа-зона, как у карточек сайта; галерея —
 * 3 в ряд, на мобильном — колонкой.
 *
 * @package AJ1MOTO.COM
 */

.guide-article {
	padding-top: var(--space-60);
	padding-bottom: var(--space-60);
	background: var(--color-white);
}

.guide-article__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-40);
}

.guide-article__cover {
	aspect-ratio: 16 / 9;
	border-radius: var(--radius-14);
	background: var(--color-grey-95);
	overflow: hidden;
}

.guide-article__cover-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.guide-article__gallery {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-20);
}

.guide-article__gallery-link {
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--radius-14);
	background: var(--color-grey-95);
	overflow: hidden;
}

.guide-article__gallery-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--transition-base);
}

.guide-article__gallery-link:hover .guide-article__gallery-image {
	transform: scale(1.04);
}

@media (max-width: 767px) {
	.guide-article {
		padding-top: var(--space-40);
		padding-bottom: var(--space-40);
	}

	.guide-article__inner {
		gap: var(--space-30);
	}

	.guide-article__cover {
		border-radius: var(--radius-12);
	}

	.guide-article__gallery {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--space-15);
	}

	.guide-article__gallery-link {
		border-radius: var(--radius-12);
	}
}
