/* =========================
   SINGLE NEWS PAGE
========================= */
.single-news {
    max-width: 900px;
    margin: 40px auto;
    padding: 0 13px;
    font-family: system-ui, sans-serif; /* optional: unify with site font */
}

.breadcrumb {
    font-size: 14px;
    margin-bottom: 14px;
}

.breadcrumb a {
    color: #0077cc;
    text-decoration: none;
}

.news-article h1 {
    font-size: 32px;
    color: #5621d1;
    margin-bottom: 10px;
}

.ur-title {
    font-size: 26px;
    color: #5621d1;
    margin-bottom: 15px;
}

.meta {
    color: #777;
    font-size: 14px;
    margin-bottom: 20px;
}

.featured-media img {
    width: 100%;
    border-radius: 6px;
    margin-bottom: 25px;
}


.news-gallery {
    margin-top: 20px;
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 images per row on desktop */
    gap: 10px;
}

.news-gallery img.gallery-img {
    width: 100%;       /* full width of grid cell */
    height: auto;      /* keep original aspect ratio, no crop */
    border-radius: 8px;
    object-fit: contain; /* prevents cropping */
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}


.content {
    display: grid;
    gap: 30px;
}

.urdu-content-sn {
    font-size: 20px;
    line-height: 1.9;
    background: #fafafa;
    padding: 20px;
    border-right: 4px solid gold;
}

.english-content {
    font-size: 17px;
    line-height: 1.8;
    border-left: 4px solid gold;
    background: #fafafa;
    padding: 20px;
}

/* =========================
   MOBILE (≤768px)
========================= */
@media (max-width: 768px) {
    .single-news { padding: 0 14px; margin: 20px auto;}

    .breadcrumb { font-size: 12px; margin-bottom: 10px; }
    
    .news-article .ur-title { font-size: 22px; line-height: 1.25; margin-bottom: 8px; }
    .news-article .en-title {font-size: 20px;}
    .meta { font-size: 12px; margin-bottom: 12px; }

    .featured-image { margin-left: -14px; margin-right: -14px;}

    .featured-image img { width: 100%; height: auto; display: block; }
    
    .featured-media img {
        margin-bottom: 6px;
    }
    
    .news-gallery {
        grid-template-columns: 1fr; /* 1 image per row on mobile */
        gap: 15px;
    }

    .content { margin-top: 0px; gap: 5px;}

    .urdu-content-sn { font-size: 16px; line-height: 2; margin-bottom: 5px; border-right: none; padding-top: 4px;}

    .english-content { font-size: 15px; line-height: 1.75; border-left: none;}
}