/* L2CHECK Phase 8B — guide visuals */

.guide-visual-group{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:14px;
    margin:24px 0 30px;
}

.guide-inline-visual{
    position:relative;
    overflow:hidden;
    margin:0;
    border:1px solid #294b61;
    border-radius:14px;
    background:#071721;
    box-shadow:0 14px 38px rgba(0,0,0,.18);
}

.guide-inline-visual>a{
    display:block;
    overflow:hidden;
    aspect-ratio:3/2;
    background:#06131c;
}

.guide-inline-visual img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .22s ease;
}

.guide-inline-visual:hover img{
    transform:scale(1.012);
}

.guide-inline-visual figcaption{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:10px 13px;
    color:#91aaba;
    font-size:.86rem;
    line-height:1.45;
}

.guide-inline-visual figcaption small{
    flex:0 0 auto;
    padding:4px 7px;
    border:1px solid #39566a;
    border-radius:999px;
    color:#6f8da2;
    font-size:.66rem;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.guide-inline-visual.is-ai{
    border-color:#4b5462;
}

@media(min-width:900px){
    .guide-visual-group:has(.guide-inline-visual:nth-child(2)){
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:700px){
    .guide-inline-visual figcaption{
        align-items:flex-start;
        flex-direction:column;
    }
}