/* === Карточка (элемент Image) === */
.t-card, .t-card .tn-atom{
  border-radius:32px;          /* твой радиус */
  overflow:hidden;             /* чтобы зум не вылезал за края */
  display:block;
}
.t-card img{
  width:100%; height:100%;
  object-fit:cover; display:block;
  transition:transform .35s ease;  /* анимация зума */
  will-change:transform;
}

/* === Оверлей === */
/* Оверлей раскрывается снизу, не вылезая за границы */
.t-card__overlay{
  position:absolute; left:0; top:0; width:100%; height:100%;
  background:rgba(20,20,20,.40);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-radius:32px;
  opacity:0;
  clip-path: inset(100% 0 0 0 round 32px);   /* спрятан снизу */
  transition: opacity .35s ease, clip-path .35s ease;
  pointer-events:none;
}
.t-card:hover ~ .t-card__overlay{
  opacity:1;
  clip-path: inset(0 0 0 0 round 32px);      /* раскрыт полностью */
}


/* === Текст поверх === */
.t-card__text{
  /* позицию задаёшь в Zero Block (снизу слева). Здесь — только анимация */
  color:#fff;
  opacity:0; transform:translateY(20px);
  transition:opacity .35s ease, transform .35s ease;
  pointer-events:none;
}

/* === Hover-состояние === */
.t-card:hover img{ transform:scale(1.05); }     /* зум картинки */

.t-card:hover ~ .t-card__overlay,
.t-card:hover ~ .t-card__text{
  opacity:1; transform:translateY(0);           /* показать оверлей и текст */
}
