.rpsb-wrapper {
    margin: var(--generic-gap);
}

/* Add transition to all child elements */
.rpsb-item * {
    transition: opacity 0.10s ease-out;
}

.rpsb-item {
    display: flex;
    align-items: center;
    text-decoration: none;
    margin-bottom: calc(var(--generic-gap) / 2);
	
    /* Optional: transition on the main container as well */
    transition: opacity 0.10s ease-out;
}

a.rpsb-item {
    text-decoration: none !important;
}

/* ↓ Apply the opacity change to the ENTIRE block */
.rpsb-item:hover,
.rpsb-item:hover * {
    opacity: 0.9;
}

.rpsb-thumb-wrap {
    flex: 0 0 auto;
}

.rpsb-thumb {
    display: block;
    width: 120px;
    height: auto;
    border-radius: var(--border-radius-xs);
    object-fit: cover;
}

.rpsb-content {
    display: flex;
    flex-direction: column;
	align-self: baseline;
	margin-left: var(--generic-gap);
}

.rpsb-label {
    font-size: var(--font-m);
    color: var(--main-color-dark);
    font-weight: var(--bold-weight);
    font-family: var(--main-font);
    text-transform: uppercase;
    background: var(--main-color-xlight);
    padding: 0 5px;
    border-radius: var(--border-radius-xs);
    white-space: nowrap;
    margin-bottom: calc(var(--generic-gap) / 2);
}

.rpsb-title {
    font-size: var(--font-xl);
    font-family: var(--main-font);
    font-weight: var(--bold-weight);
    color: var(--black-color);
    line-height: 1;
}

/* Remove old title-only hover styling */
