/* ==========================================================
   /modules/kategori/css/13-cards.css  (FULL PRO)
   - Kartlar: .card.k-card (listing card)
   - Görsel: .thumb-wrap / .thumb-img
   - Başlık: .title.clamp-2
   - Meta: .meta / .badge / .price
   ========================================================== */

/* Card */
.kategori-page a.card.k-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-md);

  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-width:0;

  transition:
    transform var(--t-fast) var(--ease),
    box-shadow var(--t) var(--ease),
    border-color var(--t) var(--ease);
}

.kategori-page a.card.k-card:hover{
  transform: translateY(-3px);
  border-color: rgba(37,99,235,.22);
  box-shadow: 0 18px 40px rgba(15,23,42,.12);
}

.kategori-page a.card.k-card:active{
  transform: translateY(-1px);
}

/* Thumb */
.kategori-page .thumb-wrap{
  position:relative;
  background: rgba(15,23,42,.04);
  overflow:hidden;
  aspect-ratio: 4 / 3;
}

@supports not (aspect-ratio: 4 / 3){
  .kategori-page .thumb-wrap{
    height:0;
    padding-top: 75%;
  }
  .kategori-page .thumb-wrap > :is(img,.thumb-img.placeholder){
    position:absolute;
    inset:0;
  }
}

/* Image */
.kategori-page .thumb-img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.001);
  transition: transform var(--t) var(--ease), filter var(--t) var(--ease);
}

.kategori-page a.card.k-card:hover .thumb-img{
  transform: scale(1.03);
  filter: saturate(1.02);
}

/* Placeholder */
.kategori-page .thumb-img.placeholder{
  width:100%;
  height:100%;
  background:
    radial-gradient(circle at 30% 30%, rgba(37,99,235,.12), transparent 40%),
    radial-gradient(circle at 70% 60%, rgba(15,23,42,.08), transparent 45%),
    linear-gradient(180deg, rgba(15,23,42,.06), rgba(15,23,42,.02));
}

/* Body */
.kategori-page .body{
  padding: var(--s4);
  display:grid;
  gap: var(--s2);
  min-width:0;
}

/* Title */
.kategori-page .title{
  margin:0;
  font-weight: 1000;
  letter-spacing: -0.02em;
  line-height: 1.18;
  color: var(--text);
  min-width:0;
}

/* Clamp (Safari/Chrome) */
.kategori-page .clamp-2{
  display:-webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow:hidden;
}
@supports not (-webkit-line-clamp: 2){
  .kategori-page .clamp-2{
    max-height: calc(1.18em * 2.2);
    overflow:hidden;
  }
}

/* Meta row */
.kategori-page .meta{
  display:flex;
  align-items:center;
  gap: var(--s2);
  flex-wrap:wrap;
  min-width:0;
}

/* Badges (brand/model) */
.kategori-page .badge{
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  border-radius: 999px;

  padding: 5px 10px;
  font-weight: 900;
  font-size: .85rem;

  max-width:100%;
  overflow-wrap:anywhere;
}

/* Price */
.kategori-page .price{
  margin-left:auto;

  font-weight: 1000;
  letter-spacing: -0.01em;

  color: var(--text);
  white-space: nowrap;

  background: rgba(37,99,235,.08);
  border: 1px solid rgba(37,99,235,.18);
  border-radius: 999px;

  padding: 6px 10px;
}

/* Focus (kart tab ile seçilince) */
.kategori-page a.card.k-card:focus-visible{
  outline:none;
  box-shadow: var(--focus), 0 18px 40px rgba(15,23,42,.12);
  border-color: rgba(37,99,235,.35);
}