/* =====================================================
   ЭКО-ЕЛИ — стили текста-описания категорий (было: ВЕЛОАС.РФ)
   OpenCart 3.0.3.8 (rs.2), тема base-ui
   Файл: catalog/view/theme/base-ui/assets/css/veloas-category.css
   Скоуп: .vcat-desc
   Цвета из гайдлайна: тёмный изумрудный #045837, пастельный #76bc71,
   фон-хвоя #0c231b, светлые #edf3ef / #dce5df, золото сайта #c6aa68
   ===================================================== */

/* 1. ОБЁРТКА — карточка под пагинацией */
.vcat-desc {
  font-family: 'Inter', sans-serif;
  color: #2b332e;
  margin: 40px 0 0;
  padding: 44px 48px;
  background: #fff;
  border-radius: 16px;
  border: 1px solid #dce5df;
}

/* 2. ТИПОГРАФИКА */
.vcat-desc h2 {
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.3px;
  color: #0c231b;
  margin: 40px 0 14px;
  padding-left: 14px;
  border-left: 4px solid #c6aa68;
}
.vcat-desc-body > h2:first-child { margin-top: 0; }

.vcat-desc h3 {
  font-size: clamp(16px, 1.8vw, 18px);
  font-weight: 700;
  line-height: 1.35;
  color: #045837;
  margin: 26px 0 8px;
}
.vcat-desc h4, .vcat-desc h5, .vcat-desc h6 {
  font-size: 15px; font-weight: 700; line-height: 1.4; color: #0c231b; margin: 20px 0 8px;
}

.vcat-desc p {
  font-size: 15px;
  line-height: 1.75;
  color: #3d4741;
  margin: 0 0 14px;
  text-align: left;            /* без justify: не будет «рек» из пробелов */
}
.vcat-desc p:last-child { margin-bottom: 0; }

/* Первый абзац — главный ответ (answer-first): чуть крупнее */
.vcat-desc-body > h2:first-child + p {
  font-size: 16px;
  color: #2b332e;
}

.vcat-desc a {
  color: #045837;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(4, 88, 55, .35);
  text-underline-offset: 3px;
  transition: color .2s, text-decoration-color .2s;
}
.vcat-desc a:hover { color: #0c231b; text-decoration-color: #c6aa68; }
.vcat-desc a[href^="tel:"] { white-space: nowrap; }

.vcat-desc strong, .vcat-desc b { color: #0c231b; font-weight: 700; }
.vcat-desc em, .vcat-desc i { font-style: italic; }

/* Списки */
.vcat-desc ul, .vcat-desc ol { margin: 0 0 16px; padding-left: 0; list-style: none; }
.vcat-desc ul li, .vcat-desc ol li {
  font-size: 15px;
  line-height: 1.7;
  color: #3d4741;
  margin-bottom: 8px;
  padding-left: 22px;
  position: relative;
}
.vcat-desc ul li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 10px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #76bc71;
}
.vcat-desc ol { counter-reset: vcat-counter; }
.vcat-desc ol li::before {
  content: counter(vcat-counter) '.';
  counter-increment: vcat-counter;
  position: absolute; left: 0; top: 0;
  color: #045837; font-weight: 700; font-size: 14px;
}

.vcat-desc hr { border: none; border-top: 1px solid #dce5df; margin: 28px 0; }

/* 3. «ЧИТАТЬ ДАЛЕЕ» — видно заголовок и главный абзац целиком */
.vcat-desc--collapsible .vcat-desc-body {
  max-height: 230px;
  overflow: hidden;
  position: relative;
  transition: max-height .35s ease;
}
.vcat-desc--collapsible .vcat-desc-body::after {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 72px;
  background: linear-gradient(rgba(255,255,255,0), #fff);
  pointer-events: none;
  transition: opacity .3s;
}
.vcat-desc--collapsible.is-open .vcat-desc-body { max-height: 9999px; }
.vcat-desc--collapsible.is-open .vcat-desc-body::after { opacity: 0; }

.vcat-desc-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 10px 18px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #045837;
  background: #edf3ef;
  border: 1px solid #dce5df;
  border-radius: 999px;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.vcat-desc-toggle:hover { background: #045837; border-color: #045837; color: #fff; }
.vcat-desc-toggle svg { width: 14px; height: 14px; transition: transform .3s; flex-shrink: 0; }
.vcat-desc--collapsible.is-open .vcat-desc-toggle svg { transform: rotate(180deg); }
.vcat-desc-toggle.is-hidden { display: none; }

/* 4. АДАПТИВ */
@media (max-width: 860px) {
  .vcat-desc { padding: 30px 24px; }
}
@media (max-width: 560px) {
  .vcat-desc { padding: 22px 16px; border-radius: 12px; margin: 28px 0 0; }
  .vcat-desc h2 { margin-top: 30px; padding-left: 10px; border-left-width: 3px; }
  .vcat-desc p, .vcat-desc li { font-size: 15px; }
}

/* Главная: подзаголовок первого экрана — золотой, крупнее, чем в теме */
.sect-main__desc { color: #c6aa68; font-size: 32px; line-height: 1.3; font-weight: 500; }
@media (max-width: 1440px) { .sect-main__desc { font-size: 26px; } }
@media (max-width: 768px)  { .sect-main__desc { font-size: 20px; } }

/* RuTube в подвале: фирменная буква R вместо значка «play» (19.10.2026) */
.veloas-footer__social[aria-label="rutube"] i::before {
    content: "";
    display: block;
    width: 1.15em;
    height: 1.15em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='20 11 110 110'%3E%3Cpath d='M81.5361 62.9865H42.5386V47.5547H81.5361C83.814 47.5547 85.3979 47.9518 86.1928 48.6451C86.9877 49.3385 87.4801 50.6245 87.4801 52.5031V58.0441C87.4801 60.0234 86.9877 61.3094 86.1928 62.0028C85.3979 62.6961 83.814 62.9925 81.5361 62.9925V62.9865ZM84.2115 33.0059H26V99H42.5386V77.5294H73.0176L87.4801 99H106L90.0546 77.4287C95.9333 76.5575 98.573 74.756 100.75 71.7869C102.927 68.8179 104.019 64.071 104.019 57.7359V52.7876C104.019 49.0303 103.621 46.0613 102.927 43.7857C102.233 41.51 101.047 39.5307 99.362 37.7528C97.5824 36.0698 95.6011 34.8845 93.2223 34.0904C90.8435 33.3971 87.8716 33 84.2115 33V33.0059Z'/%3E%3Ccircle cx='116' cy='23' r='11'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='20 11 110 110'%3E%3Cpath d='M81.5361 62.9865H42.5386V47.5547H81.5361C83.814 47.5547 85.3979 47.9518 86.1928 48.6451C86.9877 49.3385 87.4801 50.6245 87.4801 52.5031V58.0441C87.4801 60.0234 86.9877 61.3094 86.1928 62.0028C85.3979 62.6961 83.814 62.9925 81.5361 62.9925V62.9865ZM84.2115 33.0059H26V99H42.5386V77.5294H73.0176L87.4801 99H106L90.0546 77.4287C95.9333 76.5575 98.573 74.756 100.75 71.7869C102.927 68.8179 104.019 64.071 104.019 57.7359V52.7876C104.019 49.0303 103.621 46.0613 102.927 43.7857C102.233 41.51 101.047 39.5307 99.362 37.7528C97.5824 36.0698 95.6011 34.8845 93.2223 34.0904C90.8435 33.3971 87.8716 33 84.2115 33V33.0059Z'/%3E%3Ccircle cx='116' cy='23' r='11'/%3E%3C/svg%3E") center / contain no-repeat;
}
