/*
 * Comfort Image Layout v1.0.4
 *
 * Scope: only the Home visual collage, About team image, existing product
 * category heroes/galleries, Products directory grid, and single-product
 * primary image. No global img rule is used.
 */

/* Home: retain the asymmetrical editorial collage, with a controlled desktop canvas. */
body.comfort-image-layout-v102.page-id-99 #primary .elementor-element-affcd3c > .e-con-inner {
	max-width: 1280px;
	margin-inline: auto;
}

/* Home first product slide, desktop only: continue its existing neutral
 * display surface through the right edge without resizing, stretching or
 * repositioning the product art. Tablet/mobile retain their purple text panel. */
@media (min-width: 1025px) {
	body.comfort-image-layout-v102.home #depicter-1-section-122 #depicter-1-element-123 {
		background-color: transparent !important;
	}
}

/* About: preserve the complete team photograph as a true viewport-wide image. */
body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-41fd7e8 {
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-41fd7e8 :is(
	.elementor-widget-container,
	.aux-widget-image,
	.aux-media-hint-frame,
	.aux-media-image
) {
	display: block;
	width: 100%;
	max-width: none;
}

body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-41fd7e8 img {
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
	object-fit: contain;
}

/* About: keep the two-column introduction below the absolute overlay header.
 * Mobile already has safe clearance and retains its existing spacing. */
@media (min-width: 701px) and (max-width: 1024px) {
	body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-58c7591 {
		margin-top: 160px !important;
	}
}

@media (min-width: 1025px) and (max-width: 1440px) {
	body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-58c7591 {
		margin-top: 210px !important;
	}
}

@media (min-width: 1441px) {
	body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-58c7591 {
		margin-top: 220px !important;
	}
}

body.comfort-image-layout-v102.page-id-94 #primary .elementor-element-d3aa73a {
	margin-top: clamp(40px, 4vw, 56px) !important;
}

/* Products directory: cap the generated WooCommerce grid without changing its content. */
body.comfort-image-layout-v102.page-id-1095 #primary .uc_post_grid_style_one {
	width: min(100%, 1200px);
	max-width: 1200px;
	margin-inline: auto;
}

/* Existing product-category galleries: keep three readable poster cards on desktop. */
body.comfort-image-layout-v102:is(
	.page-id-461,
	.page-id-536,
	.page-id-579,
	.page-id-611,
	.page-id-637,
	.page-id-676,
	.page-id-695,
	.page-id-719,
	.page-id-730,
	.page-id-750
) #primary .pg-turbo-grid {
	width: min(calc(100% - 40px), 1260px);
	max-width: 1260px;
	margin-inline: auto;
}

/* Product-category hero media: reduce dominance without cropping or stretching. */
body.comfort-image-layout-v102:is(
	.page-id-461,
	.page-id-536,
	.page-id-579,
	.page-id-611,
	.page-id-637,
	.page-id-676,
	.page-id-695,
	.page-id-719,
	.page-id-730,
	.page-id-750
) #primary .depicter .depicter-image-layer {
	scale: 0.86;
	transform-origin: center center;
}

/* Single products: retain the original square asset while reducing its visual weight. */
body.comfort-image-layout-v102.single-product #primary .woocommerce-product-gallery__image img.wp-post-image {
	display: block;
	width: min(100%, 520px) !important;
	max-width: 520px !important;
	height: auto;
	margin-inline: auto;
	object-fit: contain;
}

@media (max-width: 1199px) and (min-width: 901px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-637,
		.page-id-676,
		.page-id-695,
		.page-id-719,
		.page-id-730,
		.page-id-750
	) #primary .pg-turbo-grid {
		max-width: 900px;
	}
}

@media (max-width: 1024px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-637,
		.page-id-676,
		.page-id-695,
		.page-id-719,
		.page-id-730,
		.page-id-750
	) #primary .depicter .depicter-image-layer {
		scale: 0.88;
	}
}

@media (max-width: 900px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-637,
		.page-id-676,
		.page-id-695,
		.page-id-719,
		.page-id-730,
		.page-id-750
	) #primary .pg-turbo-grid {
		width: min(calc(100% - 20px), 100%);
	}

	body.comfort-image-layout-v102.single-product #primary .woocommerce-product-gallery__image img.wp-post-image {
		width: 100% !important;
		max-width: 100% !important;
	}
}

@media (max-width: 700px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-637,
		.page-id-676,
		.page-id-695,
		.page-id-719,
		.page-id-730,
		.page-id-750
	) #primary .depicter .depicter-image-layer {
		scale: 0.9;
	}
}

/* Product-category tablet repair.
 * Five legacy Depicter documents give their two body-copy layers the same
 * tablet coordinates. Keep the existing content and visual treatment, but
 * make the second paragraph follow the first instead of painting over it.
 * The selectors are limited to the affected page IDs and tablet breakpoint. */
@media (min-width: 768px) and (max-width: 1024px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-695
	) #primary .depicter :is(
		[id$="-element-171"],
		[id$="-element-177"]
	) {
		width: 420px !important;
	}

	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-695
	) #primary .depicter [id$="-element-177"] {
		transform: translateY(150px) !important;
	}

	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-695
	) #primary .depicter [id$="-element-173"] {
		transform: translateY(-25px) !important;
	}

	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-695
	) #primary .depicter [id$="-element-180"] {
		transform: translateX(-156px) !important;
	}

	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-695
	) #primary .depicter .depicter-layer-frame:has(
		> .depicter-animation-wrap > :is([id$="-element-171"], [id$="-element-177"], [id$="-element-180"])
	) > .depicter-animation-wrap {
		animation: none !important;
		transition: none !important;
		transform: none !important;
		opacity: 1 !important;
	}
}

/* Product-category value row: preserve the existing three-value design while
 * removing any stale Elementor min-height/animation state that can stretch
 * the row into a tall vertical sequence. All ten cloned category pages use
 * these exact section IDs. */
body.comfort-image-layout-v102:is(
	.page-id-461,
	.page-id-536,
	.page-id-579,
	.page-id-611,
	.page-id-637,
	.page-id-676,
	.page-id-695,
	.page-id-719,
	.page-id-730,
	.page-id-750
) #primary :is(
	.elementor-element-5a698f9,
	.elementor-element-5b3a2dd,
	.elementor-element-1645271,
	.elementor-element-a4f256e,
	.elementor-element-a4f256e > .elementor-element,
	.elementor-element-a4f256e .elementor-widget-container,
	.elementor-element-a4f256e .aux-widget-advanced-text,
	.elementor-element-a4f256e .aux-text-inner
) {
	min-height: 0 !important;
}

body.comfort-image-layout-v102:is(
	.page-id-461,
	.page-id-536,
	.page-id-579,
	.page-id-611,
	.page-id-637,
	.page-id-676,
	.page-id-695,
	.page-id-719,
	.page-id-730,
	.page-id-750
) #primary .elementor-element-a4f256e {
	grid-auto-rows: auto !important;
	align-items: stretch !important;
}

body.comfort-image-layout-v102:is(
	.page-id-461,
	.page-id-536,
	.page-id-579,
	.page-id-611,
	.page-id-637,
	.page-id-676,
	.page-id-695,
	.page-id-719,
	.page-id-730,
	.page-id-750
) #primary .elementor-element-a4f256e .elementor-invisible {
	visibility: visible !important;
}

@media (min-width: 768px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-637,
		.page-id-676,
		.page-id-695,
		.page-id-719,
		.page-id-730,
		.page-id-750
	) #primary .elementor-element-a4f256e {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 767px) {
	body.comfort-image-layout-v102:is(
		.page-id-461,
		.page-id-536,
		.page-id-579,
		.page-id-611,
		.page-id-637,
		.page-id-676,
		.page-id-695,
		.page-id-719,
		.page-id-730,
		.page-id-750
	) #primary .elementor-element-a4f256e {
		grid-template-columns: minmax(0, 1fr) !important;
		row-gap: 24px !important;
	}
}