/********************************************************
    SEARCH BAR
********************************************************/
.search-section {
    padding: 20px 25px;
    text-align: center;
}

#search-input {
    width: 100%;
    max-width: 500px;
    padding: 12px 16px;
    font-size: 18px;
    border-radius: 6px;
    border: 1px solid var(--dark-slate);
    outline: none;
    font-family: var(--body-font);
}

#search-input:focus {
    border-color: var(--orange);
    box-shadow: 0 0 5px rgba(255,165,0,0.4);
}

/* 6 columns on desktop */
#search-results {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 25px;
    padding: 25px;
}

/* Medium screens: 4 columns */
@media (max-width: 1400px) {
    #search-results {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Tablets: 3 columns */
@media (max-width: 1000px) {
    #search-results {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Large phones: 2 columns */
@media (max-width: 600px) {
    #search-results {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Small phones: 1 column */
@media (max-width: 400px) {
    #search-results {
        grid-template-columns: 1fr;
    }
}