/* Cartes catégories du design 2026 : chip teintée + forme
   abstraite colorée, titre Bitter, lien orange. */

.tk-categories__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 100%;
  background: var(--tk-surface, #fff);
  border: 1px solid var(--tk-border, #e8e2d8);
  border-radius: var(--tk-radius-lg, 14px);
  padding: 20px;
  text-decoration: none;
  transition: box-shadow var(--tk-transition-base), transform var(--tk-transition-base);
}

.tk-categories__card:hover {
  box-shadow: var(--tk-shadow-md);
  transform: translateY(-2px);
}

.tk-categories__chip {
  width: 38px;
  height: 38px;
  border-radius: var(--tk-radius-md, 10px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.tk-categories__chip--orange {
  background: var(--tk-orange-tint, #fdebd2);
}

.tk-categories__chip--blue {
  background: var(--tk-blue-tint, #e2edf4);
}

.tk-categories__chip--olive {
  background: var(--tk-green-tint, #eef0d9);
}

.tk-categories__chip--stone {
  background: #ece8e1;
}

.tk-categories__shape {
  width: 14px;
  height: 14px;
}

.tk-categories__shape--square {
  border-radius: 4px;
}

.tk-categories__shape--circle {
  border-radius: 50%;
}

.tk-categories__shape--diamond {
  border-radius: 3px;
  transform: rotate(45deg);
}

.tk-categories__shape--drop {
  border-radius: 4px 4px 10px 10px;
}

.tk-categories__shape--orange {
  background: var(--tk-orange, #ee8b00);
}

.tk-categories__shape--blue {
  background: var(--tk-blue-light, #6f9fba);
}

.tk-categories__shape--olive {
  background: var(--tk-green, #a2b029);
}

.tk-categories__shape--stone {
  background: var(--tk-gray-500, #8b8377);
}

.tk-categories__title {
  font-family: var(--tk-font-heading);
  font-weight: var(--tk-font-weight-bold, 700);
  font-size: 1.0625rem;
  color: var(--tk-gray-900, #26221f);
  margin-top: 12px;
}

.tk-categories__desc {
  font-size: 0.84375rem;
  color: var(--tk-gray-600, #7c7468);
  margin-top: 3px;
}

.tk-categories__cta {
  font-size: 0.78125rem;
  font-weight: var(--tk-font-weight-bold, 700);
  color: var(--tk-orange-dark, #c26f00);
  margin-top: 10px;
}
