/* ============================================================
   Миграция статей vista76.ru/news -> Tilda (проект 32683009)
   Стили-порт оригинального шаблона visc_common, scoped под .vst-body.
   Не редактировать вручную без необходимости: генерируется migration/assemble_css.py
   ============================================================ */

.vst-body {
  font-family: 'Roboto', Arial, sans-serif;
  color: #323232;
  font-size: 1rem;
  line-height: 1.49;
  font-weight: 500;
  text-align: left;
}
.vst-body p {
  margin: 0 0 1.5625rem;
  font-size: 1rem;
  font-weight: 500;
  line-height: 149%;
}
.vst-body a { color: inherit; text-decoration: inherit; }
.vst-body b, .vst-body strong { font-weight: bolder; }
.vst-body h2 {
  margin: 0 0 1.9375rem;
  font-family: 'Roboto Condensed', 'Roboto', Arial, sans-serif;
  font-size: 2.8125rem;
  font-style: normal;
  font-weight: 700;
  line-height: .95;
  color: #323232;
}
.vst-body h3 {
  margin: 0 0 .9375rem;
  font-family: 'Roboto Condensed', 'Roboto', Arial, sans-serif;
  font-size: 1.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 95%;
  color: #323232;
}
.vst-body img { max-width: 100%; height: auto; }
.vst-body .aligncenter { text-align: center; }
.vst-body .aligncenter img { width: auto; display: inline-block; }

/* Списки с плюсиками (оригинал: ul без класса + mask cross.svg) */
.vst-body ul:not([class]) {
  padding: 0;
  padding-top: .25rem;
  margin: 0 0 4.375rem;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  gap: .625rem;
}
.vst-body ul:not([class]) li {
  color: #323232;
  padding-top: .0625rem;
  padding-left: 1.8125rem;
  font-size: 1rem;
  line-height: 1.49;
  font-weight: 500;
  position: relative;
}
.vst-body ul:not([class]) li:before {
  content: "";
  flex-shrink: 0;
  width: .8125rem;
  height: .8125rem;
  margin-top: .3125rem;
  position: absolute;
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%229%22%20height%3D%229%22%20viewBox%3D%220%200%209%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.16605%200V2.78175H9V6.21816H6.16605V9H2.83395V6.21816H0V2.78175H2.83395V0H6.16605Z%22%20fill%3D%22%2394c8c6%22%2F%3E%0A%3C%2Fsvg%3E");
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
}

/* Нумерованные списки (счётчики steps) */
.vst-body ol {
  padding: 0;
  counter-reset: steps;
  flex-direction: column;
  gap: .625rem;
  margin: 0 0 2.5rem;
  list-style-type: none;
  display: flex;
}
.vst-body ol li {
  font-weight: 500;
  counter-increment: steps;
  color: #323232;
  align-items: flex-start;
  gap: 1rem;
  padding-top: .1875rem;
  font-size: 1rem;
  line-height: 1.49;
  display: flex;
}
.vst-body ol li:before {
  content: counter(steps);
  color: #75959e;
  background: #eef6f5;
  border-radius: .3125rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: flex-start;
  width: 1.75rem;
  height: 1.75rem;
  margin-top: -.125rem;
  padding-top: .25rem;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1.375rem;
  font-weight: 700;
  line-height: .95;
  display: flex;
  overflow: hidden;
}

/* Цитаты */
.vst-body .quote {
  background: url("__B1_URL__") 0 0 / cover no-repeat;
  border-radius: 1.25rem;
  margin-bottom: 1.875rem;
  padding: 1.25rem;
  overflow: hidden;
}
.vst-body .quote__text {
  color: #75959e;
  margin-bottom: 0;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.49;
}
.vst-body .quote_mt { margin-top: 1.875rem; }

/* Медиа-блок (портрет автора и т.п.) */
.vst-body .media { display: block; }
.vst-body .media__body { flex-direction: column; flex-shrink: 0; margin-bottom: 0; display: block; }

/* Мета-строка статьи (тип + дата), как на старом сайте */
.vst-body .news-detail__meta {
  color: #75959e;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1.25rem;
  line-height: 1.4;
  display: flex;
}


/* Таблицы как на старом сайте */
.vst-body table {
  width: 100%;
  text-indent: 0;
  border-collapse: collapse;
  margin-bottom: 1.875rem;
}
.vst-body table th {
  color: #fff;
  text-align: left;
  vertical-align: middle;
  background: #75959e;
  padding: 1.625rem 2rem;
  font-family: 'Roboto Condensed', 'Roboto', Arial, sans-serif;
  font-weight: 700;
  font-size: 1.75rem;
  line-height: .95;
}
.vst-body table th:first-child { border-radius: 1.25rem 0 0; }
.vst-body table th:last-child { border-radius: 0 1.25rem 0 0; }
.vst-body table td {
  color: #323232;
  vertical-align: top;
  padding: 1.75rem 2rem;
  font-size: 1.375rem;
  line-height: 1.32;
  font-weight: 500;
}
.vst-body tbody tr:nth-child(odd) td { background: #eef6f5; }
.vst-body tbody tr:last-child td:first-child { border-radius: 0 0 0 1.25rem; }
.vst-body tbody tr:last-child td:last-child { border-radius: 0 0 0 1.25rem; }

/* Ширина колонки поста как на старом сайте (~917px); контейнер _snippet = только страницы постов */
.t-cms__page-container_snippet .t-cms__page-wrapper,
.t-cms__page-container_snippet .t-cms__page_tile,
.t-cms__page-container_snippet .t-cms__page__cell_txt {
  width: 920px;
  max-width: 100%;
}

/* Адаптив как на старом сайте */
@media (width <= 900px) {
  .vst-body ul:not([class]), .vst-body ol { margin-bottom: 1.25rem; }
  .vst-body p { font-size: .875rem; }
  .vst-body h2 { margin-bottom: .625rem; font-size: 1.75rem; }
  .vst-body h3 { margin-bottom: .625rem; font-size: 1.5rem; }
}

/* --- inline styles: inline_5-prichin-sdelat-lazernuyu-korrektsiyu-zreniya-kommentariy-oftalmokhirurga-kliniki-vista.css --- */

    /* Общий контейнер */
    .vista-expert-block {
      display: flex;
      flex-direction: row; /* На десктопе: в ряд */
      align-items: flex-start;
      gap: 30px; /* Расстояние между карточкой и текстом */
      margin: 30px 0;
      font-family: 'Roboto', Arial, sans-serif;
      max-width: 100%;
    }

    /* Блок с текстом (справа на десктопе) */
    .vista-expert-text {
      flex: 0 0 320px; /*  */
      font-size: 16px;
      line-height: 1.6;
      color: #4A5568;
      padding-top: 10px; /* Небольшой отступ сверху для выравнивания с карточкой */
    }
    
    .vista-expert-text p {
      margin: 0 0 15px 0;
    }
    
    .vista-expert-text strong {
      color: #2C3E50;
      font-weight: 700;
    }

    /* Контейнер карточки (слева на десктопе) */
    .vista-doctor-card-vertical {
      flex: 0 0 320px; /* Фиксированная ширина карточки */
      width: 320px;
      margin: 0; /* Убираем внешние отступы, так как они управляются родителем */
      padding: 0;
      background: #fff;
      border: 1px solid #E2E8E9;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 4px 12px rgba(0,0,0,0.05);
      box-sizing: border-box;
      display: block; /* Сбрасываем inline-block из предыдущей версии */
      vertical-align: top;
    }

    /* --- Стили самой карточки (без изменений, кроме обёртки) --- */
    .vista-doctor-card-vertical .medic {
      display: flex !important;
      flex-direction: column !important;
      width: 100%;
      margin: 0 !important;
      padding: 0 !important;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
    }
    .vista-doctor-card-vertical .medic__photo {
      width: 100% !important;
      height: auto;
      position: relative;
      display: block;
      text-decoration: none !important;
      margin: 0 !important;
      padding: 0 !important;
    }
    .vista-doctor-card-vertical .medic__img {
      width: 100% !important;
      height: auto !important;
      object-fit: cover;
      display: block;
      aspect-ratio: 1 / 1;
    }
    .vista-doctor-card-vertical .medic__tenure {
      position: absolute;
      bottom: 12px;
      left: 12px;
      background: rgba(255, 255, 255, 0.95);
      padding: 6px 10px;
      border-radius: 6px;
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 11px;
      font-weight: 700;
      color: #2C3E50;
      white-space: nowrap;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }
    .vista-doctor-card-vertical .medic__premium {
      width: 14px;
      height: 14px;
      color: #7BA0A6;
    }
    .vista-doctor-card-vertical .medic__info {
      width: 100%;
      padding: 20px !important;
      margin: 0 !important;
      display: flex !important;
      flex-direction: column !important;
      box-sizing: border-box;
      position: relative;
    }
    .vista-doctor-card-vertical .medic__rating {
      position: absolute;
      top: 20px;
      right: 20px;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      background: #7BA0A6;
      color: #fff;
      padding: 4px 8px;
      border-radius: 4px;
      font-size: 13px;
      font-weight: 700;
      z-index: 2;
    }
    .vista-doctor-card-vertical .medic__star {
      width: 14px;
      height: 14px;
      filter: brightness(0) invert(1);
    }
    .vista-doctor-card-vertical .medic__eq {
      height: auto !important;
      margin-bottom: 15px;
      padding-right: 40px;
    }
    .vista-doctor-card-vertical .medic__name {
      display: block;
      font-family: 'Roboto Condensed', Arial, sans-serif;
      font-size: 20px;
      font-weight: 700;
      line-height: 1.2;
      color: #2C3E50;
      text-decoration: none !important;
      margin-bottom: 8px;
    }
    .vista-doctor-card-vertical .medic__name:hover {
      color: #7BA0A6;
    }
    .vista-doctor-card-vertical .medic__spec {
      font-size: 13px;
      line-height: 1.4;
      color: #4A5568;
      margin: 0 !important;
      padding: 0 !important;
    }
    .vista-doctor-card-vertical .medic__price {
      margin-bottom: 20px;
    }
    .vista-doctor-card-vertical .medic__caption {
      font-size: 12px;
      color: #718096;
      margin: 0 0 4px 0 !important;
      padding: 0 !important;
      font-weight: 500;
    }
    .vista-doctor-card-vertical .medic__cost {
      font-size: 22px;
      font-weight: 700;
      color: #7BA0A6;
      margin: 0 !important;
      padding: 0 !important;
    }
    .vista-doctor-card-vertical .medic__actions {
      display: flex !important;
      gap: 10px;
      margin-top: auto;
    }
    .vista-doctor-card-vertical .medic__visit,
    .vista-doctor-card-vertical .medic__book {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 12px 10px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 600;
      text-decoration: none;
      cursor: pointer;
      transition: all 0.2s ease;
      border: none;
      font-family: inherit;
      box-sizing: border-box;
    }
    .vista-doctor-card-vertical .medic__visit {
      background: #F0F4F5;
      color: #2C3E50;
      border: 1px solid #E2E8E9;
    }
    .vista-doctor-card-vertical .medic__visit:hover {
      background: #E2E8E9;
    }
    .vista-doctor-card-vertical .medic__book {
      background: #7BA0A6;
      color: #fff;
    }
    .vista-doctor-card-vertical .medic__book:hover {
      background: #6A8E94;
    }
    .vista-doctor-card-vertical .medic__arr {
      width: 14px;
      height: 14px;
    }
    .vista-doctor-card-vertical .medic__arr_white {
      filter: brightness(0) invert(1);
    }
    .vista-doctor-card-vertical .medic__visit .medic__arr {
        filter: brightness(0) saturate(100%) invert(23%) sepia(13%) saturate(1352%) hue-rotate(169deg) brightness(96%) contrast(87%);
    }

    /* --- АДАПТИВНОСТЬ --- */
    @media (max-width: 768px) {
      .vista-expert-block {
        flex-direction: column-reverse; /* Текст сверху, карточка снизу */
        gap: 20px;
      }
      
      .vista-doctor-card-vertical {
        flex: 0 0 auto;
        width: 100%; /* На мобильном карточка на всю ширину */
        max-width: 320px; /* Но не шире 320px */
        margin: 0 auto; /* Центрируем карточку на мобильном */
      }
      
      .vista-expert-text {
        padding-top: 0;
        width: 100%;
      }
    }
  

    .vista-faq-wrapper {
      /* Наследуем шрифты сайта, но явно указываем Roboto Condensed для вопросов */
      font-family: 'Roboto', 'Arial', sans-serif;
      max-width: 800px;
      /* Отступ слева 50px для десктопа */
      margin: 20px 0 20px 50px; 
      padding: 0;
      color: #333333;
      line-height: 1.6;
    }
    
    .vista-faq-item {
      border-bottom: 1px solid #E2E8E9;
    }
    
    /* Стили для H3, соответствующие дизайн-системе сайта */
    .vista-faq-question {
      margin: 0;
      padding: 0;
      font-family: 'Roboto Condensed', 'Arial', sans-serif;
      font-size: 1.75rem; /* 28px */
      font-weight: 700;
      line-height: 95%;
      font-style: normal;
    }

    .vista-faq-question-link {
      display: block;
      width: 100%;
      text-align: left;
      background: transparent;
      border: none;
      padding: 24px 40px 24px 0;
      color: #2C3E50;
      font-family: inherit;
      font-size: inherit;
      font-weight: inherit;
      line-height: inherit;
      cursor: pointer;
      position: relative;
      outline: none;
      text-decoration: none;
      transition: color 0.2s ease;
    }
    
    .vista-faq-question-link::after {
      content: '+';
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      font-size: 32px; /* Увеличен под крупный заголовок */
      font-weight: 300;
      color: #7BA0A6;
      line-height: 1;
      transition: transform 0.3s ease;
    }
    
    .vista-faq-item.active .vista-faq-question-link::after {
      content: '−';
    }
    
    .vista-faq-answer {
      height: 0;
      overflow: hidden;
      transition: height 0.3s ease-out;
    }
    
    .vista-faq-answer-inner {
      padding-bottom: 24px;
    }
    
    .vista-faq-answer p {
      margin: 0 0 10px 0;
      padding: 0;
      font-size: 16px;
      line-height: 1.6;
      color: #4A5568;
      font-weight: 400;
      font-family: 'Roboto', 'Arial', sans-serif;
    }
    
    .vista-faq-answer p:last-child {
      margin-bottom: 0;
    }
    
    .vista-faq-question-link:hover {
      color: #7BA0A6;
    }

    /* Адаптация под мобильные */
    @media (max-width: 768px) {
      .vista-faq-wrapper {
        margin-left: 0; 
      }
      
      .vista-faq-question {
        font-size: 1.4rem; /* Чуть меньше на мобильных */
        line-height: 110%;
      }

      .vista-faq-question-link {
        padding: 20px 32px 20px 0;
      }
      
      .vista-faq-question-link::after {
        font-size: 28px;
      }
      
      .vista-faq-answer p {
        font-size: 15px;
      }
    }
  
/* --- inline styles: inline_korrektsiya-zreniya-v-rassrochku-uslugi-nashey-kliniki-dostupny-po-karte-khalva.css --- */

    /* Стили для содержания */
    .vista-toc {
      margin: 30px 0;
      padding: 20px;
      background: #F0F4F5; /* Светлый фон для выделения */
      border-radius: 8px;
      border-left: 4px solid #7BA0A6; /* Фирменная полоса слева */
    }
    
    .vista-toc-title {
      font-family: 'Roboto Condensed', Arial, sans-serif;
      font-weight: 700;
      font-size: 18px;
      color: #2C3E50;
      margin-bottom: 15px;
      display: block;
    }

    .vista-toc-list {
      list-style: none; /* Убираем маркеры */
      padding: 0;
      margin: 0;
      columns: 2; /* Две колонки на десктопе для компактности */
      column-gap: 30px;
    }

    .vista-toc-item {
      margin-bottom: 10px;
      break-inside: avoid; /* Запрещаем разрыв пункта между колонками */
    }

    .vista-toc-link {
      color: #7BA0A6; /* Фирменный цвет текста */
      text-decoration: none;
      border-bottom: 1px dashed #7BA0A6; /* Пунктирное подчёркивание */
      transition: all 0.2s ease;
      font-size: 15px;
      line-height: 1.4;
      display: inline-block;
    }

    .vista-toc-link:hover {
      color: #5A8A90;
      border-bottom-style: solid; /* При наведении пунктир становится сплошным */
    }

    /* Адаптив для содержания */
    @media (max-width: 768px) {
      .vista-toc-list {
        columns: 1; /* Одна колонка на мобильных */
      }
    }

    /* --- СТИЛИ FAQ (Минимально необходимые для JS) --- */
    .vista-faq-wrapper-halva {
      margin: 30px 0;
      border-top: 1px solid #E2E8E9;
    }
    
    .vista-faq-item {
      border-bottom: 1px solid #E2E8E9;
    }
    
    .vista-faq-question {
      margin: 0;
      padding: 0;
      font-family: 'Roboto Condensed', Arial, sans-serif;
      font-weight: 700;
      line-height: 1.2;
    }

    .vista-faq-question-link {
      display: block;
      padding: 20px 40px 20px 0;
      color: inherit;
      text-decoration: none;
      position: relative;
      cursor: pointer;
      transition: color 0.2s;
    }
    
    .vista-faq-question-link:hover {
      color: #7BA0A6;
    }
    
    .vista-faq-question-link::after {
      content: '+';
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      font-size: 28px;
      font-weight: 300;
      color: #7BA0A6;
      line-height: 1;
    }
    
    .vista-faq-item.active .vista-faq-question-link::after {
      content: '−';
    }
    
    .vista-faq-answer {
      height: 0;
      overflow: hidden;
      transition: height 0.3s ease-out;
    }
    
    .vista-faq-answer-inner {
      padding: 0 0 20px 0;
    }
    
    .vista-faq-answer-inner p {
      margin: 0;
    }

    @media (max-width: 768px) {
      .vista-faq-question-link { padding: 16px 32px 16px 0; }
      .vista-faq-question-link::after { font-size: 24px; }
    }
  

  .vista-steps-grid-shadow {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Всегда 2 в ряд на десктопе */
    gap: 24px;
    margin: 30px 0;
    list-style: none;
    padding: 0;
  }

  .vista-step-card-shadow {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06); /* Мягкая тень вместо границ */
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    overflow: hidden;
  }
  
  /* Декоративный элемент вместо полоски - легкий градиент сверху */
  .vista-step-card-shadow::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #7BA0A6 0%, #A8C6CA 100%);
    opacity: 0.5;
  }

  .vista-step-header {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .vista-step-num-text {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #7BA0A6; /* Фирменный цвет цифры */
    line-height: 1;
  }

  .vista-step-card-shadow h3 {
    margin: 0;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: #2C3E50;
  }

  .vista-step-card-shadow p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #4A5568;
  }

  @media (max-width: 768px) {
    .vista-steps-grid-shadow {
      grid-template-columns: 1fr;
    }
  }
