/* Let homepage product scrollers use the full mobile viewport. */
@media (max-width:768px) {
	.homepage-product-sections .horizontal-product-list .scroll,
	.homepage-last-seen .horizontal-product-list .scroll {
		width:calc(100% + (var(--side-padding) * 2));
		margin-right:calc(var(--side-padding) * -1);
		margin-left:calc(var(--side-padding) * -1);
	}

	.homepage-product-sections .horizontal-product-list .product-list,
	.homepage-last-seen .horizontal-product-list .product-list {
		max-width:100%;
		padding-right:var(--side-padding);
		padding-left:var(--side-padding);
		scroll-padding-inline:var(--side-padding);
		-webkit-mask-image:none;
		mask-image:none;
	}

	.homepage-featured-products .products-carousel .track {
		padding-right:var(--side-padding);
		padding-left:var(--side-padding);
		scroll-padding-left:var(--side-padding);
	}
}

/* Homepage blog: whole images. Phones stack the text below; wider screens put it beside the image. */
.fit-blog-home { margin-block:10px 40px; }
.fit-blog-home .fbj-header { display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:16px; }
.fit-blog-home .fbj-all { flex:none; color:var(--horizontal-products-a-color); font-weight:bold; }
.fit-blog-home .fbj-grid { display:grid; gap:30px; }
.fit-blog-home .fbj-card { display:block; min-width:0; }
.fit-blog-home .fbj-card:focus-visible { outline:3px solid var(--hl-color); outline-offset:2px; }
.fit-blog-home .fbj-media { display:block; overflow:hidden; margin-bottom:16px; border-radius:10px; }
.fit-blog-home .fbj-image { display:block; width:100%; height:auto; }
.fit-blog-home .fbj-title { font:400 20px/1.2 Georgia, serif; letter-spacing:-.3px; }
.fit-blog-home .fbj-excerpt { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; margin-top:12px; color:var(--dim-6-color); line-height:1.55; }

/* Tablet: one column of rows, image beside the text. */
@media (min-width:641px) {
	.fit-blog-home .fbj-card { display:flex; align-items:flex-start; gap:24px; }
	.fit-blog-home .fbj-media { flex:none; width:30%; margin-bottom:0; }
	.fit-blog-home .fbj-body { flex:1; min-width:0; }
	.fit-blog-home .fbj-excerpt { -webkit-line-clamp:4; }
}

/* Desktop: big story left with its text below, two small right with text beside. */
@media (min-width:1025px) {
	.fit-blog-home .fbj-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); grid-template-rows:auto 1fr; gap:0 40px; align-items:start; }
	.fit-blog-home .fbj-card:first-child { grid-row:span 2; }
	.fit-blog-home .fbj-media { width:50%; }
	.fit-blog-home .fbj-card:first-child { display:block; }
	.fit-blog-home .fbj-card:first-child .fbj-media { width:100%; margin-bottom:20px; }
	/* Divider with equal space above and below it. */
	.fit-blog-home .fbj-card:nth-child(2):not(:last-child) { padding-bottom:30px; }
	.fit-blog-home .fbj-card:nth-child(3) { padding-top:30px; border-top:1px solid var(--basic-box-border-color); }
	.fit-blog-home .fbj-title { font-size:22px; }
	.fit-blog-home .fbj-card:first-child .fbj-title { font-size:29px; line-height:1.15; letter-spacing:-.5px; }
	.fit-blog-home .fbj-card:first-child .fbj-excerpt { font-size:15px; }
}

/* Hover effects only on desktop with a mouse. */
@media (hover:hover) and (min-width:1025px) {
	.fit-blog-home .fbj-image { transition:transform 0.3s ease; }
	.fit-blog-home .fbj-card:hover .fbj-image { transform:scale(1.03); }
	.fit-blog-home .fbj-card:hover .fbj-title, .fit-blog-home .fbj-all:hover { text-decoration:underline; text-underline-offset:5px; }
}
