/* Image-led product cards inspired by the supplied reference. */
.products-section {
    padding-left: clamp(28px, 3.15vw, 52px);
    padding-right: clamp(28px, 3.15vw, 52px);
}

.product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(22px, 1.8vw, 30px);
}

.product-card {
    height: auto;
    min-height: 520px;
    aspect-ratio: 0.607;
    border-radius: 34px;
    isolation: isolate;
}

.product-card img { transform: scale(1.002); }

.product-card:hover img { transform: scale(1.055); }

.product-overlay {
    background: linear-gradient(
        180deg,
        rgba(7, 22, 15, 0) 32%,
        rgba(8, 18, 13, .16) 48%,
        rgba(8, 18, 13, .9) 100%
    );
}

.product-content {
    left: clamp(28px, 2.15vw, 36px);
    right: clamp(28px, 2.15vw, 36px);
    bottom: clamp(30px, 2.2vw, 38px);
}

.product-content h3 {
    margin-bottom: 18px;
    font-size: clamp(27px, 1.85vw, 31px);
    line-height: 1.06;
    letter-spacing: -.025em;
}

.product-tags {
    gap: 8px;
    margin-bottom: 17px;
}

.product-tags span {
    padding: 7px 14px;
    border-color: rgba(255, 255, 255, .5);
    background: rgba(72, 71, 60, .42);
    font-size: 13px;
    line-height: 1.2;
}

.product-content p {
    max-width: 310px;
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255, 255, 255, .9);
}

@media (max-width: 1150px) {
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .product-card { min-height: 540px; aspect-ratio: .72; }
}

@media (max-width: 700px) {
    .product-grid { display: flex; }
    .product-card { height: 520px; min-height: 0; aspect-ratio: auto; }
    .product-content p { font-size: 14px; }
}
