/* =========================================================================
   smile-refresh.css — лёгкий «скин» поверх шаблона (2026-08-30).
   Только переопределения. Подключается ПОСЛЕДНИМ; удаление <link> = полный откат.
   Палитра: медицинский синий + свежий зелёный для CTA, мягкие тени, крупный
   вертикальный ритм, шрифт Golos Text.
   ========================================================================= */

:root {
  --brand:        #1a97c7;
  --brand-strong: #127aa3;
  --brand-tint:   #e9f6fb;
  --cta:          #12b886;
  --cta-strong:   #0f9e75;
  --ink:          #16303a;
  --body:         #54646c;
  --muted:        #8a97a0;
  --bg:           #ffffff;
  --bg-tint:      #f2f8fb;
  --line:         #e4edf1;
  --footer:       #0e2630;
  --r:            18px;
  --sh-1: 0 2px 10px rgba(16, 48, 60, .06);
  --sh-2: 0 16px 40px -12px rgba(16, 48, 60, .18);
}

html { scroll-behavior: smooth; }
::selection { background: var(--brand); color: #fff; }

body {
  color: var(--body);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* --- Заголовки --- */
h1, h2, h3, h4, h5,
.h1, .h2, .h3, .h4, .h5 {
  color: var(--ink);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}
.heading-section h2 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); font-weight: 700; }
.heading-section .subheading {
  color: var(--brand);
  letter-spacing: 1.5px;
  font-size: 13px;
  font-weight: 600;
}

a { color: var(--brand); }
a:hover, a:focus { color: var(--brand-strong); }

/* --- Вертикальный ритм секций --- */
.ftco-section { padding: clamp(3rem, 7vw, 5.5rem) 0; }
.bg-light { background: var(--bg-tint) !important; }

/* --- Верхняя строка контактов --- */
.border-bottom { border-color: var(--line) !important; }
.topper .icon {
  background: var(--brand-tint);
  border-color: transparent;
}
.topper .icon span { color: var(--brand); }

/* --- Навигация: светлая, липкая, с тенью при прокрутке --- */
#ftco-navbar,
#ftco-navbar.bg-dark {
  background: #fff !important;
  position: sticky;
  top: 0;
  z-index: 1030;
  border-bottom: 1px solid var(--line);
  transition: box-shadow .25s ease;
}
#ftco-navbar.scrolled,
#ftco-navbar:focus-within { box-shadow: var(--sh-1); }
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link {
  color: var(--ink);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link:hover,
.ftco-navbar-light .navbar-nav > .nav-item.active > .nav-link {
  color: var(--brand);
}
.ftco-navbar-light .navbar-nav > .nav-item.active > .nav-link {
  box-shadow: inset 0 -3px 0 var(--brand);
}
.navbar-toggler {
  color: var(--ink) !important;
  border: 1px solid var(--line);
  border-radius: 10px;
}
@media (max-width: 991.98px) {
  #ftco-navbar .navbar-collapse { background: #fff; }
  .ftco-navbar-light .navbar-nav > .nav-item > .nav-link { color: var(--ink); }
  .ftco-navbar-light .navbar-nav > .nav-item > .nav-link:hover { color: var(--brand); }
}

/* --- Кнопки --- */
.btn {
  padding: .72em 1.7em;
  font-weight: 600;
  letter-spacing: 0;
  transition: background-color .2s ease, border-color .2s ease,
              color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.btn.btn-primary {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus {
  background: var(--brand-strong);
  border-color: var(--brand-strong);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--sh-2) !important;
}
.btn.btn-secondary {
  background: var(--cta);
  border-color: var(--cta);
  color: #fff;
}
.btn.btn-secondary:hover,
.btn.btn-secondary:focus,
.btn.btn-secondary:active {
  background: var(--cta-strong);
  border-color: var(--cta-strong);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--sh-2) !important;
}
.btn:focus-visible { outline: 3px solid var(--brand-tint); outline-offset: 2px; }

/* --- Карточки услуг --- */
.ftco-services .services {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--sh-1);
}
.ftco-services .services:hover {
  transform: translateY(-6px);
  box-shadow: var(--sh-2);
  border-color: transparent;
}
.ftco-services .services .icon {
  background: var(--brand-tint);
  border-color: transparent;
}
.ftco-services .services .media-body h3 { color: var(--ink); font-weight: 600; }
.ftco-services .services .media-body h3 a { color: inherit; }

/* Блок «Наши преимущества» — иконки icomoon помельче, чем крупные flaticon */
.advantages .services .icon span { font-size: 32px; }

/* --- Карточки врачей --- */
.staff {
  border-radius: var(--r);
  box-shadow: var(--sh-1);
  background: #fff;
}
.staff:hover { transform: translateY(-6px); box-shadow: var(--sh-2); }
.staff .text { padding-bottom: 1.75rem; }
.staff .text h3 { color: var(--ink); font-weight: 600; }
.staff .text .position {
  color: var(--brand);
  text-transform: none;
  letter-spacing: .02em;
  font-size: 13px;
}

/* --- Формы --- */
.form-control { border-radius: 12px; border-color: var(--line); }
.form-control:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-tint);
}

/* --- Подвал --- */
.ftco-footer,
.ftco-footer.ftco-bg-dark {
  background: var(--footer);
  border-top: 3px solid var(--brand);
}
.ftco-footer .ftco-heading-2 { color: rgba(255, 255, 255, .92); }
.ftco-footer h3.ftco-heading-2 a { color: rgba(255, 255, 255, .6); }
.block-21 .heading a { color: rgba(255, 255, 255, .9); }
.block-21 .heading a:hover { color: #fff; }

/* --- Картинки в контенте --- */
.blog-img { border-radius: 14px; }

/* --- Уважение к prefers-reduced-motion --- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .btn:hover, .btn:focus,
  .ftco-services .services:hover,
  .staff:hover { transform: none; }
}

/* =========================================================================
   Отзывы и продающие страницы услуг (виниры / брекеты / элайнеры)
   ========================================================================= */

.review-card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--sh-1);
  width: 100%;
  display: flex;
  flex-direction: column;
}
.review-stars { color: #f5a623; letter-spacing: 2px; font-size: 15px; }
.review-text { color: var(--body); margin-bottom: 1rem; flex: 1 1 auto; }
.review-meta { color: var(--ink); font-size: 14px; }
.review-meta .review-date { color: var(--muted); margin-left: .5rem; }

.lp-hero {
  background: linear-gradient(180deg, var(--brand-tint), #fff);
  text-align: center;
}
.lp-kicker {
  color: var(--brand);
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-size: 13px;
  margin-bottom: .75rem;
}
.lp-h1 {
  font-size: clamp(1.9rem, 4.2vw, 2.9rem);
  font-weight: 700;
  margin-bottom: 1rem;
}
.lp-lead {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  color: var(--body);
  max-width: 46rem;
  margin: 0 auto 1rem;
}
.lp-price {
  display: inline-block;
  background: var(--bg);
  border: 1px solid var(--line);
  box-shadow: var(--sh-1);
  border-radius: 999px;
  padding: .5rem 1.25rem;
  font-weight: 600;
  color: var(--ink);
}

.lp-solve {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  width: 100%;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--sh-1);
  color: var(--ink);
}
.lp-solve__mark {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--cta);
  color: #fff;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
}

.lp-step {
  width: 100%;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--sh-1);
}
.lp-step__num {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: .75rem;
}
.lp-step__title { font-size: 17px; font-weight: 600; margin-bottom: .5rem; }

.lp-faq {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--sh-1);
  padding: 1.1rem 1.35rem;
}
.lp-faq__q { font-size: 16px; font-weight: 600; margin-bottom: .35rem; }

.lp-cta { background: var(--brand-tint); }

/* --- Плотнее верх страницы: контактная строка → меню → первый блок --- */
.border-bottom.py-4.py-md-5 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}
#ftco-navbar { padding-top: 0; padding-bottom: 0; }
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link {
  padding-top: .85rem;
  padding-bottom: .85rem;
}
.home-doctors .row.mb-4 { margin-bottom: .75rem !important; }

/* --- Компактная сетка врачей на главной --- */
.home-doctors.ftco-section {
  padding-top: 1.5rem;
  padding-bottom: clamp(2.5rem, 5vw, 3.5rem);
}
.home-doctors .hd-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: var(--ink);
}
.home-doctors .hd-photo {
  display: block;
  width: 108px;
  height: 108px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top center;
  background-color: var(--brand-tint);
  box-shadow: var(--sh-1);
  margin-bottom: .6rem;
  transition: box-shadow .2s ease, transform .2s ease;
}
.home-doctors .hd-card:hover .hd-photo {
  box-shadow: var(--sh-2);
  transform: translateY(-3px);
}
.home-doctors .hd-name { font-weight: 600; font-size: 14px; line-height: 1.25; }
.home-doctors .hd-role { font-size: 12px; color: var(--muted); line-height: 1.3; margin-top: 2px; }
.home-doctors .hd-card:hover .hd-name { color: var(--brand); }
@media (max-width: 575.98px) {
  .home-doctors .hd-photo { width: 92px; height: 92px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-doctors .hd-card:hover .hd-photo { transform: none; }
}

/* =========================================================================
   Освежение текстовых страниц (гнатология / ВНЧС) — обёртка .lp-article
   ========================================================================= */

.lp-article { color: var(--body); line-height: 1.75; }

/* Читаемая ширина колонки с текстом (сетку врачей не трогаем) */
.lp-article .col-lg-12 {
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}

/* Чередуем фон секций, чтобы не было сплошного «полотна» */
.lp-article > section { background: #fff !important; }
.lp-article > section:nth-of-type(even) { background: var(--bg-tint) !important; }
.lp-article > section.lp-cta { background: var(--brand-tint) !important; }

.lp-article h1 {
  font-size: clamp(1.9rem, 4vw, 2.6rem);
  font-weight: 700;
  margin-bottom: 1rem;
}
.lp-article h2 {
  font-size: clamp(1.3rem, 2.6vw, 1.7rem);
  font-weight: 600;
  color: var(--ink);
  margin: 2rem 0 .75rem;
}
.lp-article h3, .lp-article h4 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--ink);
  margin: 1.5rem 0 .5rem;
}
.lp-article h2:first-child,
.lp-article h1:first-child { margin-top: 0; }

/* «Списки» на <br> — добавляем воздух между строками */
.lp-article .col-lg-12 br {
  display: block;
  content: "";
  margin-top: .45rem;
}

/* Картинка с обтеканием — на узкой колонке уводим под текст */
@media (max-width: 767.98px) {
  .lp-article .float-right { float: none !important; display: block; margin: 0 0 1rem; }
  .lp-article .float-right img { width: 100% !important; height: auto; }
}

/* Пустой хвостовой блок с <br><BR> */
.lp-article .col-12.mb-5.pb-5 { display: none; }

/* --- Страница «Рассрочка»: читаемый юридический документ --- */
.rassrochka-doc { color: var(--body); line-height: 1.7; }
.rassrochka-doc h2 {
  font-size: clamp(1.35rem, 2.6vw, 1.7rem);
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 1.5rem;
}
.rassrochka-doc h3 {
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--ink);
  margin: 2rem 0 .6rem;
}
.rassrochka-doc p { margin-bottom: .9rem; }
.rassrochka-doc ul {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
}
.rassrochka-doc ul li { margin-bottom: .35rem; }
.rassrochka-doc .text-muted { font-size: 14px; }

/* --- Страница «Контакты» --- */
.contacts-card,
.contacts-legal {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--sh-1);
}
.contacts-card { padding: 1.75rem; height: 100%; }

.contacts-list { list-style: none; margin: 0; padding: 0; }
.contacts-list li {
  display: flex;
  gap: 1rem;
  padding: 1.1rem 0;
  border-bottom: 1px solid var(--line);
}
.contacts-list li:first-child { padding-top: 0; }
.contacts-list li:last-child { padding-bottom: 0; border-bottom: 0; }
.contacts-ic {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--brand-tint);
  color: var(--brand);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.contacts-txt { display: flex; flex-direction: column; line-height: 1.5; color: var(--body); }
.contacts-txt strong {
  font-weight: 600;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 3px;
}
.contacts-txt a { color: var(--ink); font-weight: 600; }
.contacts-txt a:hover { color: var(--brand); }

.contacts-map {
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh-1);
  border: 1px solid var(--line);
  height: 100%;
  min-height: 460px;
  background: var(--bg-tint);
}
.contacts-map iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 460px;
  border: 0;
}

.contacts-legal { padding: 1.75rem 2rem; }
.contacts-legal h2 { font-weight: 700; color: var(--ink); margin-bottom: 1.1rem; }
.contacts-req { margin: 0; }
.contacts-req > div {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: .4rem 1.5rem;
  padding: .65rem 0;
  border-bottom: 1px solid var(--line);
}
.contacts-req > div:last-child { border-bottom: 0; }
.contacts-req dt { font-weight: 600; color: var(--muted); font-size: 14px; margin: 0; }
.contacts-req dd { margin: 0; color: var(--body); }
@media (max-width: 575.98px) {
  .contacts-req > div { grid-template-columns: 1fr; gap: .15rem; }
}
