.search-section{
    width: min(1200px, 100%);
    padding-inline: clamp(12px, 4vw, 20px);
    margin-inline: auto;
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xxl);

    h1{
        font-size: var(--font-size-xxxl);
        font-weight: 700;
    }

    .search-section-form{
        width: 100%;
        max-width: 500px;
        padding: 10px 12px;
        display: flex;
        align-items: center;
        gap: var(--space-md);
        border: 0.08rem solid var(--color-primary-hover);
        border-radius: var(--radius-lg);

        button{
            background: none;
            padding: 0;
            margin: 0;
            display: flex;
        }

        input{
            font-size: var(--font-size-base);
            font-weight: 400;
        }
    }

    .search-section-products{
        margin-top: var(--space-xxl);
        display: grid;
        gap: var(--space-lg);
        row-gap: var(--space-xl);
        grid-template-columns: 1fr;
        @media (min-width: 601px) and (max-width: 900px) {
            grid-template-columns: repeat(3, 1fr);
        }
        @media (min-width: 500px) and (max-width: 650px) {
            grid-template-columns: repeat(2, 1fr);
        }

        @media (min-width: 901px) {
            grid-template-columns: repeat(4, 1fr);
        }
    }
}

main{
    background: var(--color-bg-alt);
}