/* Carpatian p15 design: home (owned by the home design agent). Uses the tokens of cr_design_tokens.css.
 * Layout 1 (common/home), rows after sql-manual/2026-10-26_32_design_home.sql:
 *   top-1 hero (#275) · top-2 benefits (#86) · top-3 categories (#363 + #341) · top-4 products (#310 + #364)
 *   top-5 brands (#340) · top-6 testimonials (#321 + #180, dark band).
 * The product card itself belongs to the listing zone; here only the section rhythm, titles and tabs. */

/* ---------- section rhythm (Leo: 60/60 desktop, 30/30 phone; white / light grey / one dark band) ---------- */
html.route-common-home .grid-row-top-2,
html.route-common-home .grid-row-top-3,
html.route-common-home .grid-row-top-4,
html.route-common-home .grid-row-top-5,
html.route-common-home .grid-row-top-6 {
	padding-top: var(--cr-section-y);
	padding-bottom: var(--cr-section-y);
	padding-left: 15px;
	padding-right: 15px;
	margin-top: 0;
	border: 0;
}
html.route-common-home .grid-row-top-2 { padding-top: 0; padding-bottom: 0; background: var(--cr-bg); border-bottom: 1px solid var(--cr-line); }
html.route-common-home .grid-row-top-3 { background: var(--cr-bg); }
html.route-common-home .grid-row-top-4 { background: var(--cr-bg-alt); }
html.route-common-home .grid-row-top-5 { background: var(--cr-bg); }
html.route-common-home .grid-row-top-6 { background: var(--cr-dark); }
html.route-common-home .grid-row-top-2 > .row-bg,
html.route-common-home .grid-row-top-3 > .row-bg,
html.route-common-home .grid-row-top-4 > .row-bg,
html.route-common-home .grid-row-top-5 > .row-bg,
html.route-common-home .grid-row-top-6 > .row-bg { background: transparent; }
html.route-common-home .grid-row-top-2 > .wave-top,
html.route-common-home .grid-row-top-2 > .wave-bottom { display: none; }
html.route-common-home .grid-row-top-2 .grid-col,
html.route-common-home .grid-row-top-3 .grid-col,
html.route-common-home .grid-row-top-4 .grid-col,
html.route-common-home .grid-row-top-5 .grid-col,
html.route-common-home .grid-row-top-6 .grid-col { margin-top: 0; padding: 0; }

/* ---------- section titles: condensed, uppercase, centred, short red bar ---------- */
html.route-common-home .title-module .title-wrapper,
html.route-common-home .title-module .title-main { background: transparent; padding: 0; }
html.route-common-home .title-module .title-main::before { display: none; }
html.route-common-home .title-module h3,
html.route-common-home .module-manufacturers-340 .module-title {
	font-family: var(--cr-font-display);
	font-weight: 700;
	font-size: clamp(27px, 1.2rem + 1.4vw, 40px);
	line-height: 1.1;
	letter-spacing: .01em;
	text-transform: uppercase;
	text-align: center;
	color: var(--cr-dark);
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}
html.route-common-home .title-module h3::after,
html.route-common-home .module-manufacturers-340 .module-title::after {
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	margin: 14px auto 0;
	background: var(--cr-accent);
	border-radius: 2px;
}
html.route-common-home .title-module .title-divider,
html.route-common-home .title-module .subtitle:empty { display: none; }
html.route-common-home .title-module { margin-bottom: 30px; padding: 0; }
html.route-common-home .module-title-321 h3 { color: var(--cr-text-on-dark); }

/* ---------- hero (#275, Master Slider): dark gradient for contrast, condensed title, red CTA ---------- */
html.route-common-home .module-master_slider-275 .ms-slide-bgcont::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(31, 38, 46, .86) 0%, rgba(31, 38, 46, .62) 38%, rgba(31, 38, 46, .05) 72%);
	pointer-events: none;
}
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-1 {
	font-family: var(--cr-font-body);
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--cr-text-on-dark);
	background: transparent;
	white-space: nowrap;
}
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-2 {
	font-family: var(--cr-font-display);
	font-weight: 700;
	text-transform: uppercase;
	color: var(--cr-bg);
	white-space: nowrap;
	text-shadow: 0 2px 18px rgba(0, 0, 0, .35);
}
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn {
	font-family: var(--cr-font-body);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--cr-bg);
	background: var(--cr-accent);
	border: 0;
	border-radius: var(--cr-radius-sm);
	box-shadow: 0 8px 22px rgba(248, 48, 61, .32);
	transition: background-color var(--cr-fast) ease, transform var(--cr-fast) ease;
}
/* the layer box is the 1320 canvas (centred above 1320, from x=0 below): keep a gutter and air above the CTA */
html.route-common-home .module-master_slider-275 .ms-layer.ms-layer-text,
html.route-common-home .module-master_slider-275 .ms-btn-container { left: 20px !important; }
html.route-common-home .module-master_slider-275 .ms-btn-container { margin-top: 18px !important; }
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn { left: 0 !important; }
/* Master Slider writes a scaled padding / font-size inline (base 14 px); the CTA keeps Leo's 50 px height */
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn {
	min-height: 50px;
	padding: 15px 28px !important;
	font-size: 16px !important;
	line-height: 20px !important;
}
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn:hover,
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn:focus-visible {
	background: var(--cr-accent-hover);
	color: var(--cr-bg);
}
html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn:focus-visible {
	outline: 3px solid var(--cr-bg);
	outline-offset: 3px;
}
html.route-common-home .module-master_slider-275 .ms-bullet {
	width: 28px;
	height: 4px;
	border-radius: 2px;
	background: rgba(255, 255, 255, .55);
}
html.route-common-home .module-master_slider-275 .ms-bullet.ms-bullet-selected,
html.route-common-home .module-master_slider-275 .ms-bullet:hover { background: var(--cr-accent); }

/* ---------- benefits bar (#86): 4 columns, icon left, short text ---------- */
html.route-common-home .module-info_blocks-86 .info_blocks-grid { margin: 0; }
html.route-common-home .module-info_blocks-86 .module-item { padding: 0; }
html.route-common-home .module-info_blocks-86 .info-block {
	display: flex;
	align-items: center;
	gap: 16px;
	height: 100%;
	min-height: 112px;
	padding: 24px 22px;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: var(--cr-text);
	text-decoration: none;
	transition: background-color var(--cr-fast) ease;
}
html.route-common-home .module-info_blocks-86 .module-item + .module-item .info-block { border-left: 1px solid var(--cr-line); }
html.route-common-home .module-info_blocks-86 a.info-block:hover { background: var(--cr-bg-alt); }
html.route-common-home .module-info_blocks-86 a.info-block:focus-visible { outline: 3px solid var(--cr-blue); outline-offset: -3px; }
html.route-common-home .module-info_blocks-86 .info-block::before {
	flex: 0 0 52px;
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	border-radius: 50%;
	font-size: 22px;
	color: var(--cr-blue);
	background: rgba(15, 86, 132, .08);
}
html.route-common-home .module-info_blocks-86 .info-block-content { padding: 0; text-align: left; }
html.route-common-home .module-info_blocks-86 .info-block .info-block-title {
	font-family: var(--cr-font-display);
	font-weight: 700;
	font-size: 17px;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--cr-dark);
}
html.route-common-home .module-info_blocks-86 .info-block .info-block-text {
	margin-top: 4px;
	font-family: var(--cr-font-body);
	font-size: 14px;
	line-height: 1.45;
	color: var(--cr-text-muted);
}
html.route-common-home .module-info_blocks-86 .info-block-button { display: none; }

/* ---------- category tiles (#341): card, image on white, caption under the image ---------- */
html.route-common-home .module-banners-341 .banners-grid { margin: -10px; }
html.route-common-home .module-banners-341 .module-item { padding: 10px; }
html.route-common-home .module-banners-341 .module-item > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	background: var(--cr-bg);
	border: 1px solid var(--cr-line);
	border-radius: var(--cr-radius);
	text-decoration: none;
	transition: box-shadow var(--cr-normal) var(--cr-ease), border-color var(--cr-fast) ease, transform var(--cr-normal) var(--cr-ease);
}
html.route-common-home .module-banners-341 .module-item > a::after { display: none; }
html.route-common-home .module-banners-341 .module-item > a img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	padding: 12px;
	transform: none;
	transition: transform var(--cr-normal) var(--cr-ease);
}
html.route-common-home .module-banners-341 .banner-caption {
	position: static;
	transform: none;
	width: 100%;
	padding: 14px 16px 16px;
	background: transparent;
	border-top: 1px solid var(--cr-line);
	text-align: center;
}
html.route-common-home .module-banners-341 .banner-caption span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 0;
	background: transparent;
	font-family: var(--cr-font-display);
	font-weight: 700;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--cr-dark);
	transition: color var(--cr-fast) ease;
}
html.route-common-home .module-banners-341 .banner-caption span::after {
	content: "\2192";
	font-family: var(--cr-font-body);
	font-size: 18px;
	color: var(--cr-accent);
	transition: transform var(--cr-fast) ease;
}
html.route-common-home .module-banners-341 .module-item > a:hover,
html.route-common-home .module-banners-341 .module-item > a:focus-visible {
	border-color: transparent;
	box-shadow: var(--cr-shadow-lg);
	transform: translateY(-3px);
}
html.route-common-home .module-banners-341 .module-item > a:focus-visible { outline: 3px solid var(--cr-blue); outline-offset: 2px; }
html.route-common-home .module-banners-341 .module-item > a:hover img { transform: scale(1.04); }
html.route-common-home .module-banners-341 .module-item > a:hover .banner-caption span { color: var(--cr-accent-hover); }
html.route-common-home .module-banners-341 .module-item > a:hover .banner-caption span::after { transform: translateX(4px); }

/* ---------- product tabs (#364): centred tabs, thick underline on the active one ---------- */
html.route-common-home .module-products-364 .tab-container > .nav-tabs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 28px;
	margin: 0 0 30px;
	padding: 0;
	border: 0;
	background: transparent;
}
html.route-common-home .module-products-364 .tab-container > .full-tabs-bg { display: none; }
html.route-common-home div.module-products-364 .module-body .nav-tabs > li,
html.route-common-home div.module-products-364 .module-body .nav-tabs > li.active { margin: 0; float: none; border: 0; }
html.route-common-home div.module-products-364 .module-body .nav-tabs > li > a:not(.item-all-link) {
	display: block;
	min-height: 44px;
	margin: 0;
	padding: 10px 4px 8px;
	font-family: var(--cr-font-display);
	font-weight: 700;
	font-size: 18px;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--cr-text);
	background: transparent;
	border: 0;
	border-bottom: 4px solid var(--cr-line);
	border-radius: 0;
	transition: color var(--cr-fast) ease, border-color var(--cr-fast) ease;
}
html.route-common-home .module-products-364 .nav-tabs > li > a::before,
html.route-common-home .module-products-364 .nav-tabs > li > a::after { display: none; }
html.route-common-home div.module-products-364 .module-body .nav-tabs > li > a:not(.item-all-link):hover { color: var(--cr-dark); border-bottom-color: var(--cr-text-muted); }
html.route-common-home div.module-products-364 .module-body .nav-tabs > li.active > a:not(.item-all-link),
html.route-common-home div.module-products-364 .module-body .nav-tabs > li.active > a:not(.item-all-link):hover,
html.route-common-home div.module-products-364 .module-body .nav-tabs > li.active > a:not(.item-all-link):focus {
	color: var(--cr-dark);
	background: transparent;
	border-bottom-color: var(--cr-accent);
}
html.route-common-home .module-products-364 .nav-tabs > li > a:focus-visible { outline: 3px solid var(--cr-blue); outline-offset: 2px; }

/* ---------- brands (#340): logo strip, greyscale to colour on hover ---------- */
html.route-common-home .module-manufacturers-340 .module-title { margin: 0 0 30px; }
html.route-common-home .module-manufacturers-340 .manufacturer-thumb .image a {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px;
	border-radius: var(--cr-radius);
}
html.route-common-home .module-manufacturers-340 .manufacturer-thumb .image img { max-height: 110px; width: auto; object-fit: contain; }
html.route-common-home .module-manufacturers-340 .manufacturer-thumb .image a:focus-visible { outline: 3px solid var(--cr-blue); outline-offset: -3px; }

/* ---------- testimonials (#180) on the dark band ---------- */
html.route-common-home .module-testimonials-180 .module-item {
	display: flex;
	flex-direction: column;
	padding: 28px 26px 24px;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: var(--cr-radius);
	color: var(--cr-text-on-dark);
}
html.route-common-home .module-testimonials-180 .module-item::before {
	content: "\201C";
	display: block;
	height: 34px;
	font-family: var(--cr-font-display);
	font-weight: 700;
	font-size: 64px;
	font-style: normal;
	line-height: 1;
	color: var(--cr-accent);
}
html.route-common-home .module-testimonials-180 .block-body { flex: 1 1 auto; }
html.route-common-home .module-testimonials-180 .block-content,
html.route-common-home .module-testimonials-180 .block-content i {
	font-family: var(--cr-font-body);
	font-style: normal;
	font-size: 16px;
	line-height: 1.6;
	text-align: left;
	color: var(--cr-text-on-dark);
}
html.route-common-home .module-testimonials-180 .block-footer {
	margin-top: 18px;
	padding-top: 14px;
	border-top: 1px solid rgba(255, 255, 255, .12);
	font-family: var(--cr-font-display);
	font-weight: 700;
	font-style: normal;
	font-size: 15px;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-align: left;
	color: var(--cr-muted-on-dark);
}
html.route-common-home .module-testimonials-180 .swiper-pagination-bullet { background: rgba(255, 255, 255, .5); }
html.route-common-home .module-testimonials-180 .swiper-pagination-bullet-active { background: var(--cr-accent); }

/* ---------- tablet ---------- */
@media (max-width: 1024px) {
	html.route-common-home .module-info_blocks-86 .module-item:nth-child(3) .info-block { border-left: 0; }
	html.route-common-home .module-info_blocks-86 .module-item:nth-child(n+3) .info-block { border-top: 1px solid var(--cr-line); }
}

/* ---------- phone ---------- */
@media (max-width: 760px) {
	html.route-common-home .grid-row-top-3,
	html.route-common-home .grid-row-top-4,
	html.route-common-home .grid-row-top-5,
	html.route-common-home .grid-row-top-6 {
		padding-top: var(--cr-section-y-mobile);
		padding-bottom: var(--cr-section-y-mobile);
	}
	html.route-common-home .title-module { margin-bottom: 20px; }
	html.route-common-home .title-module h3::after { margin-top: 10px; }
	html.route-common-home .module-info_blocks-86 .info-block {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		min-height: 0;
		padding: 18px 14px;
	}
	html.route-common-home .module-info_blocks-86 .info-block::before { flex-basis: 44px; width: 44px; height: 44px; font-size: 19px; }
	html.route-common-home .module-info_blocks-86 .info-block .info-block-title { font-size: 15px; }
	html.route-common-home .module-info_blocks-86 .info-block .info-block-text { font-size: 13px; }
	html.route-common-home .module-banners-341 .banners-grid { margin: -6px; }
	html.route-common-home .module-banners-341 .module-item { padding: 6px; }
	html.route-common-home .module-banners-341 .module-item > a img { padding: 6px; }
	html.route-common-home .module-banners-341 .banner-caption { padding: 11px 8px 12px; }
	html.route-common-home .module-banners-341 .banner-caption span,
	html.route-common-home .module-banners-341 .banner-caption span::after { font-size: 15px; }
	html.route-common-home .module-products-364 .tab-container > .nav-tabs { gap: 4px 20px; margin-bottom: 20px; }
	html.route-common-home div.module-products-364 .module-body .nav-tabs > li > a:not(.item-all-link) { font-size: 16px; }
	/* hero: Master Slider scales the layers to 50% on the phone canvas (750 wide); keep the gutter, 12 px minimum
	   and a 44 px touch target */
	html.route-common-home .module-master_slider-275 .ms-layer.ms-layer-text,
	html.route-common-home .module-master_slider-275 .ms-btn-container { left: 16px !important; }
	html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-1 {
		font-size: 12px !important;
		line-height: 16px !important;
		letter-spacing: .1em;
		transform: translateY(-8px);
	}
	html.route-common-home .module-master_slider-275 .ms-layer.module-subitem-3.btn {
		min-height: 44px;
		padding: 12px 20px !important;
		font-size: 14px !important;
		line-height: 20px !important;
	}
	html.route-common-home .module-master_slider-275 .ms-slide-bgcont::after {
		background: linear-gradient(90deg, rgba(31, 38, 46, .82) 0%, rgba(31, 38, 46, .5) 60%, rgba(31, 38, 46, .2) 100%);
	}
	html.route-common-home .module-testimonials-180 .module-item { padding: 22px 18px 18px; }
}

@media (prefers-reduced-motion: reduce) {
	html.route-common-home .module-banners-341 .module-item > a,
	html.route-common-home .module-banners-341 .module-item > a img { transition: none; }
	html.route-common-home .module-banners-341 .module-item > a:hover,
	html.route-common-home .module-banners-341 .module-item > a:hover img { transform: none; }
}