/* v1.3.9 – Vit titel, röd kategori, överlapp, 2:1-bildhöjd */
.page-news{ background-color: transparent!important; padding: 0rem!important; }
.page-news .c-card__content__title a,
.page-news .c-card__content__title a:hover,
.page-news .c-card__content__title a:focus { color:#fff !important; text-decoration:none !important; }
.page-news .c-card__content__category .c-card__category-label { color:#e60000; font-weight:600; }
.page-news .c-card__content-align { position:relative; margin-top:-60px; z-index:2; }
.page-news .c-card__content { background:#000; padding:1.5rem; }
.page-news .c-card__image { position:relative; }
.page-news .c-card__image::before { content:""; display:block; padding-top:50%; } /* 2:1 */
.page-news .c-card__image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.page-news .news-item .c-card { display:flex; flex-direction:column; height:100%; }
.page-news .news-item .c-card__image-wrap { z-index:1; }

/* Centrera nyhetssektionen på startsidan */
.page-news {
  width: 100%;
  display: flex;
  justify-content: center;
}

.page-news .container {
  max-width: 1200px; /* samma som övrigt innehåll */
  margin: 0 auto;
  padding: 0 1rem; /* lite luft i kanterna */
  width: 100%;
}

/* Se till att gridet inte sticker ut */
.page-news .news-grid {
  justify-content: center;
}

/* Gör nyhetssektionen bredare men centrerad */
.page-news .container {
  max-width: 1600px; /* öka från t.ex. 1200 till 1600px */
  margin: 0 auto;
  padding: 0 2rem;
  width: 100%;
}

/* Justera gridet så korten fyller ut ytan fint */
.page-news .news-grid {
  justify-content: flex-start;
  gap: 2rem;
}

/* Låt korten växa lite om du vill ha färre kolumner med mer yta */
@media (min-width: 1024px) {
  .page-news .news-item {
    flex: 1 1 calc(33.333% - 2rem);
    max-width: calc(33.333% - 2rem);
  }
}

@media (max-width: 1023px) {
  .page-news .news-item {
    flex: 1 1 calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }
}

@media (max-width: 640px) {
  .page-news .news-item {
    flex: 1 1 100%;
    max-width: 100%;
  }
}
