/* ===============  KIELITEKO – CARD  =============== */

/* Kortin pohja */
.kt-card{
  background: var(--bg, #fff);
  border: 1px solid var(--border, #e5e7eb);
  border-radius: var(--radius-card, 12px);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
  height: 100%;
}
.kt-card:hover{
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

/* Koko kortti klikattava + pystysuuntainen layout
   → footer voidaan "ankkuroida" alas margin-top:auto:lla */
.kt-card__link{
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: var(--pad-card, 14px);
  color: inherit;
  text-decoration: none;
  height: 100%;
}

/* Media-alue: neliö */
.kt-card__media{
  position: relative;
  aspect-ratio: 1 / 1;
  background: var(--bg-soft,#f2f4f7);
  border-radius: var(--radius-inner,10px);
  overflow: hidden;
  width: 100%;
  margin: 6px 0 8px;
}
.kt-card__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Typografiaperusta (sama line-height muuttujana, jotta fallback-laskenta toimii) */
:root { --kt-lh: 1.25; }

/* Orga ja päivämäärä – sama koko ja tyyli */
.kt-card__org,
.kt-card__date{
  margin: .35rem 0 0;
  color: #334155;
  font-size: .80rem;
  line-height: var(--kt-lh);
}

/* Otsikko – 3 rivin clamp */
.kt-card__title{
  margin: .35rem 0 0;
  color:#0f172a;
  font-weight: 600;
  font-size: 0.85rem;
  line-height: var(--kt-lh);
}

/* Yleis-clamp-luokat (Chrome/Safari/Edge) */
.line-clamp-2,
.line-clamp-3{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-2{ -webkit-line-clamp: 2; }
.line-clamp-3{ -webkit-line-clamp: 3; }

/* Fallback selaimille ilman -webkit-line-clamp (Firefox) */
@supports not (-webkit-line-clamp: 1){
  .line-clamp-2,
  .line-clamp-3{
    display: block;
    overflow: hidden;
  }
  .line-clamp-2{ max-height: calc(2 * var(--kt-lh) * 1em); }
  .line-clamp-3{ max-height: calc(3 * var(--kt-lh) * 1em); }

  /* Hieno häivytysvihje alalaitaan – poista jos et halua */
  .line-clamp-2,
  .line-clamp-3{
    mask-image: linear-gradient(180deg, #000 80%, transparent);
  }
}

/* Footer “ankkuroituu” alas ja on tiivis */
.kt-card__footer{
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 6px;                 /* tiivis väli */
  line-height: 1.2;           /* ei tyhjää riviväliä */
  padding-top: .5rem;
  flex-wrap: wrap;          /* saa mennä kahdelle riville ahtaassa ilman isoa ilmaa */
}

/* Pisteet (1–5) */
.kt-card__dots{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.kt-card__dot{
  width: .68rem;
  height: .68rem;
  border-radius: 999px;
  background: var(--dot-off, #E3E6EA);
}

/* Värit laadun mukaan (kortissa luokat .is-good / .is-bad) */
.kt-card.is-good .kt-card__dot.is-fill{ background: var(--good,#12448b); }
.kt-card.is-bad  .kt-card__dot.is-fill{ background: var(--bad,#6f201d); }
.kt-card.is-good .kt-card__value{ color: var(--good,#12448b); }
.kt-card.is-bad  .kt-card__value{ color: var(--bad,#6f201d); }

/* Numerot & peukku & määrä */
.kt-card__value{
  font-weight: 700;
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  line-height: 1;
}
.kt-card__thumb{
  width: 20px;
  height: 20px;
  margin: 0;
  vertical-align: middle;
}
.kt-card__count{
  line-height: 1;
  margin-left: 2px;
  color:#6b7280;
  font-size:.85rem;
  white-space: nowrap;
}

/* Grid venyttää kortit saman korkuisiksi rivillä */
.kieliteko-grid > .kt-card{ height: 100%; }

/* Pienet ruudut: hieman tiiviimpi otsikko */
@media (max-width:520px){
  .kt-card__title{ font-size: .96rem; }
}

/* --- KORTTI: otsikon riviväli + väli ennen footeria --- */

/* Erota org/date -riviväli (yleinen) ja otsikon riviväli omaksi muuttujaksi */
:root{
  --kt-lh: 1.15;          /* org + päivämäärä (oli 1.0 → vähän väljempi) */
  --kt-title-lh: 1.22;    /* otsikon riviväli — säädä tätä makusi mukaan */
}

/* Otsikon riviväli ja pieni hengitysrako footerin yläpuolelle */
.kt-card__title{
  line-height: var(--kt-title-lh);
  margin: .35rem 0 .35rem;   /* aiemmin bottom oli 0 → lisätään “hengitys” */
}

/* Footerin yläpehmennys (voi olla 0–.5rem) */
.kt-card__footer{
  padding-top: .25rem;       /* tiivis mutta näkyvä rako */
}

/* Firefox-fallback: clampin max-korkeus vastaa otsikon riviväliä */
@supports not (-webkit-line-clamp: 1){
  .kt-card__title.line-clamp-3{
    max-height: calc(3 * var(--kt-title-lh) * 1em);
  }
}

/* Tiivistä päiväys ↔ organisaatio -väliä */
:root{
  --kt-meta-lh: 1.12;      /* riviväli nimenomaan meta-riveille */
}

.kt-card__date,
.kt-card__org{
  line-height: var(--kt-meta-lh);
}

/* pienennä pystymarginaaleja */
.kt-card__date{ margin: .15rem 0 0; }  /* oli .35rem → tiiviimpi */
.kt-card__org { margin-top: .12rem; }  /* heti päiväyksen jälkeen tiukemmin */