

/* ============================================
   News carousel (mobile)
   ============================================ */

.news-carousel-dots {
  display: none;
}
.news-card-excerpt {
   margin-top: 0;
}

 .news-card-content {
   margin-bottom: 0;
   padding-block: var(--padding-close);
 }

@media (max-width: 763px) {
  .news-grid.three-cols[data-news-carousel-track] {
    --news-card-width: 92%;

    display: flex;
    flex-direction: row;
    overflow-x: auto;

    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;

    gap: var(--padding-close);

    /* gör så första & sista kortet kan snappa centrerat */
    padding-block: var(--padding-normal);
    padding-inline: calc((100% - var(--news-card-width)) / 2);

    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;

    scrollbar-width: none;
  }

  .news-grid.three-cols[data-news-carousel-track]::-webkit-scrollbar {
    display: none;
  }

  .news-grid.three-cols[data-news-carousel-track] > .news-card {
    flex: 0 0 auto;
    width: var(--news-card-width);

    scroll-snap-align: center;
    scroll-snap-stop: always;

    padding: 0;
    overflow: hidden;

    display: flex;
    flex-direction: column;

    height: auto;
  }

  /* Bild: fyller toppen + 16:9 */
  .news-grid.three-cols[data-news-carousel-track] > .news-card > .news-card-image {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    margin-block: 0;
    object-fit: cover;
  }

  /* Padding på content/footer istället */
  .news-grid.three-cols[data-news-carousel-track] .news-card-content,
  .news-grid.three-cols[data-news-carousel-track] .news-card-footer {
    padding-inline: var(--padding-close);
  }

  .news-grid.three-cols[data-news-carousel-track] .news-card-content {
    padding-top: var(--padding-close);
  }

  .news-grid.three-cols[data-news-carousel-track] .news-card-footer {
    margin-top: 0;
    padding-top: var(--padding-tight);
    padding-bottom: var(--padding-close);
  }

  /* Lås titel/excerpt så korten blir jämna (utan “ocean”) */
  .news-grid.three-cols[data-news-carousel-track] .news-card-title {
    line-height: 1.25;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    min-height: calc(1.25em * 2);
  }

  .news-grid.three-cols[data-news-carousel-track] .news-card-excerpt {
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    min-height: calc(1.5em * 3);
    margin-top: 0;
  }

  /* Prickar */
  .news-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 0.45rem;
    margin-top: var(--padding-close);
    padding-bottom: var(--padding-close);
  }

  .news-carousel-dot {
    all: unset;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    border: 1px solid var(--clr-cta);
    background: transparent;
    cursor: pointer;
  }

  .news-carousel-dot[aria-current="true"] {
    background: var(--clr-cta);
  }

  .news-carousel-dot:focus-visible {
    outline: 1px solid var(--clr-cta);
    outline-offset: 3px;
    border-radius: 999px;
  }
}
@media (max-width: 763px) {
  .news-grid.three-cols[data-news-carousel-track] > .news-card {
    flex: 0 0 auto;
    width: var(--news-card-width);

    scroll-snap-align: center;
    scroll-snap-stop: always;

    padding: 0;
    overflow: hidden;

    display: flex;
    flex-direction: column;

    /* VIKTIGT: ingen fast höjd */
    height: auto;
  }

  /* Bild: 16:9 och fyller toppen */
  .news-grid.three-cols[data-news-carousel-track] > .news-card > .news-card-image {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    object-fit: cover;
  }

  /* Padding på content/footer istället */
  .news-grid.three-cols[data-news-carousel-track] .news-card-content,
  .news-grid.three-cols[data-news-carousel-track] .news-card-footer {
    padding-inline: var(--padding-close);
  }

  .news-grid.three-cols[data-news-carousel-track] .news-card-content {
    padding-top: var(--padding-close);
  }

  /* INGEN auto-marginal här (den skapade "ocean" när du hade fast höjd) */
  .news-grid.three-cols[data-news-carousel-track] .news-card-footer {
    margin-top: 0;
    padding-top: var(--padding-tight);
    padding-bottom: var(--padding-close);
  }

  /* Lås titel/excerpt så de inte gör kort olika höga */
  .news-grid.three-cols[data-news-carousel-track] .news-card-title {
    line-height: 1.25;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    min-height: calc(1.25em * 2);
  }

  .news-grid.three-cols[data-news-carousel-track] .news-card-excerpt {
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp:3;
    overflow: hidden;
    min-height: calc(1.5em * 3);
  }

  /* Tags kan annars “hoppa” i höjd */
  .news-grid.three-cols[data-news-carousel-track] .news-card-tags {
    max-height: 2.2em;
    overflow: hidden;
  }
}
