/* ==========================================================================
   News Page — Sidebar layout, card grid, tags, sidebar widgets
   ========================================================================== */

@layer layout {

  /* ========== PAGE HERO — video lievemente alzato (era 70%, abbassato a 55%) ========== */
  .page-hero--news .page-hero__bg img,
  .page-hero--news .page-hero__bg video {
    object-position: center 55%;
  }

  /* Layout 2-colonne (.news-layout) e widget sidebar (.news-sidebar*)
     sono in components/news-sidebar.css — condivisi con il template articolo. */

  /* ========== FILTER BAR (categoria attiva + reset) ========== */
  .news-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
    padding: var(--space-3) var(--space-4);
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-md);
  }

  .news-filter-bar__label {
    margin: 0;
    font-size: var(--fs-small);
    color: var(--color-text-muted);
  }

  .news-filter-bar__label strong {
    color: var(--color-text);
  }

  .news-filter-bar__count {
    color: var(--color-text-muted);
  }

  .news-filter-bar__reset {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--fs-small);
    font-weight: var(--fw-semibold);
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--duration-fast) var(--ease-out);
  }

  .news-filter-bar__reset:hover {
    color: var(--color-primary-dark);
  }

  .news-filter-bar__reset svg {
    width: 16px;
    height: 16px;
  }

  .news-empty {
    font-size: var(--fs-small);
    color: var(--color-text-muted);
    padding: var(--space-4) 0;
  }

  /* ========== NEWS GRID (inside main) ========== */
  .news-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  @media (min-width: 768px) {
    .news-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  /* ========== NEWS CARD ========== */
  .news-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--color-gray-200);
    transition: box-shadow var(--duration-normal) var(--ease-out),
                transform var(--duration-normal) var(--ease-out);
  }

  .news-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
  }

  /* Hidden by category filter */
  .news-card--hidden {
    display: none;
  }

  /* ========== IMAGE ========== */
  .news-card__image-link {
    display: block;
  }

  .news-card__image-wrap {
    overflow: hidden;
    aspect-ratio: 3 / 2;
  }

  .news-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--duration-slow) var(--ease-out);
  }

  .news-card:hover .news-card__image {
    transform: scale(1.05);
  }

  /* ========== CONTENT ========== */
  .news-card__content {
    padding: var(--space-5);
  }

  /* ========== META (date + tag) ========== */
  .news-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-3);
    margin-bottom: var(--space-3);
    font-size: var(--fs-small);
    color: var(--color-text-muted);
  }

  .news-card__tag {
    display: inline-block;
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-full);
    background: var(--color-gray-50);
    color: var(--color-primary);
    font-size: 0.7rem;
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
  }

  /* ========== TITLE ========== */
  .news-card__title {
    font-family: var(--font-display);
    font-size: var(--fs-h4);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    margin-bottom: var(--space-3);
  }

  .news-card__title a {
    color: var(--color-text);
    text-decoration: none;
    transition: color var(--duration-fast) var(--ease-out);
  }

  .news-card__title a:hover {
    color: var(--color-primary);
  }

  /* ========== EXCERPT ========== */
  .news-card__excerpt {
    font-size: var(--fs-small);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin-bottom: var(--space-4);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* ========== READ MORE LINK ========== */
  .news-card__link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-small);
    font-weight: var(--fw-semibold);
    color: var(--color-primary);
    text-decoration: none;
    transition: gap var(--duration-normal) var(--ease-out);
  }

  .news-card__link:hover {
    gap: var(--space-3);
  }

  .news-card__link svg {
    width: 16px;
    height: 16px;
  }

  /* ========================================================================
     SIDEBAR
     ======================================================================== */

  .news-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
  }

  @media (min-width: 1280px) {
    .news-sidebar {
      position: sticky;
      top: calc(var(--header-height) + var(--space-5));
    }
  }

  /* ========== WIDGET ========== */
  .news-sidebar__widget {
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
  }

  .news-sidebar__widget--highlight {
    background: var(--color-gray-50);
    border-color: transparent;
  }

  .news-sidebar__title {
    font-family: var(--font-display);
    font-size: var(--fs-h4);
    font-weight: var(--fw-semibold);
    margin-bottom: var(--space-4);
    display: flex;
    align-items: center;
    gap: var(--space-2);
  }

  .news-sidebar__title-icon {
    width: 20px;
    height: 20px;
    color: var(--color-primary);
  }

  /* ========== CATEGORY LIST ========== */
  .news-sidebar__cat-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
  }

  .news-sidebar__cat-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    font-size: var(--fs-small);
    color: var(--color-text);
    text-decoration: none;
    transition: background var(--duration-fast) var(--ease-out),
                color var(--duration-fast) var(--ease-out);
  }

  .news-sidebar__cat-link:hover {
    background: var(--color-gray-50);
    color: var(--color-primary);
  }

  .news-sidebar__cat-link--active {
    background: var(--color-primary);
    color: var(--color-white);
    font-weight: var(--fw-semibold);
  }

  .news-sidebar__cat-link--active:hover {
    background: var(--color-primary-dark);
    color: var(--color-white);
  }

  .news-sidebar__cat-count {
    font-size: 0.7rem;
    font-weight: var(--fw-semibold);
    padding: 2px 8px;
    border-radius: var(--radius-full);
    background: rgba(0, 0, 0, 0.06);
    min-width: 24px;
    text-align: center;
  }

  .news-sidebar__cat-link--active .news-sidebar__cat-count {
    background: rgba(255, 255, 255, 0.2);
    color: var(--color-white);
  }

  /* ========== RECENT ARTICLES ========== */
  .news-sidebar__recent {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
  }

  .news-sidebar__recent-item a {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    text-decoration: none;
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--color-gray-200);
    transition: color var(--duration-fast) var(--ease-out);
  }

  .news-sidebar__recent-item:last-child a {
    border-bottom: none;
    padding-bottom: 0;
  }

  .news-sidebar__recent-title {
    font-size: var(--fs-small);
    font-weight: var(--fw-medium);
    color: var(--color-text);
    line-height: var(--lh-normal);
    transition: color var(--duration-fast) var(--ease-out);
  }

  .news-sidebar__recent-item a:hover .news-sidebar__recent-title {
    color: var(--color-primary);
  }

  .news-sidebar__recent-date {
    font-size: 0.7rem;
    color: var(--color-text-muted);
  }

  /* ========== NEWSLETTER WIDGET ========== */
  .news-sidebar__widget-text {
    font-size: var(--fs-small);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin-bottom: var(--space-4);
  }

  .news-sidebar__newsletter {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
  }

  .news-sidebar__newsletter .form__input {
    width: 100%;
  }

}