.news {
     grid-gap: 28px;
     padding: 10px 0;
}

.news a {
     text-align: left;
     color: var(--text-muted);
     background: var(--bg-card);
     border: 1px solid var(--border-color);
     border-radius: var(--radius-md);
     box-shadow: var(--shadow-sm);
     padding: 20px;
     transition: var(--transition);
     display: flex;
     flex-direction: column;
     overflow: hidden;
}

.news a:hover {
     transform: translateY(-6px);
     box-shadow: var(--shadow-lg);
     border-color: rgba(205, 162, 116, 0.4);
     color: var(--text-muted);
}

.news img {
     border-radius: var(--radius-sm);
     width: 100%;
     height: 200px;
     object-fit: cover;
     margin-bottom: 15px;
     transition: var(--transition);
}

.news a:hover img {
     transform: scale(1.03);
}

.news strong {
     margin: 0 0 8px 0;
     font-size: 18px;
     font-weight: 700;
     color: var(--secondary-dark);
     font-family: var(--font-headings);
     line-height: 1.4;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}

.news .tayang {
     font-size: 12px;
     color: var(--primary);
     font-weight: 600;
     margin-bottom: 10px;
     text-transform: uppercase;
     letter-spacing: 0.5px;
}

.news p, .news div {
     font-size: 14px;
     line-height: 1.6;
     margin: 0;
     color: var(--text-muted);
}

@media (max-width: 740px) {
     .news {
          grid-template-columns: 1fr;
          grid-gap: 20px;
     }
}

@media (min-width: 741px) {
     .news {
          grid-template-columns: 1fr 1fr 1fr;
     }
}
