.ebmnt1-work__filters {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.6em 2.1em;
}

.ebmnt1-work__filter {
    position: relative;
    border: none;
    background: none;
    font-family: inherit;
    font-size: var(--ebmnt1-fs-body);
    font-weight: 500;
    color: var(--ebmnt1-color-work-filter-text);
    transition: color var(--ebmnt1-duration-fast) var(--ebmnt1-ease-main);
}

.ebmnt1-work__filter::after {
    content: "";
    position: absolute;
    top: 50%;
    inset-inline-end: -1.3em;
    width: 0.4em;
    aspect-ratio: 1;
    border-radius: var(--ebmnt1-radius-circle);
    background-color: var(--ebmnt1-color-work-filter-dot);
    transform: translateY(-50%);
}

.ebmnt1-work__filter:last-child::after {
    display: none;
}

.ebmnt1-work__filter:hover,
.ebmnt1-work__filter.is-active {
    color: var(--ebmnt1-color-work-filter-active);
}

.ebmnt1-work__card {
    position: relative;
    isolation: isolate;
    width: 100%;
    border-radius: var(--ebmnt1-radius-card);
    overflow: hidden;
}

.ebmnt1-work__card img {
    width: 100%;
    aspect-ratio: 1 / 0.8;
    object-fit: cover;
    transition: transform var(--ebmnt1-duration-slow) var(--ebmnt1-ease-main);
}

.ebmnt1-work__card:hover img {
    transform: scale(1.06);
}

.ebmnt1-work__card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    background-color: var(--ebmnt1-color-work-overlay);
    transform: translateY(100%);
    transition: all var(--ebmnt1-duration-medium) var(--ebmnt1-ease-main);
}

.ebmnt1-work__card:hover::before {
    opacity: 1;
    transform: translateY(0);
}

.ebmnt1-work__card-content {
    position: absolute;
    inset-inline: 1.5em;
    top: 50%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1em;
    text-align: center;
    visibility: hidden;
    opacity: 0;
    transform: translateY(0%);
    transition: all var(--ebmnt1-duration-medium) var(--ebmnt1-ease-main);
}

.ebmnt1-work__card:hover .ebmnt1-work__card-content {
    visibility: visible;
    opacity: 1;
    transform: translateY(-50%);
}

.ebmnt1-work__card-title {
    font-size: var(--ebmnt1-fs-h3);
    line-height: 1.5;
    color: var(--ebmnt1-color-work-title);
}

.ebmnt1-work__card-link {
    display: grid;
    place-items: center;
    width: 2.5rem;
    aspect-ratio: 1;
    border-radius: var(--ebmnt1-radius-circle);
    background-color: var(--ebmnt1-color-work-link-bg);
    color: var(--ebmnt1-color-work-link-icon);
    font-size: var(--ebmnt1-fs-icon-small);
    transition: all var(--ebmnt1-duration-medium) var(--ebmnt1-ease-main);
}

.ebmnt1-work__card-link:hover {
    background-color: var(--ebmnt1-color-work-link-hover-bg);
    color: var(--ebmnt1-color-work-link-icon-hover);
}

@media (hover: none) {
    .ebmnt1-work__card::before {
        opacity: 1;
        transform: translateY(0);
        background: linear-gradient(0deg, var(--ebmnt1-color-work-overlay), transparent 60%);
    }

    .ebmnt1-work__card-content {
        top: auto;
        bottom: 1em;
        visibility: visible;
        opacity: 1;
        transform: none;
    }
}
