/* Контейнер карточек */
.cta-rows {
  display:flex;
  flex-direction:column;
  gap:1rem
}

/* Ссылка-карточка */
.cta-link{
  display:flex; align-items:stretch; gap:1rem;
  padding:1rem 1.25rem;
  border:1px solid #e1e4e8; border-radius:12px;
  background:#fff; color:inherit; text-decoration:none;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .05s ease;
}

.cta-link:hover{background:#f6f8fa; border-color:#d0d7de}
.cta-link:active{transform:translateY(1px)}
.cta-link:focus-visible{outline:3px solid rgba(9,105,218,.35); outline-offset:2px}

/* 20% иконка + 80% текст */
.cta-col{display:flex}
.cta-ico{flex:0 0 20%; justify-content:center; align-items:center}
.cta-text{flex:1 1 80%; display:block}

/* Иконки — аккуратнее, меняют цвет на ховере */
.cta-ico svg{
  width:56px; height:56px;
  color:#6e7781;                /* нейтральный по умолчанию */
  transition:transform .15s ease, color .15s ease, opacity .15s ease;
  opacity:.95;
}
.cta-link:hover .cta-ico svg{transform:scale(1.04); opacity:1}

/* Персональные цвета при ховере */
.cta-link.is-z:hover .cta-ico svg{color:#8250df}   /* синий (обзор) */
.cta-link.is-q:hover .cta-ico svg{color:#8250df}   /* зелёный (установка) */

/* Типографика: «заголовок» впаян в текст */
.cta-desc{display:block; margin:0; line-height:1.45}
.cta-lead{font-weight:600}

/* Мобилка */
@media (max-width:768px){
  .cta-link{flex-direction:column; gap:.75rem}
  .cta-ico, .cta-text{flex:0 0 auto}
}