/* Work visual v6.6.1 — intentionally separate from site.css */
.work-grid .work-card {
    position: relative;
    overflow: hidden;
}

.work-grid .work-cover-landscape {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    background: #65536c !important;
    isolation: isolate !important;
    border-bottom: 1px solid var(--line) !important;
}

.work-grid .work-cover-landscape-blur {
    position: absolute !important;
    inset: -36px !important;
    z-index: -2 !important;
    display: block !important;
    background-image: var(--work-cover) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    filter: blur(28px) saturate(.95) !important;
    transform: scale(1.16) !important;
}

.work-grid .work-cover-landscape::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background: rgba(25, 20, 29, .18) !important;
}

.work-grid .work-cover-landscape > img {
    display: block !important;
    width: auto !important;
    height: 82% !important;
    max-width: 44% !important;
    max-height: 82% !important;
    object-fit: contain !important;
    margin: 0 !important;
    border-radius: 2px !important;
    box-shadow: 0 13px 30px rgba(15, 10, 20, .34) !important;
    transform: none !important;
}

.work-grid .work-cover-landscape:hover > img {
    transform: scale(1.015) !important;
}

/* Status badge remains above the visual without changing visual geometry */
.work-grid .work-status-badge-card {
    position: absolute !important;
    z-index: 5 !important;
    top: 14px !important;
    right: 14px !important;
}

/* Work detail page uses the same visual language */
.work-detail-cover-landscape {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: min(100%, 980px) !important;
    aspect-ratio: 16 / 9 !important;
    margin: 28px 0 34px !important;
    overflow: hidden !important;
    isolation: isolate !important;
    border-radius: 20px !important;
    background: #65536c !important;
    box-shadow: 0 18px 44px rgba(52, 38, 58, .12) !important;
}

.work-detail-cover-landscape::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background: rgba(25, 20, 29, .18) !important;
}

.work-detail-cover-landscape > img {
    display: block !important;
    width: auto !important;
    height: 84% !important;
    max-width: 44% !important;
    max-height: 84% !important;
    object-fit: contain !important;
    margin: 0 !important;
    box-shadow: 0 16px 36px rgba(15, 10, 20, .36) !important;
}

@media (max-width: 700px) {
    .work-grid .work-cover-landscape > img {
        height: 78% !important;
        max-width: 50% !important;
        max-height: 78% !important;
    }

    .work-detail-cover-landscape {
        border-radius: 14px !important;
    }

    .work-detail-cover-landscape > img {
        height: 78% !important;
        max-width: 50% !important;
        max-height: 78% !important;
    }
}