/*
 * гимнастика36.рф — home page (README «Главная страница»). Colours as in product.css: brand blue #65B4F1 for
 * backgrounds, #1F74B8 for text and buttons (4.9:1 on white).
 */
:root {
	--gym36-blue: #1f74b8;
	--gym36-blue-dark: #185c93;
	--gym36-blue-soft: #eaf3fb;
	--gym36-ink: #1f2933;
	--gym36-muted: #5f6b76;
	--gym36-line: #e3e8ee;
}

/* ---- H1 and lead under the slider ---- */
.gym36-catalog .gym36-h1 .elementor-heading-title {
	font-size: clamp(24px, 3vw, 34px);
	line-height: 1.2;
	font-weight: 700;
	color: var(--gym36-ink);
	text-wrap: balance;
}
.gym36-catalog .gym36-lead {
	max-width: 760px;
	margin-top: 4px;
	font-size: 16px;
	line-height: 1.55;
	color: var(--gym36-muted);
}
.gym36-catalog .gym36-lead p {
	margin: 0;
}

/* ---- Category tiles ---- */
.gym36-cats {
	list-style: none;
	margin: 20px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(178px, 1fr));
	gap: 12px;
}
.gym36-cat {
	margin: 0;
}
.gym36-cat a {
	display: grid;
	grid-template-columns: 48px 1fr;
	grid-template-rows: auto auto;
	column-gap: 12px;
	align-items: center;
	height: 100%;
	padding: 12px 14px;
	border: 1px solid var(--gym36-line);
	border-radius: 12px;
	background: #fff;
	color: var(--gym36-ink);
	text-decoration: none;
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.gym36-cat a:hover {
	border-color: #65b4f1;
	box-shadow: 0 6px 18px rgba(31, 116, 184, .12);
	transform: translateY(-1px);
}
.gym36-cat a:focus-visible {
	outline: 3px solid var(--gym36-blue);
	outline-offset: 2px;
}
.gym36-cat__icon {
	grid-row: 1 / span 2;
	width: 48px;
	height: 48px;
	object-fit: contain;
	border-radius: 8px; /* the SVG icons carry their own pale square */
}
.gym36-cat__name {
	min-width: 0;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	overflow-wrap: anywhere;
	hyphens: auto;
}
.gym36-cat__count {
	font-size: 13px;
	color: var(--gym36-muted);
}
@media (prefers-reduced-motion: reduce) {
	.gym36-cat a { transition: none; }
	.gym36-cat a:hover { transform: none; }
}

/* ---- Benefits strip: three facts in a row, icon on the left ---- */
.gym36-benefits .elementor-inner-section .elementor-column > .elementor-widget-wrap {
	display: grid;
	grid-template-columns: 52px 1fr;
	column-gap: 14px;
	align-content: start;
	padding: 18px 18px 14px;
	border-radius: 12px;
	background: var(--gym36-blue-soft);
}
.gym36-benefits .elementor-inner-section .elementor-column {
	padding: 0 6px;
}
.gym36-benefits .elementor-widget-icon {
	grid-row: 1 / span 2;
	margin: 0 !important;
}
.gym36-benefits .elementor-widget-icon .elementor-icon {
	font-size: 22px;
	padding: 14px;
}
.gym36-benefits .elementor-widget-heading,
.gym36-benefits .elementor-widget-text-editor {
	margin: 0 !important;
}
.gym36-benefits .elementor-heading-title {
	font-size: 17px;
	margin: 0 0 4px;
}
.gym36-benefits .elementor-widget-text-editor {
	font-size: 14px;
	line-height: 1.5;
	color: var(--gym36-ink);
}
.gym36-benefits .elementor-widget-text-editor p {
	margin: 0;
}
.gym36-benefits .elementor-widget-text-editor a {
	color: var(--gym36-blue);
	font-weight: 600;
}

/* ---- Buttons on light-blue that were white on #65B4F1 (2.3:1) ---- */
.home .btn.btn-color-primary,
.home .wd-button-wrapper .btn.btn-style-default:not(.btn-color-white) {
	background-color: var(--gym36-blue);
	color: #fff;
}
.home .btn.btn-color-primary:hover,
.home .wd-button-wrapper .btn.btn-style-default:not(.btn-color-white):hover {
	background-color: var(--gym36-blue-dark);
	color: #fff;
}
/* Section titles («Новинки», «Популярные») in the readable blue */
.home .wd-el-title .title,
.home .wd-el-title .woodmart-title-container {
	color: var(--gym36-blue);
}

/* ---- Phones ---- */
@media (max-width: 767px) {
	/* Hero slides: the text is part of the picture — keep the whole picture (no side crop), tap opens the slide link */
	.home .wd-slide {
		min-height: 0 !important;
		aspect-ratio: 1700 / 1153;
	}
	.home .wd-slide .wd-slide-container {
		display: none;
	}
	/* Side banners (certificate, new arrivals): their captions are in the picture — natural height, nothing cut */
	.home .elementor-element-51d0d68 .promo-banner-wrapper,
	.home .elementor-element-51d0d68 .promo-banner,
	.home .elementor-element-51d0d68 .banner-image,
	.home .elementor-element-e2fe29c .promo-banner-wrapper,
	.home .elementor-element-e2fe29c .promo-banner,
	.home .elementor-element-e2fe29c .banner-image {
		height: auto !important;
	}
	.home .elementor-element-51d0d68 .banner-image img,
	.home .elementor-element-e2fe29c .banner-image img {
		height: auto !important;
		object-fit: contain;
	}
	.gym36-cats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}
	.gym36-cat a {
		grid-template-columns: 40px 1fr;
		column-gap: 10px;
		padding: 10px;
	}
	.gym36-cat__icon {
		width: 40px;
		height: 40px;
	}
	.gym36-cat__name {
		font-size: 14px;
	}
	.gym36-benefits .elementor-inner-section .elementor-column {
		margin-bottom: 8px;
	}
}
