/**
 * Responsive styles for Gazeta theme.
 * Updated to fix homepage image sizes on mobile.
 */

@media (max-width: 768px) {
    /* --- Homepage Article Images Fix --- */

    /* 1. Reset generic layout containers to prevent side-by-side flex/float */
    .front .views-row,
    .front article.node--view-mode-teaser,
    .front .views-row .node {
        display: block !important;
        width: 100% !important;
        clear: both !important;
        margin-bottom: 20px !important;
    }

    /* 2. Target the image container explicitly */
    .front .node-image,
    .front .field--name-field-image,
    .front .views-field-field-image,
    .front .views-field-field-images,
    .front .views-field-image {
        display: block !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 10px 0 !important;
        padding: 0 !important;
        text-align: center !important;
        /* Center image if smaller than screen */
    }

    /* SUPER SPECIFIC SELECTOR TO FORCE 4:3 */
    body.front .node-image img,
    body.front .field--name-field-image img,
    body.front .views-field-field-image img,
    body.front .views-field-image img,
    body.front .view-content img,
    body.front article img,
    body.front .block-views .views-row img,
    body.front .block-latest-news .view-content .views-field-field-image img {
        width: 100% !important;
        max-width: 800px !important;
        height: auto !important;
        aspect-ratio: 4/3 !important;
        object-fit: cover !important;
        display: block !important;
    }
}