/* ============================================================
   КАТАЛОГ РАБОТ — ОБЩАЯ ЧАСТЬ

   Разметка каталога на всех страницах услуг одна и та же:
   .c1cat__row с тремя частями — знак с номером, суть, состав.
   А раскладка у каждой страницы своя, и живёт она в отдельном
   файле cat-*.css, который подключается следом (см. build.py).

   Здесь лежит то, что общее: слот под предмет, номер, название,
   подзаголовок и список. Правишь типографику каталога — правишь
   тут, один раз на все страницы. Правишь раскладку — в файле
   своей страницы.

   Решение от 03.09.2026: каталоги на страницах должны отличаться
   друг от друга, но оставаться плитками. Строчная раскладка,
   которая была здесь до этого, уехала в cat-rows.css.
   ============================================================ */
/* ---- номер и знак ---- */
.c1cat__mark{
  display:flex;
  flex-direction:column;
  gap:clamp(8px, .9vw, 14px);
}

.c1cat__num{
  font-family:var(--font);
  font-variant-numeric:tabular-nums;
  font-size:clamp(13px, .95vw, 14px);
  font-weight:600;
  letter-spacing:.1em;
  color:var(--accent-1);
}

/* Слот под предмет. Пока внутри нет <img>, wireframe.js рисует каркас;
   положите картинку — он выключится сам. */
.c1cat__art{
  position:relative;
  width:100%;
  max-width:170px;
  aspect-ratio:1 / 1;
}
.c1cat__art canvas,
.c1cat__art img{
  width:100%; height:100%;
  display:block;
  object-fit:contain;
}
/* Подсветка под каркасом — та же, что у карточек услуг, но своя,
   потому что .svc__art здесь не используется. */
.c1cat__art:not(:has(img))::before{
  content:'';
  position:absolute;
  left:50%; bottom:6%;
  width:86%; height:42%;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse at center,
    rgba(var(--accent-rgb),.16) 0%, rgba(var(--accent-rgb),.07) 42%, transparent 72%);
}

/* ---- средняя колонка: название и суть ---- */
.c1cat__name{
  font-family:var(--font-display);
  font-size:clamp(20px, 1.65vw, 28px);
  font-weight:640;
  line-height:1.16;
  letter-spacing:-.01em;
  margin:0 0 .5em;
}
.c1cat__name em{ font-style:normal; color:var(--accent-bright, var(--accent-1)); }

.c1cat__sub{
  font-size:clamp(14px, 1.02vw, 16px);
  line-height:1.55;
  color:var(--fg-lead);
  margin:0 0 clamp(14px, 1.3vw, 22px);
}

/* ---- правая колонка: что входит ---- */
.c1cat__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.62em;
}
.c1cat__list li{
  position:relative;
  padding-left:1.15em;
  font-size:clamp(13.5px, .98vw, 15.5px);
  line-height:1.5;
  color:var(--fg-lead);
}
.c1cat__list li::before{
  content:'';
  position:absolute;
  left:0; top:.62em;
  width:.55em; height:1px;
  background:var(--accent-1);
}

@media (prefers-reduced-motion: reduce){
  .c1cat__row{ transition:none; }
}