/* Fotos inteiras: não recortar copos altos, pratos ou artes quadradas. */
.products .product-image {
    height: auto;
    aspect-ratio: 4 / 3;
    max-height: 300px;
    background: var(--surface);
}
.products .product-image img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}
.products .product-image::after { display: none; }
.products .product-card:hover .product-image img { transform: none; }
#productModal #modalContent .modal-image {
    object-fit: contain;
    object-position: center;
    background: var(--surface-hover);
    width: 100%;
    height: clamp(180px, 36dvh, 360px);
    flex: 0 0 auto;
}
@media (max-width: 768px) {
    .products .product-image {
        height: 132px;
        min-height: 0;
        max-height: none;
        aspect-ratio: 1;
        align-self: center;
    }
}
@media (max-width: 420px) {
    .products .product-image { height: 118px; }
}
@media (max-height: 650px) {
    #productModal #modalContent .modal-image { height: 26dvh; }
}

/* Fundo integrado ao card: preserva a foto inteira sem destacar as sobras. */
.products .product-image { border: 0; }
@media (max-width: 768px) {
    .products .product-image { margin: 12px 0 12px 12px; border: 0; border-radius: 12px; }
}
@media (max-width: 360px) {
    .products .product-image { width: 96px; height: 96px; flex-basis: 96px; }
}