/* Портфолио на главной: карточки кейсов, лента «Нам доверяют», логотипы на карте.
   Данные собираются из папки portfolio/ (см. CLAUDE.md). */

/* карточки кейсов: превью на всю плашку; если превью нет — логотип на белом */
.ccard__media img { left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.ccard__media.is-logo { background: #fff; }
.ccard__media.is-logo img { left: 15%; top: 12%; width: 70%; height: 56%; object-fit: contain; }
.ccard:hover .ccard__media.is-logo img { transform: scale(1.06); }
.ccard__tag { padding: 4px 8px; }
.ccard__city {
  position: absolute; right: 12px; top: 12px; padding: 4px 8px; border-radius: var(--r-sm);
  background: rgba(14, 22, 60, 0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  font: 500 12px/16px var(--f-inter); color: #fff; white-space: nowrap;
}
.ccard__desc { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }

/* вместо 30 точек — счётчик «01 / 30» */
.controls__count { font: 500 15px/20px var(--f-inter); color: rgba(255, 255, 255, 0.7); font-variant-numeric: tabular-nums; }
.controls__count b { font-weight: 600; color: #fff; }

/* «Нам доверяют»: плитка в стиле прежних логотипов из макета (белая, синяя рамка) */
.ptile {
  width: 220px; height: 114px; flex: none; display: grid; place-items: center; padding: 18px 26px;
  background: #fff; border: 2px solid #4A78F0; border-radius: 14px;
}
.ptile img { max-width: 100%; max-height: 74px; width: auto; height: auto; object-fit: contain; }
@media (max-width: 767px) {
  .ptile { width: 160px; height: 83px; padding: 12px 18px; }
  .ptile img { max-height: 52px; }
}

/* карта: настоящие логотипы крупнее значков-заглушек */
.geo-logo img { width: 64%; height: 64%; }

/* длинное название кейса занимает две строки — описание на строку короче, чтобы текст не вылезал за плашку */
.ccard--long .ccard__desc { -webkit-line-clamp: 2; }
/* жёлтый логотип «Авоськи» читается только на тёмном */
.ptile--dark { background: #2B2B2B; }
/* на телефоне картинка кейса растягивается на всю плашку — логотипу оставляем поля */
@media (max-width: 767px) { .ccard__media.is-logo img { padding: 12% 15%; box-sizing: border-box; } }