/* Gertrudes homepage product and testimonial modules, including category tabs.
   Loaded by the relevant module controllers and scoped to gtr-* hooks so the
   stock category/search/product templates remain untouched. */

/* Palette consolidation (2026-08-21): one brand family site-wide instead of
   the earlier pink (#d9485f) competing with the header orange (#e85224).
   --gtr-accent #c73e12 is 5.1:1 on white — AA for the 13px bold CTA labels
   and 17px prices that use it; #e85224 (3.7:1) stays reserved for icons and
   large decorative accents only, matching header-mobile.css §1. */
.gtr-home-products,
.gtr-testimonials,
.gtr-categories {
	--gtr-accent: #c73e12;
	--gtr-accent-strong: #a53100;
	--gtr-accent-soft: #fdeee6;
	--gtr-ink: #2f2a26;
	--gtr-muted: #6f6862;
	--gtr-line: #eadfd8;
	--gtr-surface: #ffffff;
	--gtr-surface-soft: #faf7f3;
}

/* Product cards --------------------------------------------------------- */
.gtr-home-products .gtr-product-card {
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--gtr-line);
	border-radius: 16px;
	background: var(--gtr-surface);
	box-shadow: 0 5px 18px rgba(47, 42, 38, .07);
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}

.gtr-home-products .gtr-product-card:hover,
.gtr-home-products .gtr-product-card:focus-within {
	z-index: 5;
	transform: translateY(-4px);
	border-color: rgba(199, 62, 18, .42);
	box-shadow: 0 15px 32px rgba(47, 42, 38, .15);
}

.gtr-home-products .gtr-product-card__media {
	position: relative;
	overflow: hidden;
	border-radius: 15px 15px 0 0;
	background: var(--gtr-surface-soft);
}

.gtr-home-products .gtr-product-card__media > a {
	display: block;
}

.gtr-home-products .gtr-product-card__media > a img {
	width: 100%;
	transition: transform 420ms ease;
}

.gtr-home-products .gtr-product-card:hover .gtr-product-card__media > a img,
.gtr-home-products .gtr-product-card:focus-within .gtr-product-card__media > a img {
	transform: scale(1.025);
}

.gtr-home-products .gtr-product-card__media::before {
	background: linear-gradient(to top, rgba(28, 24, 22, .42), rgba(28, 24, 22, 0) 48%);
	opacity: 0;
}

.gtr-home-products .gtr-product-card:hover .gtr-product-card__media::before,
.gtr-home-products .gtr-product-card:focus-within .gtr-product-card__media::before {
	opacity: 1;
}

.gtr-home-products .gtr-product-card__badges {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 4;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	max-width: calc(100% - 76px);
}

/* Badges: small uppercase chips (FlowerCart scale) — they annotate the
   photo, they don't compete with it. #9b696c is the user-picked inspo
   mauve, applied to every badge (NEW, sale, etc.) with white text. */
.gtr-home-products .gtr-product-card__badges .pro-label {
	display: inline-flex !important;
	align-items: center;
	min-height: 22px;
	margin: 0;
	padding: 3px 8px;
	border-radius: 7px;
	background: #9b696c;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: .06em;
	text-transform: uppercase;
	box-shadow: 0 4px 12px rgba(47, 42, 38, .16);
}

.gtr-home-products .gtr-product-card__badges .pro-label.new {
	background: #9b696c;
	color: #fff;
}

.gtr-home-products .gtr-product-card__wishlist {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .76);
	border-radius: 13px;
	background: rgba(255, 255, 255, .94);
	color: var(--gtr-ink);
	box-shadow: 0 5px 16px rgba(47, 42, 38, .16);
	transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.gtr-home-products .gtr-product-card__wishlist::before {
	content: "\f387";
	font-family: "Ionicons";
	font-size: 24px;
	font-weight: 400;
	line-height: 1;
}

.gtr-home-products .gtr-product-card__wishlist span {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.gtr-home-products .gtr-product-card__wishlist:hover,
.gtr-home-products .gtr-product-card__wishlist:focus {
	transform: translateY(-1px);
	background: var(--gtr-accent);
	color: #fff;
}

.gtr-home-products .gtr-product-card__actions {
	top: auto;
	left: 14px;
	right: 14px;
	bottom: 14px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
	transform: translateY(12px);
	transition: opacity 220ms ease, transform 220ms ease;
}

.gtr-home-products .gtr-product-card:hover .gtr-product-card__actions,
.gtr-home-products .gtr-product-card:focus-within .gtr-product-card__actions {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.gtr-home-products .gtr-product-card__actions > .inner {
	display: flex;
	align-items: stretch;
	width: 100%;
	padding: 9px;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 14px;
	background: rgba(37, 31, 29, .78);
	box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
	-webkit-backdrop-filter: blur(9px);
	backdrop-filter: blur(9px);
}

.gtr-home-products .gtr-product-card__actions .gtr-product-card__action {
	position: relative;
	float: none;
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 0;
	width: auto;
	height: auto;
	min-height: 58px;
	margin: 0;
	padding: 6px 4px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	box-shadow: none;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	transform: none;
	opacity: 1;
	transition: background 180ms ease, color 180ms ease;
}

.gtr-home-products .gtr-product-card__actions .gtr-product-card__action + .gtr-product-card__action {
	margin-left: 4px;
}

.gtr-home-products .gtr-product-card__actions .gtr-product-card__action::before {
	display: block;
	margin-bottom: 4px;
	font-family: "Ionicons";
	font-size: 22px;
	font-weight: 400;
	line-height: 1;
}

.gtr-home-products .gtr-product-card__actions .button-compare::before {
	content: "\f4a8";
}

.gtr-home-products .gtr-product-card__actions .button-quickview::before {
	content: "\f4a4";
}

/* The base theme hides Quick View below 768px. Keep both redesigned actions
   available on narrow POINTER layouts (a shrunken desktop window) now that
   the modal is responsive; hover-less devices drop the whole overlay below. */
.gtr-home-products .gtr-product-card__actions .button-quickview.gtr-product-card__action {
	display: flex !important;
}

/* Touch devices have no hover: the first tap used to fire the synthetic
   hover state and paint Compare/Quick View over the photo, and the second
   tap hit whatever landed under the finger. On any hover-less device the
   overlay is gone entirely — tapping the card opens the product page, and
   the persistent Add to Cart pill carries the buy action. Desktop pointers
   keep the hover reveal. Hiding the parent outranks the child's
   display:flex !important above. */
@media (hover: none) {
	.gtr-home-products .gtr-product-card__actions,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .button-group.gtr-product-card__actions {
		display: none !important;
	}
}

.gtr-home-products .gtr-product-card__actions .gtr-product-card__action span {
	display: block;
	overflow: hidden;
	max-width: 100%;
	font-size: 12px;
	line-height: 1.2;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gtr-home-products .gtr-product-card__actions .gtr-product-card__action:hover,
.gtr-home-products .gtr-product-card__actions .gtr-product-card__action:focus {
	background: rgba(199, 62, 18, .9);
	color: #fff;
}

/* Caption hierarchy (2026-08-22): centred, compact — name and price read as
   one stacked unit (name, price directly beneath), and the CTA pins to the
   card's bottom edge, so uneven name lengths pool their slack between price
   and button instead of splitting title from price. */
.gtr-home-products .gtr-product-card__caption {
	padding: 14px 12px;
	text-align: center;
}

/* Balanced heights: every text block reserves its EXACT clamp box (title
   2 lines, description 2 lines, rating row 18px, price one nowrap line),
   so a card's height never depends on its content — 1-line names and
   2-line names bottom out identically even when the slider doesn't
   stretch slides. em-based so the phone type ladder scales it for free. */
.gtr-home-products .gtr-product-card__caption h4 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	min-height: 0;
	margin: 0 0 2px;
}

.gtr-home-products .gtr-product-card__caption h4 a {
	color: var(--gtr-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	text-transform: none;
}

.gtr-home-products .gtr-product-card__caption .box-price,
.gtr-home-products .gtr-product-card:hover .gtr-product-card__caption .box-price,
.gtr-home-products .gtr-product-card:focus-within .gtr-product-card__caption .box-price {
	min-height: 0;
	opacity: 1;
}

/* Hierarchy: the NAME is the bigger type (15px) and the price sits right
   under it at 14px, carried by weight and brand colour rather than size.
   They read as one stacked unit — no reserved boxes between them. */
.gtr-home-products .gtr-product-card__caption .price {
	margin: 0;
	color: var(--gtr-accent);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap; /* one line always — special + old price included */
}

/* Compare-at price: muted strikethrough beside the live price, sized in em
   so every breakpoint's price size carries it along. */
.gtr-home-products .gtr-product-card__caption .price .price-old {
	margin-left: 6px;
	color: var(--gtr-muted);
	font-size: .8em;
	font-weight: 400;
	text-decoration: line-through;
}

/* Grid-card vertical rhythm: the media box keeps its natural height, the
   caption stretches, and flex `order` regroups the children as
   name → price → rating → description → CTA. Scoped to the two grid
   contexts only (.grid-style = homepage modules, .product-grid = catalog
   grid view): the row cards' price lives in a bare <div> and the catalog
   list view keeps the stock side-by-side layout, so a broad order rule
   would scramble both. */
.gtr-home-products .product-thumb .grid-style {
	height: 100%;
}

.gtr-home-products .grid-style .product-item.gtr-product-card,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card {
	display: flex;
	flex-direction: column;
}

/* flex-direction MUST stay column: .product-description and the countdown
   are SIBLINGS of .inner in the module markup — a default row direction
   parks them beside the title/price stack and shreds the card. */
.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .manufacture-product,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .manufacture-product {
	order: 0;
	margin-bottom: 2px;
}

.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > h4,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > h4 {
	order: 1;
}

.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .box-price,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .box-price {
	order: 2;
}

/* Reading order per card: name (1) → price (2) → description (3) →
   rating (4) → CTA (5, pinned bottom). */
.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .product-description,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .product-description {
	order: 3;
}

.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .rating,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .rating {
	order: 4;
	margin: 6px 0 0;
}

.gtr-home-products .grid-style .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .box-cart,
.gtr-catalog .product-grid .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption > .inner > .box-cart {
	order: 5;
}

/* Description — ONE quiet line under the price, ellipsised. A two-line
   clamp meant a card with wrapping copy stood taller than its neighbour
   before the CTA row; at one line every grid card carries the same
   description footprint whatever the product says. The doubled guard
   selector outranks the stock .product-description rules on the homepage,
   where this sheet loads before stylesheet.css. */
.gtr-home-products .gtr-product-card .product-description,
.gtr-home-products .product-thumb .product-item.gtr-product-card .product-description {
	display: block;
	overflow: hidden;
	min-height: 0;
	margin: 5px 0 0;
	color: var(--gtr-muted);
	font-size: 12.5px;
	line-height: 1.45;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gtr-home-products .gtr-product-card__cart,
.gtr-home-products .grid-style .gtr-product-card:hover .gtr-product-card__cart,
.gtr-home-products .grid-style .gtr-product-card:focus-within .gtr-product-card__cart {
	position: static;
	display: block;
	margin-top: auto;
	padding-top: 10px;
	opacity: 1;
}

.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	padding: 9px 14px;
	border: 0;
	border-radius: 999px;
	background: var(--gtr-accent) !important;
	color: #fff !important;
	font-size: 14px;
	font-weight: 700 !important;
	line-height: 1.2;
	white-space: nowrap;
	text-transform: none;
	text-decoration: none;
	box-shadow: 0 7px 16px rgba(199, 62, 18, .25);
	transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart::before {
	content: "\f110";
	margin-right: 8px;
	font-family: "Ionicons";
	font-size: 18px;
	font-weight: 400;
	line-height: 1;
}

.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart:hover,
.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart:focus {
	transform: translateY(-1px);
	background: var(--gtr-accent-strong) !important;
	box-shadow: 0 9px 20px rgba(165, 49, 0, .3);
}

/* Product category tabs ------------------------------------------------ */
.gtr-home-products.tabs-product .tabs-style {
	margin: 0 0 28px;
	text-align: center;
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	border: 0;
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs > li {
	float: none;
	display: block;
	margin: 0;
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs > li > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 46px;
	margin: 0;
	padding: 11px 20px;
	border: 1px solid var(--gtr-line);
	border-radius: 999px;
	background: var(--gtr-surface);
	color: var(--gtr-ink);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: .04em;
	text-transform: uppercase;
	box-shadow: 0 4px 14px rgba(47, 42, 38, .07);
	transition: transform 180ms ease, color 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs > li > a > .image-thumb {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin: -5px 0;
	padding: 4px;
	border: 0;
	background: var(--gtr-accent-soft);
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs > li > a:hover,
.gtr-home-products.tabs-product .tabs-style .nav-tabs > li > a:focus {
	transform: translateY(-2px);
	border-color: rgba(199, 62, 18, .42);
	background: var(--gtr-accent-soft);
	color: var(--gtr-accent-strong);
	box-shadow: 0 8px 18px rgba(47, 42, 38, .11);
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs > li.active > a,
.gtr-home-products.tabs-product .tabs-style .nav-tabs > li.active > a:hover,
.gtr-home-products.tabs-product .tabs-style .nav-tabs > li.active > a:focus {
	border-color: var(--gtr-accent);
	background: var(--gtr-accent);
	color: #fff;
	box-shadow: 0 8px 20px rgba(199, 62, 18, .24);
}

.gtr-home-products.tabs-product .tabs-style .nav-tabs > li.active > a > .image-thumb {
	background: rgba(255, 255, 255, .2);
}

.gtr-home-products .gtr-product-card a:focus-visible,
.gtr-home-products .gtr-product-card button:focus-visible,
.gtr-testimonials button:focus-visible,
.gtr-categories a:focus-visible {
	outline: 3px solid rgba(199, 62, 18, .55);
	outline-offset: 3px;
}

/* Testimonials --------------------------------------------------------- */
.gtr-testimonials {
	position: relative;
	max-width: 1120px;
	margin: 0 auto;
	padding: 12px 20px 18px;
}

.gtr-testimonials .block-title .title {
	color: var(--gtr-ink);
}

.gtr-testimonials .block-title p {
	color: var(--gtr-muted);
}

.gtr-testimonials .gallery-thumbs {
	max-width: 330px;
	margin-bottom: 28px;
}

.gtr-testimonials .testimonial-images {
	display: flex;
	justify-content: center;
	transform: scale(.76);
	opacity: .68;
	transition: transform 240ms ease, opacity 240ms ease;
}

.gtr-testimonials .testimonial-images.active {
	transform: scale(1);
	opacity: 1;
}

.gtr-testimonials__portrait {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 76px;
	height: 76px;
	padding: 3px;
	border: 2px solid transparent;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 6px 18px rgba(47, 42, 38, .14);
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

.gtr-testimonials .testimonial-images.active .gtr-testimonials__portrait {
	border-color: var(--gtr-accent);
	box-shadow: 0 8px 22px rgba(199, 62, 18, .2);
}

.gtr-testimonials__portrait img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
}

.gtr-testimonials .testimonial-box {
	max-width: 920px;
	padding: 28px clamp(22px, 5vw, 58px) 32px;
	border: 1px solid var(--gtr-line);
	border-radius: 18px;
	background: rgba(255, 255, 255, .76);
	box-shadow: 0 8px 28px rgba(47, 42, 38, .06);
}

.gtr-testimonials .testimonial-box p {
	margin: 0;
	color: var(--gtr-ink);
	font-size: clamp(16px, 2vw, 19px);
	line-height: 1.65;
}

.gtr-testimonials .rating {
	margin-top: 20px;
}

.gtr-testimonials .testimonial-author {
	margin-top: 16px;
	color: var(--gtr-ink);
}

.gtr-testimonials .swiper-pager > div {
	border-color: var(--gtr-line);
	background: #fff;
	box-shadow: 0 5px 15px rgba(47, 42, 38, .09);
}

.gtr-testimonials .swiper-pagination-bullet-active {
	background: var(--gtr-accent);
}

/* Category cards ------------------------------------------------------- */
.gtr-categories .swiper-viewport {
	padding: 4px 4px 16px;
}

.gtr-categories .gtr-category-card {
	position: relative;
	height: 100%;
	min-height: 300px;
	overflow: hidden;
	border: 1px solid var(--gtr-line);
	border-radius: 18px;
	background: var(--gtr-ink);
	box-shadow: 0 7px 22px rgba(47, 42, 38, .1);
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}

.gtr-categories .gtr-category-card:hover,
.gtr-categories .gtr-category-card:focus-within {
	transform: translateY(-4px);
	border-color: rgba(199, 62, 18, .45);
	box-shadow: 0 16px 32px rgba(47, 42, 38, .17);
}

.gtr-categories .gtr-category-card__image,
.gtr-categories .gtr-category-card__image a {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 300px;
	border: 0;
	border-radius: 0;
}

.gtr-categories .gtr-category-card__image::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(to top, rgba(35, 27, 25, .86) 3%, rgba(35, 27, 25, .26) 58%, rgba(35, 27, 25, .03));
}

.gtr-categories .gtr-category-card__image img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 300px;
	object-fit: cover;
	transition: transform 420ms ease;
}

.gtr-categories .gtr-category-card:hover .gtr-category-card__image img,
.gtr-categories .gtr-category-card:focus-within .gtr-category-card__image img {
	transform: scale(1.045);
}

.gtr-categories .gtr-category-card__caption {
	position: absolute;
	right: 20px;
	bottom: 20px;
	left: 20px;
	z-index: 3;
	padding: 0;
	color: #fff;
	text-align: left;
	transition: transform 240ms ease;
}

.gtr-categories .gtr-category-card:hover .gtr-category-card__caption,
.gtr-categories .gtr-category-card:focus-within .gtr-category-card__caption {
	transform: translateY(-2px);
}

.gtr-categories .gtr-category-card__caption h4 {
	margin: 0 0 5px;
}

.gtr-categories .gtr-category-card__caption h4 a {
	color: #fff;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: .01em;
	text-transform: none;
}

.gtr-categories .gtr-category-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.gtr-categories .gtr-category-card__caption .total-items {
	margin: 0 0 12px;
	color: rgba(255, 255, 255, .82);
	font-size: 13px;
	line-height: 1.3;
	text-transform: none;
}

.gtr-categories .gtr-category-card__caption .category-description,
.gtr-categories .gtr-category-card__caption .child-featured-categories {
	position: relative;
	z-index: 3;
	color: rgba(255, 255, 255, .84);
}

.gtr-categories .gtr-category-card__caption .child-featured-categories a {
	position: relative;
	z-index: 4;
	color: #fff;
}

.gtr-categories .gtr-category-card__cta {
	position: relative;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 8px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .94);
	color: var(--gtr-accent-strong);
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	transition: background 180ms ease, color 180ms ease;
}

.gtr-categories .gtr-category-card__cta::after {
	content: "\f3d6";
	margin-left: 7px;
	font-family: "Ionicons";
	font-size: 16px;
	line-height: 1;
}

.gtr-categories .gtr-category-card__cta:hover,
.gtr-categories .gtr-category-card__cta:focus {
	background: var(--gtr-accent);
	color: #fff;
	text-decoration: none;
}

.gtr-categories .gtr-category-card--text {
	background: linear-gradient(145deg, var(--gtr-surface-soft), #f4e7e3);
}

.gtr-categories .gtr-category-card--text .gtr-category-card__caption {
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
	color: var(--gtr-ink);
}

.gtr-categories .gtr-category-card--text:hover .gtr-category-card__caption,
.gtr-categories .gtr-category-card--text:focus-within .gtr-category-card__caption {
	transform: translateY(calc(-50% - 2px));
}

.gtr-categories .gtr-category-card--text .gtr-category-card__caption h4 a {
	color: var(--gtr-ink);
}

.gtr-categories .gtr-category-card--text .gtr-category-card__caption .total-items,
.gtr-categories .gtr-category-card--text .gtr-category-card__caption .category-description {
	color: var(--gtr-muted);
}

/* The module stylesheet is emitted before the stock theme stylesheet. These
   narrow guards intentionally outrank its legacy product-card selectors. */
.gtr-home-products .product-thumb .product-item.gtr-product-card {
	overflow: hidden;
	border: 1px solid var(--gtr-line);
	border-radius: 16px;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card:hover,
.gtr-home-products .product-thumb .product-item.gtr-product-card:focus-within {
	border-color: rgba(199, 62, 18, .42);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .image.gtr-product-card__media {
	border-radius: 15px 15px 0 0;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .image.gtr-product-card__media::before {
	background: linear-gradient(to top, rgba(28, 24, 22, .42), rgba(28, 24, 22, 0) 48%);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .button-group.gtr-product-card__actions {
	top: auto;
	left: 14px;
	right: 14px;
	bottom: 14px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
	transform: translateY(12px);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .button-group.gtr-product-card__actions > .inner {
	display: flex;
	align-items: stretch;
	width: 100%;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card:hover .button-group.gtr-product-card__actions,
.gtr-home-products .product-thumb .product-item.gtr-product-card:focus-within .button-group.gtr-product-card__actions {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption {
	padding: 14px 12px;
	text-align: center;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption h4 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	min-height: 0;
	margin: 0 0 2px;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption h4 a {
	color: var(--gtr-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	text-transform: none;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-price,
.gtr-home-products .product-thumb .product-item.gtr-product-card:hover .caption.gtr-product-card__caption .box-price,
.gtr-home-products .product-thumb .product-item.gtr-product-card:focus-within .caption.gtr-product-card__caption .box-price {
	min-height: 0;
	opacity: 1;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart,
.gtr-home-products .product-thumb .product-item.gtr-product-card:hover .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart,
.gtr-home-products .product-thumb .product-item.gtr-product-card:focus-within .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart {
	position: static;
	display: block;
	margin-top: auto;
	padding-top: 10px;
	opacity: 1;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart .button-cart {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	padding: 9px 14px;
	border: 0;
	border-radius: 999px;
	background: var(--gtr-accent) !important;
	color: #fff !important;
	font-size: 14px;
	font-weight: 700 !important;
	line-height: 1.2;
	white-space: nowrap;
	text-transform: none;
}

/* Row cards (list layout — Most Viewed Products et al.) ------------------
   These share the gtr-product-card chrome but lay out media | caption side
   by side. Selectors deliberately repeat .product-thumb/.product-item to
   outrank the stock list-style float rules (this sheet loads first). */
.gtr-home-products .product-thumb .list-style {
	height: 100%;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row {
	display: flex;
	align-items: stretch;
	gap: 16px;
	height: 100%;
	padding: 14px;
	overflow: hidden;
	border: 1px solid var(--gtr-line);
	border-radius: 16px;
	background: var(--gtr-surface);
	box-shadow: 0 5px 18px rgba(47, 42, 38, .07);
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row:hover,
.gtr-home-products .product-thumb .product-item.gtr-product-card--row:focus-within {
	z-index: 5;
	transform: translateY(-3px);
	border-color: rgba(199, 62, 18, .42);
	box-shadow: 0 14px 28px rgba(47, 42, 38, .14);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .image.gtr-product-card__media {
	float: none;
	flex: 0 0 40%;
	width: 40%;
	align-self: center;
	overflow: hidden;
	border-radius: 12px;
	background: var(--gtr-surface-soft);
}

/* Stock hover paints a white wash over the photo; the row card zooms instead. */
.gtr-home-products .product-thumb .product-item.gtr-product-card--row .image.gtr-product-card__media::before {
	content: none;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .image.gtr-product-card__media img {
	width: 100%;
	transition: transform 420ms ease;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row:hover .image.gtr-product-card__media img,
.gtr-home-products .product-thumb .product-item.gtr-product-card--row:focus-within .image.gtr-product-card__media img {
	transform: scale(1.04);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption {
	float: none;
	display: flex;
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	padding: 6px 2px 2px 0;
	text-align: left;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption > .inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption h4 {
	min-height: 0;
	margin: 0 0 6px;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption h4 a:hover,
.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption h4 a:focus {
	color: var(--gtr-accent-strong);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption .price {
	margin: 0;
	color: var(--gtr-accent);
	font-size: 17px;
	font-weight: 700;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	width: 100%;
	margin-top: auto;
	padding-top: 14px;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .button-cart {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 auto;
	min-height: 40px;
	margin: 0;
	padding: 8px 14px;
	border: 0;
	border-radius: 999px;
	background: var(--gtr-accent) !important;
	color: #fff !important;
	font-size: 13px;
	font-weight: 700 !important;
	line-height: 1.2;
	text-transform: none;
	box-shadow: 0 6px 14px rgba(199, 62, 18, .22);
	transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .button-cart::before {
	content: "\f110";
	margin-right: 7px;
	font-family: "Ionicons";
	font-size: 17px;
	font-weight: 400;
	line-height: 1;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .button-cart:hover,
.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .button-cart:focus {
	transform: translateY(-1px);
	background: var(--gtr-accent-strong) !important;
	box-shadow: 0 8px 16px rgba(165, 49, 0, .28);
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .gtr-product-card__view {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px 14px;
	border: 1px solid var(--gtr-line);
	border-radius: 999px;
	background: var(--gtr-surface);
	color: var(--gtr-ink);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .gtr-product-card__view::after {
	content: "\f3d6";
	margin-left: 7px;
	font-family: "Ionicons";
	font-size: 15px;
	line-height: 1;
}

.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .gtr-product-card__view:hover,
.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .gtr-product-card__view:focus {
	border-color: rgba(199, 62, 18, .42);
	background: var(--gtr-accent-soft);
	color: var(--gtr-accent-strong);
	text-decoration: none;
}

@media (max-width: 767px) {
	.gtr-home-products.tabs-product .tabs-style {
		overflow-x: auto;
		margin-right: -15px;
		margin-left: -15px;
		padding: 2px 15px 10px;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.gtr-home-products.tabs-product .tabs-style::-webkit-scrollbar {
		display: none;
	}

	.gtr-home-products.tabs-product .tabs-style .nav-tabs {
		flex-wrap: nowrap;
		justify-content: flex-start;
		width: max-content;
		min-width: 100%;
	}

	.gtr-home-products.tabs-product .tabs-style .nav-tabs > li > a {
		min-height: 42px;
		padding: 10px 16px;
		font-size: 12px;
	}

	.gtr-home-products .gtr-product-card {
		transform: none;
	}

	/* Compare/Quick View stay hidden until hover or focus on phones too —
	   the always-visible bar covered the product photo. Tap targets remain:
	   the persistent Add to Cart pill and the card links. */
	.gtr-home-products .product-thumb .product-item.gtr-product-card .button-group.gtr-product-card__actions {
		left: 10px;
		right: 10px;
		bottom: 10px;
	}

	.gtr-home-products .gtr-product-card__actions > .inner {
		padding: 7px;
	}

	.gtr-home-products .gtr-product-card__actions .gtr-product-card__action {
		min-height: 50px;
	}

	/* Phone card scale, step 1 of the ladder (≤767 → ≤479 → ≤359). Two-up
	   cards: type steps down so the card keeps a balanced portrait — photo
	   first, compact caption, one-line pill. Doubled selectors are required
	   wherever a guard-specificity base rule exists (h4/description/button/
	   padding): a short selector alone loses to the (0,6,0)+ guards at
	   every width, media queries add no specificity. */
	.gtr-home-products .gtr-product-card__caption,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption {
		padding: 12px 10px;
	}

	.gtr-home-products .gtr-product-card__caption h4 a,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption h4 a {
		font-size: 14px;
	}

	.gtr-home-products .gtr-product-card__caption .price {
		font-size: 13px;
	}

	.gtr-home-products .gtr-product-card .product-description,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .product-description {
		font-size: 12px;
	}

	.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart .button-cart {
		min-height: 40px;
		padding: 8px 12px;
		font-size: 13px;
	}

	.gtr-home-products .gtr-product-card__wishlist {
		top: 8px;
		right: 8px;
		width: 38px;
		height: 38px;
	}

	.gtr-home-products .gtr-product-card__wishlist::before {
		font-size: 20px;
	}

	.gtr-home-products .gtr-product-card__badges {
		top: 8px;
		left: 8px;
	}

	.gtr-testimonials {
		padding-right: 14px;
		padding-left: 14px;
	}

	.gtr-testimonials .testimonial-box {
		padding: 22px 18px 26px;
	}

	.gtr-categories .gtr-category-card,
	.gtr-categories .gtr-category-card__image,
	.gtr-categories .gtr-category-card__image a,
	.gtr-categories .gtr-category-card__image img {
		min-height: 270px;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row {
		gap: 12px;
		padding: 10px;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row:hover,
	.gtr-home-products .product-thumb .product-item.gtr-product-card--row:focus-within {
		transform: none;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption {
		padding: 4px 0 2px;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption h4 a {
		font-size: 13px;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row .caption.gtr-product-card__caption .price {
		font-size: 15px;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas {
		gap: 6px;
		padding-top: 10px;
	}

	.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .button-cart,
	.gtr-home-products .product-thumb .product-item.gtr-product-card--row .gtr-product-card__ctas .gtr-product-card__view {
		min-height: 38px;
		padding: 7px 12px;
		font-size: 12px;
	}
}

/* Ladder step 2 — Mobile M/L (375-425px viewports, two-up ≈150-190px
   cards). The bag icon goes; every run of text must fit one line. */
@media (max-width: 479px) {
	.gtr-home-products .gtr-product-card__actions .gtr-product-card__action span {
		font-size: 11px;
	}

	.gtr-home-products .gtr-product-card__caption,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption {
		padding: 10px 8px;
	}

	.gtr-home-products .gtr-product-card__caption h4 a,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption h4 a {
		font-size: 13px;
	}

	.gtr-home-products .gtr-product-card__caption .price {
		font-size: 12px;
	}

	.gtr-home-products .gtr-product-card .product-description,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .product-description {
		margin-top: 4px;
		font-size: 11px;
	}

	.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart .button-cart {
		min-height: 38px;
		padding: 7px 8px;
		font-size: 12px;
		white-space: nowrap;
	}

	/* display:none, not just content:none — Blink drops content:none as
	   invalid on pseudo-elements in some versions, which left the bag
	   glyph painting (verified against the served page). */
	.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart::before,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart .button-cart::before {
		content: none;
		display: none;
	}

	.gtr-home-products .gtr-product-card__wishlist {
		width: 34px;
		height: 34px;
		border-radius: 10px;
	}

	.gtr-home-products .gtr-product-card__wishlist::before {
		font-size: 18px;
	}

	.gtr-testimonials__portrait {
		width: 66px;
		height: 66px;
	}
}

/* Ladder step 3 — Mobile S (320px viewports, two-up ≈130px cards). */
@media (max-width: 359px) {
	.gtr-home-products .gtr-product-card__caption,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption {
		padding: 9px 7px;
	}

	.gtr-home-products .gtr-product-card__caption h4 a,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption h4 a {
		font-size: 12.5px;
	}

	.gtr-home-products .gtr-product-card__caption .price {
		font-size: 11.5px;
	}

	.gtr-home-products .gtr-product-card .product-description,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .product-description {
		font-size: 10.5px;
	}

	.gtr-home-products .gtr-product-card__caption .gtr-product-card__cart .button-cart,
	.gtr-home-products .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption .box-cart.gtr-product-card__cart .button-cart {
		min-height: 36px;
		padding: 6px 6px;
		font-size: 11.5px;
	}

	.gtr-home-products .gtr-product-card__wishlist {
		width: 32px;
		height: 32px;
	}

	.gtr-home-products .gtr-product-card__wishlist::before {
		font-size: 17px;
	}

	.gtr-home-products .gtr-product-card__badges .pro-label {
		min-height: 20px;
		padding: 2px 7px;
		font-size: 9px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.gtr-home-products *,
	.gtr-testimonials *,
	.gtr-categories * {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* The star row is RESERVED, not collapsed. 2026-08-23, reversing the
   2026-08-22 decision to `display:none` it.
   -------------------------------------------------------------------------
   That earlier call assumed card heights level through the flex chain (card =
   column, caption stretches, CTA pinned with margin-top:auto). They do not,
   in the one place it matters most: inside the carousels. The chain is
   .swiper-slide → .list-style{height:100%} → .product-item{height:100%}, and
   Swiper 3's own CSS gives the slide `height:100%` against a wrapper whose
   height is auto — so every `height:100%` in the chain resolves to auto and
   each card is exactly as tall as its own content. With slidesPerColumn the
   wrapper is a WRAPPING flex container, so nothing re-levels the line either.
   Net effect on Most Viewed Products: the one product that has reviews stood
   ~28px taller than its neighbours, and its price and both CTAs sat a row
   lower than everyone else's.
   Reserving the row fixes it at the source — every card carries the same
   star-row footprint whether or not it has reviews, so cards, prices and CTAs
   all line up without depending on how the carousel sizes its slides. The
   placeholder keeps the `.rating` class, so it inherits that row's margins
   (10px below on row cards, 6px above on grid cards) automatically; only the
   height has to be restated, and 18px is `.rating .icon-ratings`'s own height
   from stylesheet.css. */
.gtr-home-products .rating--placeholder {
	height: 18px;
}

/* Mid-page promo banner (ptstaticblock "static-middle-store2") -----------
   The block's DB markup ships a bare 1304px <img> with no class, and stock
   CSS leaves .image inline-block — it shrink-wraps to the image, so on
   screens wider than ~1330px the banner floats smaller than its full-width
   row. Make it a block capped at the site's 1440px container rhythm and
   centred: below that it fills edge to edge like every other section, above
   it it stays aligned with them (8% upscale of the 1304px source is not
   visible on this soft photo). Stock min-height 300px + object-fit keep the
   small-screen crop (stylesheet.css:79). */
.pt-block.static-middle-store2 {
	/* The full-width row has no gutter of its own; keep the standard 15px so
	   the rounded corners never touch the viewport edge. */
	padding-left: 15px;
	padding-right: 15px;
}

.pt-block.static-middle-store2 .image {
	display: block;
	max-width: 1440px;
	margin: 0 auto;
	overflow: hidden;
	border-radius: 16px;
}

.pt-block.static-middle-store2 .image a {
	display: block;
}

.pt-block.static-middle-store2 .image img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

/* Catalog listing pages (.gtr-catalog) -----------------------------------
   product/category.twig (and the filter module's AJAX fragment) reuse the
   gtr-product-card classes above; .gtr-home-products on .custom-category is
   the scope hook. Unlike the homepage, these pages load this sheet AFTER
   stylesheet.css (body <link> in the template), so equal-specificity rules
   here win by order. This section carries only what listing pages add:
   column rhythm, list-view fit, the description line, and the toolbar. */

.gtr-catalog .product-items {
	margin-bottom: 30px;
}

/* List view: stock stylesheet.css:1043-1046 already lays image (31%) beside
   caption (69%); give the card its inner breathing room and let the media
   box fill its column (stock leaves .image > .inner shrink-wrapped). */
.gtr-catalog .product-list .product-thumb .product-item.gtr-product-card {
	padding: 14px;
	align-items: center;
}

.gtr-catalog .product-list .product-thumb .product-item.gtr-product-card .image > .inner {
	display: block;
}

/* Grid cards clamp the description to one ellipsised line (see the card
   rules above). The list view is a wide row with room to spare, so it
   opts back into multi-line — which means undoing `white-space: nowrap`
   as well as re-declaring the box, or the clamp has nothing to clamp. */
.gtr-catalog .product-list .gtr-product-card .product-description {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	white-space: normal;
}

/* Toolbar: the grey #f6f6f6 strip becomes a quiet card that matches the
   product chrome. */
.gtr-catalog .tool-bar {
	margin-bottom: 26px;
	padding: 12px 16px 2px;
	border: 1px solid var(--gtr-line);
	border-radius: 14px;
	background: var(--gtr-surface);
}

/* View buttons keep their stock icon sprites (stylesheet.css:996-1007 sets
   them via the background SHORTHAND) — only tint the color slot with the
   longhand, never `background:`, or the icons vanish. */
.gtr-catalog .tool-bar .btn-custom-view.active,
.gtr-catalog .tool-bar .btn-custom-view:hover,
.gtr-catalog .tool-bar .btn-custom-view:focus,
.gtr-catalog .tool-bar #grid-view.active,
.gtr-catalog .tool-bar #list-view.active {
	background-color: var(--gtr-accent-soft);
}

.gtr-catalog .tool-bar .form-control {
	border-radius: 8px;
	border-color: var(--gtr-line);
}

.gtr-catalog .tool-bar .input-group-addon {
	border-color: var(--gtr-line);
	border-radius: 8px 0 0 8px;
	background: var(--gtr-surface-soft);
	color: var(--gtr-muted);
}

.gtr-catalog .tool-bar #compare-total {
	color: var(--gtr-ink);
}

.gtr-catalog .tool-bar #compare-total:hover {
	color: var(--gtr-accent-strong);
}

/* Pagination pills to match. */
.gtr-catalog .pagination > li > a,
.gtr-catalog .pagination > li > span {
	margin: 0 3px;
	border: 1px solid var(--gtr-line);
	border-radius: 9px;
	color: var(--gtr-ink);
}

.gtr-catalog .pagination > li.active > span,
.gtr-catalog .pagination > li > a:hover,
.gtr-catalog .pagination > li > a:focus {
	border-color: rgba(199, 62, 18, .35);
	background: var(--gtr-accent-soft);
	color: var(--gtr-accent-strong);
}

/* Equal card heights in grid mode: the products .row (direct child of
   .custom-category, both in the initial render and the filter fragment)
   becomes a flex wrap so Bootstrap's float columns stretch; the card turns
   into a column and the Add to Cart pill pins to its bottom, so varying
   name/description lengths cannot unbalance the row. List mode keeps its
   own stock flex row (stylesheet.css:1043). */
.gtr-catalog > .row {
	display: flex;
	flex-wrap: wrap;
}

.gtr-catalog .product-items .product-thumb {
	height: 100%;
}

.gtr-catalog .product-grid .gtr-product-card {
	display: flex;
	flex-direction: column;
}

.gtr-catalog .product-grid .gtr-product-card .caption.gtr-product-card__caption {
	display: flex;
	flex: 1 1 auto;
}

.gtr-catalog .product-grid .gtr-product-card .caption.gtr-product-card__caption > .inner {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.gtr-catalog .product-grid .gtr-product-card .box-cart.gtr-product-card__cart {
	margin-top: auto;
	padding-top: 10px;
}

/* List view keeps its side-by-side reading direction: the centred caption
   above is a grid-card treatment only. (0,7,0) with .product-list outranks
   the (0,6,0) centring guard regardless of order. */
.gtr-catalog .product-list .product-thumb .product-item.gtr-product-card .caption.gtr-product-card__caption {
	text-align: left;
}

/* Breadcrumbs are NOT styled here. common.js:45-71 MOVES the first
   `ul.breadcrumb` (and `#content > h1`) out of the page container into a
   `.gtr-pagehead` section after #header, so `#product-category .breadcrumb`
   and friends match nothing at runtime — verified 0 matches in a browser
   QA pass, 2026-08-22. The relocated trail is owned by plaza/gtr-pagehead.css. */