/* card.css — kako-sam-nasla-vreme-za-sebe */
/* Theme: Zen Reset — Spa & Wellness Editorial */

.card--zen-reset {
  background: #FAF8F5;
  border: 1px solid #C4D4C0;
  border-radius: 2px;
  overflow: hidden;
  break-inside: avoid;
  position: relative;
  transition: border-color 0.3s ease;
}

.card--zen-reset:hover {
  border-color: #3A6B55;
}

.card--zen-reset .card__img-wrap {
  overflow: hidden;
  aspect-ratio: 4/3;
  position: relative;
}

.card--zen-reset .card__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease, filter 0.5s ease;
  filter: saturate(0.9);
}

.card--zen-reset:hover .card__img-wrap img {
  transform: scale(1.04);
  filter: saturate(1.05);
}

.card--zen-reset .card__body {
  padding: 20px 22px 22px;
  background: #FAF8F5;
}

.card--zen-reset .card__kicker {
  font-family: 'Major Mono Display', monospace;
  font-size: 9px;
  letter-spacing: 0.3em;
  color: #8FAF8A;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.card--zen-reset .card__title {
  font-family: 'Arvo', serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: #2D2D2D;
  line-height: 1.35;
  margin-bottom: 10px;
}

.card--zen-reset .card__excerpt {
  font-family: 'Signika', sans-serif;
  font-weight: 300;
  font-size: 0.85rem;
  color: #555;
  line-height: 1.65;
  margin-bottom: 16px;
}

.card--zen-reset .card__meta {
  font-family: 'Major Mono Display', monospace;
  font-size: 9px;
  letter-spacing: 0.18em;
  color: #aaa;
  border-top: 1px solid #C4D4C0;
  padding-top: 12px;
}

.card--zen-reset .card__accent-line {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #C4D4C0, #3A6B55, #D4A864);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.card--zen-reset:hover .card__accent-line {
  transform: scaleX(1);
}

/* ── structural rules for draft-batch ── */
.card--zen-reset .card__img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s ease, filter .5s ease;
}
.card--zen-reset:is(:hover,.pulse) .card__img {
  transform:scale(1.05);
}
.card--zen-reset .card__badge {
  position:absolute; bottom:12px; right:12px; z-index:2;
  font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  padding:4px 12px; border-radius:50px;
  background:#FAF8F5; color:#aaa;
}
.card--zen-reset .card__year {
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  display:block; margin-bottom:5px; color:#aaa;
}
.card--zen-reset .card__desc {
  font-size:clamp(12px,.9vw,13px); line-height:1.65;
  color:#555;
}
