/* ============================================================
   TunaGrow CBO — News & Stories Page Styles
   File: css/news.css
   ============================================================ */

.news-grid {
  display: grid; grid-template-columns: 2fr 1fr; gap: 30px;
  align-items: start;
}

/* ── Featured Article ── */
.news-featured {
  background: var(--white); border-radius: 20px; overflow: hidden;
  box-shadow: 0 4px 20px rgba(59,42,26,0.07);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.3s ease;
}
.news-featured:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(59,42,26,0.12);
}
.news-featured-img {
  background: linear-gradient(135deg, var(--leaf) 0%, var(--sprout) 100%);
  height: 240px; display: flex; align-items: center;
  justify-content: center; font-size: 4rem;
}
.news-featured-body { padding: 28px; }
.news-cat {
  font-size: 0.75rem; font-weight: 600; color: var(--leaf);
  text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 10px;
}
.news-featured-body h3 {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem; color: var(--earth); margin-bottom: 12px;
}
.news-featured-body p { font-size: 0.88rem; color: var(--muted); line-height: 1.7; }
.news-date { font-size: 0.78rem; color: var(--muted); margin-top: 16px; }

/* ── News Sidebar List ── */
.news-list { display: flex; flex-direction: column; gap: 16px; }

.news-item {
  background: var(--white); border-radius: 16px; padding: 20px;
  box-shadow: 0 4px 16px rgba(59,42,26,0.06); transition: transform 0.2s;
}
.news-item:hover { transform: translateX(4px); }
.news-item h4 {
  font-family: 'Playfair Display', serif;
  font-size: 0.95rem; color: var(--earth); margin-bottom: 6px;
}
.news-item p { font-size: 0.8rem; color: var(--muted); line-height: 1.6; }
.news-item .news-date { margin-top: 8px; }

/* ── Responsive ── */
@media (max-width: 900px) {
  .news-grid { grid-template-columns: 1fr; }
}