.cg-single-product__body .related > h2,
.cg-single-product__body .upsells > h2 {
margin: 0 auto 32px;
max-width: 680px;
font-size: clamp(30px, 3vw, 44px);
line-height: 1.04;
letter-spacing: 0;
color: var(--cg-color-text);
text-align: center;
}
.cg-single-product__body .related ul.products,
.cg-single-product__body .upsells ul.products {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 360px));
gap: 24px;
justify-content: center;
margin: 0;
padding: 0;
list-style: none;
}
.cg-related-products__slider {
width: 100%;
max-width: 100%;
min-width: 0;
overflow: hidden;
margin-inline: -12px;
padding: 4px 0 6px;
}
.cg-single-product__body .related ul.products.cg-related-products__wrapper {
display: flex;
justify-content: flex-start;
gap: 0;
width: 100%;
min-width: 0;
margin: 0;
padding: 0;
}
.cg-single-product__body .related ul.products.cg-related-products__wrapper .swiper-slide {
display: flex;
height: auto;
min-width: 0;
width: auto;
box-sizing: border-box;
margin: 0 !important;
padding-inline: 12px;
}
.cg-single-product__body .related ul.products.cg-related-products__wrapper .cg-product-card {
max-width: 100%;
}
.cg-single-product__body .related ul.products.cg-related-products__wrapper .cg-product-card__inner {
width: 100%;
max-width: 100%;
}
.cg-related-products__pagination {
display: flex;
justify-content: center;
gap: 8px;
margin: 18px 0 0;
padding: 0;
}
.cg-related-products__pagination.swiper-pagination {
position: static;
}
.cg-related-products__pagination .swiper-pagination-bullet {
display: block;
width: 9px;
height: 9px;
margin: 0 !important;
background: rgba(154, 111, 93, 0.28);
opacity: 1;
cursor: pointer;
transition:
width 0.22s ease,
background 0.22s ease;
}
.cg-related-products__pagination .swiper-pagination-bullet-active {
width: 24px;
border-radius: 999px;
background: #1d1d1d;
}
.cg-single-product__body .related ul.products::before,
.cg-single-product__body .related ul.products::after,
.cg-single-product__body .upsells ul.products::before,
.cg-single-product__body .upsells ul.products::after {
content: none;
display: none;
}
.cg-single-product__body .related .cg-product-card,
.cg-single-product__body .upsells .cg-product-card {
margin: 0 !important;
max-width: 100%;
float: none !important;
list-style: none;
}
.cg-single-product__body .related .cg-product-card__inner,
.cg-single-product__body .upsells .cg-product-card__inner {
position: relative;
display: flex;
flex-direction: column;
height: 100%;
padding: 14px;
border: 1px solid rgba(183, 141, 121, 0.16);
border-radius: 28px;
background:
radial-gradient(260px 150px at 50% 0%, rgba(255, 255, 255, 0.9), transparent 70%),
linear-gradient(180deg, #fff, #fffaf7);
box-shadow: 0 18px 42px rgba(44, 29, 20, 0.07);
text-align: center;
overflow: hidden;
transition:
box-shadow 0.28s ease,
border-color 0.28s ease;
}
.cg-single-product__body .related .cg-product-card__image-link,
.cg-single-product__body .upsells .cg-product-card__image-link {
text-decoration: none;
}
.cg-single-product__body .related .cg-product-card__image-wrap,
.cg-single-product__body .upsells .cg-product-card__image-wrap {
position: relative;
display: flex;
align-items: center;
justify-content: center;
aspect-ratio: 1 / 1;
min-height: 0;
padding: 0;
margin-bottom: 18px;
border-radius: 24px;
background:
radial-gradient(260px 170px at 50% 8%, rgba(255, 255, 255, 0.92), transparent 68%),
linear-gradient(145deg, #f8f1eb, #ead9cf);
overflow: hidden;
}
.cg-single-product__body .related .cg-product-card__badge,
.cg-single-product__body .upsells .cg-product-card__badge {
position: absolute;
top: 12px;
left: 12px;
z-index: 2;
display: inline-flex;
align-items: center;
padding: 8px 12px;
border-radius: 999px;
border: 1px solid rgba(183, 141, 121, 0.16);
background: rgba(255, 255, 255, 0.94);
color: #7b5c4d;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.cg-single-product__body .related .cg-product-card__img,
.cg-single-product__body .upsells .cg-product-card__img {
display: block;
width: 100%;
height: 100%;
margin: 0;
object-fit: cover;
}
.cg-single-product__body .related .cg-product-card__content,
.cg-single-product__body .upsells .cg-product-card__content {
display: flex;
flex: 1;
flex-direction: column;
}
.cg-single-product__body .related .cg-product-card__title,
.cg-single-product__body .upsells .cg-product-card__title {
margin: 0 0 12px;
font-size: 20px;
line-height: 1.2;
letter-spacing: 0;
}
.cg-single-product__body .related .cg-product-card__title a,
.cg-single-product__body .upsells .cg-product-card__title a {
color: var(--cg-color-text);
text-decoration: none;
}
.cg-single-product__body .related .cg-product-card__title a:hover,
.cg-single-product__body .upsells .cg-product-card__title a:hover {
opacity: 0.82;
}
.cg-single-product__body .related .cg-product-card__price,
.cg-single-product__body .upsells .cg-product-card__price {
margin-bottom: 16px;
color: var(--cg-color-text);
font-size: 16px;
line-height: 1.45;
}
.cg-single-product__body .related .cg-product-card__price del,
.cg-single-product__body .upsells .cg-product-card__price del {
opacity: 0.45;
}
.cg-single-product__body .related .cg-product-card__price ins,
.cg-single-product__body .upsells .cg-product-card__price ins {
background: transparent;
color: var(--cg-color-text);
text-decoration: none;
}
.cg-single-product__body .related .cg-product-card__price .amount,
.cg-single-product__body .upsells .cg-product-card__price .amount {
font-weight: 700;
}
.cg-single-product__body .related .cg-product-card__actions,
.cg-single-product__body .upsells .cg-product-card__actions {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: auto;
}
.cg-single-product__body .related .cg-product-card__actions .button,
.cg-single-product__body .related .cg-product-card__actions .added_to_cart,
.cg-single-product__body .upsells .cg-product-card__actions .button,
.cg-single-product__body .upsells .cg-product-card__actions .added_to_cart {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
min-height: 50px;
padding: 14px 18px;
border-radius: 999px;
background: linear-gradient(135deg, #2a211d, #5d463c);
color: #fff;
text-align: center;
text-decoration: none;
font-weight: 700;
box-shadow: 0 14px 26px rgba(44, 29, 20, 0.2);
transition:
box-shadow 0.22s ease,
opacity 0.22s ease;
}
@media (hover: hover) and (pointer: fine) {
.cg-single-product__body .related .cg-product-card__inner,
.cg-single-product__body .upsells .cg-product-card__inner {
transition:
transform 0.28s ease,
box-shadow 0.28s ease,
border-color 0.28s ease;
}
.cg-single-product__body .related .cg-product-card__inner:hover,
.cg-single-product__body .upsells .cg-product-card__inner:hover {
transform: translateY(-4px);
border-color: rgba(183, 141, 121, 0.26);
box-shadow: 0 24px 54px rgba(44, 29, 20, 0.11);
}
.cg-single-product__body .related .cg-product-card__img,
.cg-single-product__body .upsells .cg-product-card__img {
transition: transform 0.35s ease;
}
.cg-single-product__body .related .cg-product-card__inner:hover .cg-product-card__img,
.cg-single-product__body .upsells .cg-product-card__inner:hover .cg-product-card__img {
transform: scale(1.04);
}
.cg-single-product__body .related .cg-product-card__actions .button,
.cg-single-product__body .related .cg-product-card__actions .added_to_cart,
.cg-single-product__body .upsells .cg-product-card__actions .button,
.cg-single-product__body .upsells .cg-product-card__actions .added_to_cart {
transition:
transform 0.22s ease,
box-shadow 0.22s ease,
opacity 0.22s ease;
}
.cg-single-product__body .related .cg-product-card__actions .button:hover,
.cg-single-product__body .related .cg-product-card__actions .added_to_cart:hover,
.cg-single-product__body .upsells .cg-product-card__actions .button:hover,
.cg-single-product__body .upsells .cg-product-card__actions .added_to_cart:hover {
transform: translateY(-2px);
box-shadow: 0 18px 32px rgba(44, 29, 20, 0.26);
opacity: 1;
}
}
@media (max-width: 900px) {
.cg-single-product__body .related ul.products:not(.cg-related-products__wrapper) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}