/* 
CATEGORIES
*/
main[data-barba-namespace='work'] #work_p-categories {
    margin: 0 -.25rem;
    padding-bottom: 1rem;
}

main[data-barba-namespace='work'] #work_p-categories--button {
    margin-bottom: 4px;
    opacity: .25;
}

main[data-barba-namespace='work'] #work_p-categories--button img {
    height: .7rem;
    width: auto;
    vertical-align: baseline;
    transform: translateY(1.5px);
    margin-right: 4px;
}

main[data-barba-namespace='work'] #work_p-categories--list[data-status='close'] {height: 0;}

main[data-barba-namespace='work'] .work_p-category {transition: 250ms ease-in-out;}
main[data-barba-namespace='work'] #work_p-categories .work_p-category:not(:last-of-type) {margin-bottom: 3px;}


/* 
PROJECTS
*/
main[data-barba-namespace='work'] #work_p-projects {
    column-gap: 8px;
    row-gap: 1.5rem;
}
main[data-barba-namespace='work'] #work_p-projects li {grid-column: 1/-1;}

@media only screen and (min-width: 768px) {
    main[data-barba-namespace='work'] #work_p-categories {margin: 0 !important;}
    
    main[data-barba-namespace='work'] #work_p-categories--button {margin-bottom: 0;}
    main[data-barba-namespace='work'] #work_p-categories--list[data-status='close'] {
        height: unset;
        width: 0;
    }
    main[data-barba-namespace='work'] #work_p-categories--button {margin-right: .25rem;}
    main[data-barba-namespace='work'] #work_p-categories--list button {
        min-width: max-content;
        margin: 0 0 0 .75rem !important;
    }

    main[data-barba-namespace='work'] #work_p-projects li {grid-column: span 2;}
}

@media (hover: hover) {
    #work_p-categories--button,
    #work_p-categories--list button {transition: 250ms ease-in-out;}

    #work_p-categories--button:hover {opacity: 1 !important;}
    #work_p-categories--list button:hover {color: white !important;}
}