/* MAIN CARD */
.product-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    text-decoration: none;
    color: inherit;
    -webkit-tap-highlight-color: transparent;
}

/* IMAGE WRAPPER */
.product-image-wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: #fff;
    display: block;
}

/* 🔥 PERFECT SQUARE (Elementor safe) */
.product-image-wrap::before {
    content: "";
    display: block;
    padding-top: 100%;
}

/* 🔥 BACKGROUND IMAGES */
.product-image-wrap .img-main,
.product-image-wrap .img-hover {
    position: absolute;
    inset: 0;

    background-size: cover;       /* fill container */
    background-position: center;  /* center image */
    background-repeat: no-repeat;

    transition: opacity 0.3s ease;

    /* 🔥 mobile rendering fix */
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* STATES */
.img-main { opacity: 1; z-index: 1; }
.img-hover { opacity: 0; z-index: 2; }

/* HOVER (same logic as before) */
.product-card:hover .img-hover { opacity: 1; }
.product-card:hover .img-main { opacity: 0; }

/* INFO */
.product-info {
    padding: 4px 0;
    display: flex;
    flex-direction: column;
}

/* TEXT */
.product-title, 
.product-price {
    margin: 0;
    font-family: "Sofia Pro", sans-serif !important;
    text-transform: uppercase;
    line-height: 1.1;
    font-weight: 300;
}

.product-title { 
    font-size: 13px; 
    letter-spacing: 0.02em; 
    color: #000; 
}

.product-price { 
    font-size: 12px; 
    color: #000; 
    margin-top: 2px; 
}

/* DESKTOP TEXT HOVER */
@media (min-width: 768px) {
    .product-info > .product-title, 
    .product-info > .product-price {
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .product-card:hover .product-title,
    .product-card:hover .product-price {
        opacity: 1;
    }
}

/* MOBILE */
@media (max-width: 767px) {
	/* 🔥 FIX TEXT CUT / OVERLAP */
	.product-info {
		padding: 8px 4px;
		min-height: 56px; /* ensures space always exists */
	}
    .product-info {
        padding: 8px 4px;
    }
    .product-title { font-size: 12px; }
    .product-price { font-size: 11px; }
}