/* HERO SECTION */
.hero-section {
    background-color: var(--color-secondary);
}

.advanced-search p {
    font-size: var(--font-sm);
}

.company-details p:last-child {
    margin-bottom: 0;
}
/* /HERO SECTION */


/* TOP CATEGORIES */
#top_categories{
    background-color: var(--secondary-bg);
}

.category-filter-wrapper {
    align-items: center;
    justify-content: center;
    row-gap: 20px;
    column-gap: 30px;
}

.category-name {
    font-size: var(--font-md);
    border: 1px solid var(--color-black);
    border-radius: 25px;
    padding: 10px 28px;
    transition: all .5s ease-in-out;
}

.category-name:hover,
.category-name:focus,
.category-name.active {
   background-color: var(--color-secondary);
   color: var(--color-primary);
   border-color: var(--color-primary);
}

.advanced-search-link {
    font-size: var(--font-md);
    color: var(--color-primary);
}

.advanced-search-link:hover {
    color: var(--color-black);
}

.advanced-search-link svg {
    width: 30px;
}

.advanced-search-link svg path {
    fill: var(--color-primary);
}

.advanced-search-link:hover svg path {
    fill: var(--color-black);
}

.heading-category {
    margin-bottom: 0 !important;
}

@media(max-width: 768px) {
    .category-filter-wrapper {
        gap: 20px;
    }
}

@media(max-width: 544px) {
    .category-filter-wrapper {
        gap: 15px;
    }

    .category-name {
        font-size: var(--font-sm);
        padding: 10px 15px;
    }
}
/* /TOP CATEGORIES */


/* COLLECTIONS */
#collections .title {
    margin-bottom: 30px;
}

@media(max-width: 922px) {
    #collections .title {
        margin-bottom: 15px;
    }

    #collections .content {
        margin-bottom: 30px;
    }
}
/* /COLLECTIONS */


/* PORTFOLIOS */
#collections + #portfolios .section-inner {
    border-top: 1px solid var(--color-border-3);
}
/* /PORTFOLIOS */


/* POPULAR CATEGORIES */
#collections + #popular_categories .section-inner,
#portfolios + #popular_categories .section-inner {
    border-top: 1px solid var(--color-border-3);
}
/* /POPULAR CATEGORIES */


/* VENDOR */
.vendor-section {
    background-color: var(--color-secondary);
}

.vendor-section .page-footer-container,
.vendor-section .page-footer-menu {
    width: 100%;
}
/* /VENDOR */