/* Patch: Improve UI/UX for home "Ultime Notizie" section
   - Card grid, readable excerpts, improved promo card contrast
   - Responsive behavior: stacked on mobile, two-column on tablet, promo aside on desktop
   - Accessibility: increased contrast, focus styles, visible CTAs
*/

.latest {
  --news-gap: 1.25rem;
}

.latest_wrapper {
  display: flex;
  gap: var(--news-gap);
  align-items: flex-start;
}

/* Promo block (large feature on the left/top) */
.latest_promo {
  flex: 0 0 100%;
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(33,72,66,0.06);
}
.latest_promo a { color: inherit; text-decoration: none; display:block; }
.latest_promo .latest_promo-bg { width:100%; height:auto; display:block; object-fit:cover; }
.latest_promo .overlay { position:absolute; left:0; right:0; bottom:0; padding:1.5rem; background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(33,72,66,0.72) 100%); color: #fff; }
.latest_promo .overlay_header { margin:0 0 0.5rem; font-size:1.25rem; line-height:1.2; font-weight:800; color:#fff; }
.latest_promo .overlay_text { margin:0; color:rgba(255,255,255,0.92); font-size:0.95rem; }

/* Latest list: transform into stacked cards that become grid on larger screens */
.latest_list { list-style:none; margin:0; padding:0; display:grid; gap:1rem; }
.latest_list .list-item { margin:0; }

.news-card { display:flex; gap:1rem; align-items:flex-start; padding:0.75rem; border-radius:10px; background: #fff; transition:transform 0.18s ease, box-shadow 0.18s ease; border: 1px solid rgba(33,72,66,0.04); }
.news-card:focus, .news-card:hover { transform:translateY(-4px); box-shadow:0 10px 24px rgba(33,72,66,0.08); outline: none; }

.latest_list-preview { flex:0 0 140px; width:140px; height:88px; overflow:hidden; border-radius:8px; display:block; background:#f6f7f6; }
.preview-img { width:100%; height:100%; object-fit:cover; display:block; }

.latest_list-main { color:#214842; }
.latest_list-main .metadata { font-size:0.85rem; color:#6b7a74; margin-bottom:0.35rem; }
.latest_list-main .title { margin:0 0 0.3rem; font-size:1.02rem; line-height:1.25; color:#214842; font-weight:800; }
.latest_list-main .text { margin:0; color:#35584f; font-size:0.95rem; }

/* Ensure links inside cards are accessible */
.news-card:focus-visible { outline:3px solid rgba(239,195,104,0.18); outline-offset:3px; border-radius:10px; }

/* Responsive layout */
@media (min-width: 768px) {
  .latest_wrapper { flex-direction: row-reverse; }
  .latest_promo { flex: 0 0 46%; max-width:46%; }
  .latest_list { grid-template-columns: 1fr; }
  .latest_list .list-item { }
}

@media (min-width: 992px) {
  .latest_wrapper { gap:2rem; }
  .latest_promo { flex: 0 0 50%; max-width:50%; }
  .latest_list { grid-template-columns: 1fr; }
}

/* On very wide screens, make promo and list side-by-side with compact list width */
@media (min-width: 1200px) {
  .latest_wrapper { align-items:flex-start; }
  .latest_promo { flex:0 0 48%; }
  .latest_list { flex: 0 0 44%; grid-auto-rows: auto; }
  .latest_list-preview { flex:0 0 150px; width:150px; height:100px; }
}

/* Small screens: stack promo then list, make images larger */
@media (max-width:767px) {
  .latest_wrapper { flex-direction: column; }
  .latest_promo { order:0; margin-bottom:0.75rem; }
  .latest_list-preview { width:100%; height:180px; flex: 0 0 auto; }
  .news-card { flex-direction:column; }
  .latest_list-main { padding-top:0.5rem; }
}

/* Small accessibility helpers */
.latest .title, .latest_promo .overlay_header { -webkit-font-smoothing:antialiased; }

/* CTA polish */
.latest .btn--green {
  background:#214842;
  color:#fff;
  border:none;
  padding:0.55rem 1rem;
  border-radius:8px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  min-width:160px;
  height:48px;
  box-sizing:border-box;
}
.latest .btn--green:focus,
.latest .btn--green:hover {
  background:#183f36;
}