/* 
 * Membrain Records - Artist Dossier & Archive Manifest
 * Sovereign Industrial System v6.7.0 [INTERACTIVE_ENHANCEMENT]
 */

:root {
    --mb-neon: #00ff41;
    --mb-void: #121414;
    --mb-basalt: #1A1A1A;
    --mb-border: #343535;
    --mb-font-head: 'Epilogue', sans-serif;
    --mb-font-body: 'Space Grotesk', sans-serif;
}

/* 
 * ARTIST ROSTER GRID [CARD_ONLY_BORDERS]
 */
.mb-roster-grid-wrap {
    width: 100% !important;
}

.mb-roster-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 0 !important;
    width: 100% !important;
}

.mb-roster-grid > * {
    grid-column: span 1 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    margin: 0 !important;
}

.mb-roster-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important; /* Force Left Alignment */
    text-decoration: none !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    cursor: crosshair !important;
    height: 100% !important;
    outline: 1px solid var(--mb-border) !important;
    outline-offset: -1px !important;
    box-sizing: border-box !important;
    position: relative !important;
    padding: 2.5rem !important; /* RESTORE_INTERNAL_GUTTER */
}

.mb-roster-card:hover {
    background: #0d0d0d !important;
    outline-color: var(--mb-neon) !important;
    z-index: 10 !important; /* Bring green border to front */
}

.mb-roster-card.mb-roster-join:hover {
    outline-style: dashed !important;
}

/* Image Box */
.mb-roster-img-box {
    width: 100% !important;
    aspect-ratio: 1/1 !important;
    overflow: hidden !important;
    margin-bottom: 1.5rem !important;
    background: #111 !important;
}

.mb-roster-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: grayscale(100%) !important;
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mb-roster-card:hover .mb-roster-img {
    filter: grayscale(0%) !important;
    transform: scale(1.08) !important;
}

/* Join Card Plus Box */
.mb-roster-plus-box {
    width: 100% !important;
    aspect-ratio: 1/1 !important;
    background: #0d0d0d !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 1.5rem !important;
}

.mb-roster-plus-box span {
    font-size: 3rem !important;
    color: #27272a !important;
    transition: all 0.3s ease !important;
}

.mb-roster-card:hover .mb-roster-plus-box span {
    color: var(--mb-neon) !important;
    transform: rotate(90deg) !important;
}

/* Metadata */
.mb-roster-meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    margin-top: auto !important;
    width: 100% !important;
    text-align: left !important; /* Strict Left Alignment */
}

.mb-roster-label {
    font-family: var(--mb-font-body) !important;
    font-size: 11px !important;
    color: var(--mb-neon) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 500 !important;
}

.mb-roster-name {
    font-family: var(--mb-font-head) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #fff !important;
    text-transform: uppercase !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* 
 * RESPONSIVE 
 */
@media (max-width: 1280px) {
    .mb-roster-grid { grid-template-columns: repeat(4, 1fr) !important; }
}

@media (max-width: 1024px) {
    .mb-roster-grid { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 768px) {
    .mb-roster-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 480px) {
    .mb-roster-grid { grid-template-columns: 1fr !important; }
}