.news-wrapper{
  max-width: 1200px; 
  margin: 0 auto;
}


.news-grid{
  display: grid; 
  grid-template-columns: repeat(3, 1fr); 
  gap: 30px;
}

.news-card {
    background: #fff; 
    overflow: hidden; 
    display: flex; 
    flex-direction: column; 
    transition: transform 0.2s;
    padding: 0px 10px 0px 10px;
}


.news-info{
  padding: 10px 0px; 
  flex-grow: 1; 
  display: flex; 
  flex-direction: column;
}

.news-title{
  font-size: 23px; 
  margin: 0 0 10px 0; 
  line-height: 1; 
  font-weight: 600;
}

.news-pub-date{
  font-size: 12px; 
  color: #000724; 
  margin-bottom: 20px; 
  font-family: Manrope, Sans-serif;

}



/* Mobile "Carousel" override for the existing news-grid */
@media (max-width: 767px) {
    .news-wrapper {
        overflow: hidden; /* Clips any messy overflow */
    }

    .news-grid {
        display: flex !important; /* Changes from grid to a row */
        flex-wrap: nowrap !important; /* Prevents cards from stacking */
        overflow-x: auto !important; /* Enables horizontal swiping */
        scroll-snap-type: x mandatory !important; /* Snaps cards into place */
        -webkit-overflow-scrolling: touch; /* Smooth scrolling for iOS */
        gap: 15px !important;
        padding: 0px 0px 20px 0px !important; /* Space at bottom for "peek" visibility */
    }

    /* Hide the scrollbar for that clean "app" look */
    .news-grid::-webkit-scrollbar {
        display: none;
    }

    .news-card {
        flex: 0 0 82% !important; /* Width of the card in view */
        width: 82% !important;
        scroll-snap-align: center !important; /* Centers the card on swipe */
    }

    .news-card img {
        height: 150px !important; /* Keeps it compact and short */
    }

    .news-title {
        font-size: 1.2rem !important;
        line-height: 1.3 !important;
    }

    .news-pub-date {
        font-size: 0.9rem !important;
    }

/* 3. Center and shrink the "Read Article" button */
    .news-info div {
        width: 100%;
    }

    .news-info .dv-button-primary {
        font-size: 11px !important;
    }

}