/* Tres productos en escritorio amplio. */
@media (min-width: 1200px) {
    .hero-products {
        right: clamp(28px, 3vw, 58px);
        gap: clamp(12px, 1.3vw, 20px);
    }

    .hero-products .hero-product {
        display: block;
        width: clamp(132px, 10.5vw, 166px);
    }
}

/* Dos productos en tablet y escritorio medio. */
@media (min-width: 761px) and (max-width: 1199px) {
    .hero-products {
        right: clamp(18px, 3vw, 42px);
        gap: 14px;
    }

    body .hero-products .hero-product:nth-child(1),
    body .hero-products .hero-product:nth-child(2) {
        display: block;
        width: clamp(120px, 14vw, 148px);
    }

    body .hero-products .hero-product:nth-child(3) {
        display: none;
    }
}

/* Un producto en móvil. */
@media (max-width: 760px) {
    body .hero-products .hero-product:first-child {
        display: block;
    }

    body .hero-products .hero-product:nth-child(n + 2) {
        display: none;
    }
}