/* ==================================== */
/* News Article Single View Styles (NAS) */
/* ==================================== */

.nas-article-section {
    /* Use the same light background color for consistency */
    background-color: #dbe7e4; 
    padding: 60px 20px;
    font-family: 'Roboto', sans-serif;
    color: #354e4c;
    display: flex;
    justify-content: center; /* Ensures the whole section is centered */
}

.nas-article-container {
    /* Set max width to control article reading line length (center alignment) */
    max-width: 800px; 
    width: 100%;
    margin: 0 auto; 
}

/* --- Article Header --- */
.nas-article-header {
    margin-bottom: 30px;
}

.nas-article-title {
    color: #3e6d62; /* Primary dark green color */
    font-size: 30px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 10px;
    text-align: left; /* Image shows title aligned left */
    /* Text transform is implied by the capitalization in the image */
    text-transform: uppercase; 
    letter-spacing: 0.5px;
}

.nas-article-date {
    color: #555; /* Neutral grey color for date */
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 0;
}

.nas-date-icon {
    /* Calendar icon styling */
    margin-right: 5px;
    color: #3e6d62;
}

/* --- Featured Image --- */
.nas-featured-image-figure {
    width: 100%;
    margin: 0 0 40px 0; /* Remove default margins and add bottom margin */
    /* Added subtle shadow to the image block */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); 
    border-radius: 4px; /* Optional: slight rounding */
    overflow: hidden;
}

.nas-featured-image {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* --- Article Body --- */
.nas-article-body {
    font-size: 16px;
    line-height: 1.7;
    color: #354e4c;
}

.nas-paragraph {
    margin-bottom: 25px;
    font-weight: 300; /* Lighter font weight for body text */
}

/* Highlighted Paragraph (As seen in the image - first paragraph is bolder) */
.nas-highlighted-paragraph {
    font-weight: 500; /* Medium font weight for emphasis */
    color: #354e4c;
}


/* ==================================== */
/* 📱 MOBILE RESPONSIVENESS */
/* ==================================== */

@media (max-width: 768px) {
    .nas-article-section {
        padding: 40px 15px;
    }
    
    .nas-article-title {
        font-size: 24px;
    }

    .nas-article-date {
        font-size: 13px;
    }

    .nas-featured-image-figure {
        margin-bottom: 30px;
    }
    
    .nas-article-body {
        font-size: 15px;
        line-height: 1.6;
    }
}