.casting-card {
    background: var(--cq-zinc-900);
    border-radius: .75rem;
    border: 1px solid var(--cq-zinc-800);
    padding: 1.5rem;
    transition: border-color .3s ease;
    display: flex; flex-direction: column; gap: 1.5rem;
}
@media (min-width: 768px) { .casting-card { flex-direction: row; } }
.casting-card:hover { border-color: rgba(225,29,72,.5); }
.casting-card.is-closed { opacity: .75; }

.casting-date {
    display: flex; flex-direction: row; align-items: center; justify-content: space-between;
    gap: .5rem;
    border-bottom: 1px solid var(--cq-zinc-800);
    padding-bottom: 1rem;
}
@media (min-width: 768px) {
    .casting-date {
        flex-direction: column; align-items: flex-start; justify-content: flex-start;
        gap: 1rem; border-bottom: none;
        border-right: 1px solid var(--cq-zinc-800);
        padding-bottom: 0; padding-right: 1rem;
        width: 6rem; flex-shrink: 0;
    }
}
.casting-date__day { font-size: 1.875rem; line-height: 1; color: #fff; }
.casting-date__month { font-size: .75rem; color: #71717a; text-transform: uppercase; letter-spacing: .1em; }

.casting-status {
    font-size: 10px; font-weight: 700;
    padding: .25rem .5rem; border-radius: 4px;
    letter-spacing: .05em;
}
.casting-status--urgent { background: rgba(20,83,45,.3); color: #4ade80; border: 1px solid rgba(22,101,52,.5); }
.casting-status--new    { background: var(--cq-zinc-800); color: #a1a1aa; border: 1px solid #3f3f46; }
.casting-status--closed { background: rgba(127,29,29,.3); color: #f87171; border: 1px solid rgba(153,27,27,.5); }