/* ЭВОРИЯ, заход 9 - весь сайт: внутренние страницы (Услуги, 12 услуг, Врачи, 2 врача, Документы) и движение нижних глав главной.
   Общее с главной (шапка, меню телефона, подвал, форма, контакты, шрифты, цвета) - в css/site.css, здесь только новое.
   Сквозной мотив - тонкая тёплая линия света: ею проявляются фото, подчёркиваются активные пункты, рисуется путь пациента,
   ею же стоит шторка до/после. Кривая разгона одна на весь сайт - var(--ease). Скрытые состояния - только под html.lt
   (ставит сторож в <head>, js/site.js добавляет lt-ready; без скрипта за 3 с класс снимается - всё видно как есть). */

/* ---------- тон фона: глава посередине экрана задаёт цвет страницы, переход мягкий ----------
   Заход 10 (находка помощника «материи», research/dust_v10.md §4): --tone больше не зарегистрировано и не анимируется - наследуемое
   свойство корня, плывущее 1,3 с, пересчитывало стили всей страницы каждый кадр (тяжёлая прокрутка у «Письма» на телефоне).
   Теперь --tone меняется сразу (один пересчёт на смену), плавность - у самих потребителей цвета: background-color 1,3 с. */
html.tone-on body { background: var(--tone); transition: background-color 1.3s var(--ease); }
html.tone-on [data-tone] { background: transparent; }
.top::before { background: rgba(250, 247, 243, .9); background: color-mix(in srgb, var(--tone, #faf7f3) 90%, transparent); transition: opacity .8s var(--ease), background-color 1.3s var(--ease); }

/* заход 12 (слово Сергея 24.10.2026: после обновления анимации играют заново): стили заголовков (fx/titles.css) подключает скрипт, позже
   первой отрисовки - при обновлении посреди страницы заголовки на экране мелькали готовыми и уже не проявлялись. До их прихода - скрыты
   (класс tw ставит <head>; не пришли за 3 с - он снимается, всё видно как есть). */
html.tw:not(.t-ready) .h-rev, html.tw:not(.t-ready) .t-title { opacity: 0; }

/* ---------- заголовки глав: по словам из мягкого размытия в резкость (слова размечает js/site.js, момент - fx/titles.js) ---------- */
.t-ready .h-rev.hw { opacity: 1; transform: none; }
.h-rev.hw .w { display: inline-block; }
.t-ready .h-rev.hw:not(.is-written) .w { opacity: 0; filter: blur(10px); transform: translateY(.14em); }
.t-ready .h-rev.hw.is-written .w {
  transition: opacity 1s var(--ease) calc(var(--d, 0s) + var(--i, 0) * 90ms), filter 1.2s var(--ease) calc(var(--d, 0s) + var(--i, 0) * 90ms),
    transform 1.2s var(--ease) calc(var(--d, 0s) + var(--i, 0) * 90ms);
}
.t-ready .h-rev.hw.is-quick.is-written .w { transition-duration: .55s, .65s, .65s; transition-delay: calc(var(--d, 0s) + var(--i, 0) * 50ms); }   /* первый экран (fx/titles.js) */

/* ---------- фото: медленный наезд (scale/translate - отдельно от transform параллакса) ---------- */
.kb { overflow: hidden; }
.kb > img, .kb > .sv-frame__cams { transform-origin: 50% 38%; }
.kb.is-kb > img, .kb.is-kb > .sv-frame__cams { animation: kb 26s cubic-bezier(.3, .1, .25, 1) both; }   /* кадр «Услуг» - всем слоем (с обводкой зоны), чтобы обводка не съехала */
@keyframes kb { from { scale: 1; translate: 0 0; } to { scale: 1.075; translate: -1% -1.2%; } }
.pismo__photo.kb { border-radius: 2px; }

/* ---------- карточки услуг: наклон к курсору (ПК) ---------- */
.sv-grid.is-tilt { perspective: 1600px; }
.sv-grid.is-tilt .sc:not(.is-enter):not(.is-out) { transition: opacity .6s var(--ease), transform .7s var(--ease), rotate .5s var(--ease); }

/* ---------- линия света ---------- */
.lt-r { position: relative; }
.lt .lt-r:not(.is-in) .lt-c { clip-path: inset(0 100% 0 0); }
.lt .lt-r.is-in .lt-c { clip-path: inset(0 0 0 0); transition: clip-path var(--lt-d, 1.9s) var(--ease); }
/* сама линия (заход 10 - едет transform, без пересчёта раскладки): слой во всю рамку, светлая жилка с тёплым ореолом у его левого края */
.lt-r::after {
  content: ''; position: absolute; z-index: 6; inset: 0; pointer-events: none; opacity: 0;
  background: linear-gradient(90deg, rgba(214, 160, 120, 0) 0, rgba(214, 160, 120, .22) 6px, rgba(255, 236, 216, .8) 10.5px, #fffaf3 12px,
    rgba(255, 236, 216, .8) 13.5px, rgba(214, 160, 120, .22) 18px, rgba(214, 160, 120, 0) 24px, transparent 25px);
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent);
  transform: translateX(-12px);
}
.lt .lt-r.is-in::after { animation: lt-sweep var(--lt-d, 1.9s) var(--ease) both; }
@keyframes lt-sweep { 0% { transform: translateX(-12px); opacity: 0; } 5% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateX(calc(100% - 12px)); opacity: 0; } }
.lt-r.is-now .lt-c { transition: none !important; }
.lt-r.is-now::after { animation: none !important; }
html.dust-ready .lt-r--dust .lt-c { clip-path: none !important; transition: none !important; }
html.dust-ready .lt-r--dust::after { display: none; }
/* собрано из материи - следом по фото проходит линия света (класс ставит js/site.js по концу сборки) */
html.dust-ready .lt-r--dust.is-gleam::after { display: block; animation: lt-sweep 1.8s var(--ease) both; }
/* перо по живому тексту: надпись проявляется слева направо (как у fx/titles.css) */
.lt .lt-write {
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 44%, rgba(0, 0, 0, 0) 49%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 44%, rgba(0, 0, 0, 0) 49%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-size: 250% 100%; mask-size: 250% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 100% 0; mask-position: 100% 0;
}
.lt .lt-write.is-in { -webkit-mask-position: 0 0; mask-position: 0 0; transition: -webkit-mask-position 1.7s linear .2s, mask-position 1.7s linear .2s; }

/* ---------- шапка: активный пункт и наведение - подчёркивание линией света ---------- */
.top__nav a { position: relative; }
.top__nav a::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -7px; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, var(--accent), var(--copper) 78%, #f6dcc6);
  transform: scaleX(0); transform-origin: 0 50%; transition: transform .7s var(--ease);
}
.top__nav a:hover::after, .top__nav a[aria-current="page"]::after { transform: scaleX(1); }
.top__nav a[aria-current="page"] { opacity: 1; color: var(--accent); }
.lt-ready .top__nav a[aria-current="page"]::after { animation: ln-draw 1.5s var(--ease) .5s both; }
@keyframes ln-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.mnav__title { margin: clamp(18px, 4svh, 44px) 0 0; font: 400 12px/1.4 var(--sans); letter-spacing: .1em; color: var(--copper); }
.mnav__title + .mnav__list { margin-top: 12px; }
.mnav__list a[aria-current="page"] { color: var(--accent); }

/* ---------- кнопки: блик линии (проходит один раз, когда кнопка показалась, и при наведении) ---------- */
.btn--glint { position: relative; overflow: hidden; isolation: isolate; }
.btn--glint::after {
  content: ''; position: absolute; top: -30%; bottom: -30%; left: -12%; width: 1px; pointer-events: none; opacity: 0;
  background: linear-gradient(to bottom, rgba(255, 246, 234, 0), rgba(255, 246, 234, .95) 50%, rgba(255, 246, 234, 0));
  box-shadow: 0 0 6px 1px rgba(255, 232, 210, .55); transform: skewX(-16deg);
}
.btn--glint.is-glint::after { animation: glint 1.5s var(--ease) both; }
.btn--glint:hover::after { animation: glint2 1.2s var(--ease) both; }
@keyframes glint { 0% { left: -12%; opacity: 0; } 12% { opacity: 1; } 85% { opacity: 1; } 100% { left: 112%; opacity: 0; } }
@keyframes glint2 { 0% { left: -12%; opacity: 0; } 12% { opacity: 1; } 85% { opacity: 1; } 100% { left: 112%; opacity: 0; } }

/* ---------- форма: подчёркивание поля рисуется при фокусе (база - медь, поверх - терракота со светлым краем) ---------- */
.req__f input, .req__f textarea {
  border-bottom: 0;
  background-image: linear-gradient(90deg, var(--accent), var(--accent) calc(100% - 30px), #f2d2b8), linear-gradient(var(--copper), var(--copper));
  background-repeat: no-repeat; background-position: 0 100%, 0 100%; background-size: 0% 1.5px, 100% 1px;
  transition: background-size .9s var(--ease);
}
.req__f input:focus, .req__f textarea:focus { background-size: 100% 1.5px, 100% 1px; }
.req__consent input { flex: none; }
.req__done { margin: 18px 0 0; max-width: 34em; font-size: 14.5px; line-height: 1.5; color: var(--copper); opacity: 0; transform: translateY(6px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.req__done.is-on { opacity: 1; transform: none; }   /* ответ формы концепта (js/site.js form) */

/* ---------- «Ваш путь» (заход 10, переделка 12): нить света через шаги, за 4-м коротким хвостом тает - без фигуры (его слово 24.10.2026);
   строит js/site.js, класс put--fx. Без скрипта - обычный список с номерами.
   --put-dir: h - шаги в ряд волной (от 1280 px), v - столбиком, нить по левому краю. */
.path li { position: relative; }
.path__n { margin-bottom: 30px; font: 400 34px/1 var(--serif); letter-spacing: 0; color: var(--accent); }
.put--fx { position: relative; --put-dir: h; }
.put--fx .path li { border-top: 0; padding-top: 30px; }
.path__svg { position: absolute; z-index: 0; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; will-change: transform; }   /* свой слой: дорисовка нити не перерисовывает текст главы */
.path__line, .path__halo, .path__glint { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.path__line { stroke: url(#put-grad); stroke-width: 1.5; }
.path__halo { stroke: url(#put-grad); stroke-width: 7; opacity: .12; }
.path__glint { stroke: #fff8ee; stroke-width: 2.4; opacity: 0; filter: drop-shadow(0 0 3px rgba(255, 226, 196, .9)); }
/* голова нити - маленький тёплый свет на кончике линии */
.path__tip {
  position: absolute; z-index: 2; left: 0; top: 0; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, #fffaf2 0 1.6px, rgba(255, 238, 218, .9) 2.6px, rgba(214, 160, 120, .38) 4.6px, rgba(214, 160, 120, 0) 8px);
  opacity: 0; transition: opacity .6s var(--ease); will-change: transform, opacity;
}
.path__tip.is-on { opacity: 1; }
/* узлы шагов: пустое кольцо; нить дошла - заполняется, по кольцу расходится блик */
.path__node {
  position: absolute; z-index: 1; left: 0; top: 0; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; box-sizing: border-box; border-radius: 50%;
  border: 1px solid rgba(101, 50, 30, .36); background: rgba(250, 247, 243, .7); pointer-events: none;
  transition: background .7s var(--ease), border-color .7s var(--ease);
}
.path__node::after { content: ''; position: absolute; inset: -1px; border-radius: 50%; border: 1px solid rgba(214, 160, 120, .85); opacity: 0; }
.path__node.is-lit { background: var(--accent); border-color: var(--accent); }
.path__node.is-lit::after { animation: node-ring 1.4s var(--ease) both; }
@keyframes node-ring { 0% { transform: scale(1); opacity: .95; } 100% { transform: scale(3.8); opacity: 0; } }
/* номер загорается, текст шага проявляется из лёгкого размытия */
.path--fx .path__n { color: rgba(168, 119, 88, .32); transition: color 1.1s var(--ease); }
.path--fx li.is-lit .path__n { color: var(--accent); animation: n-glow 1.8s var(--ease) both; }
@keyframes n-glow { 0% { text-shadow: 0 0 0 rgba(214, 160, 120, 0); } 30% { text-shadow: 0 0 18px rgba(214, 160, 120, .55); } 100% { text-shadow: 0 0 0 rgba(214, 160, 120, 0); } }
.lt .path--fx li:not(.is-lit) .h3, .lt .path--fx li:not(.is-lit) p { opacity: 0; filter: blur(6px); transform: translateY(8px); }
.path--fx li.is-lit .h3, .path--fx li.is-lit p { transition: opacity .9s var(--ease) .15s, filter 1s var(--ease) .15s, transform 1s var(--ease) .15s; }
.path--fx li.is-lit p { transition-delay: .34s; }
/* ПК: шаги во всю ширину волной (чётные чуть ниже); нить входит слева, проходит шаги и над 4-м тает */
@media (min-width: 1280px) {
  .put--fx .path { align-items: start; }
  .put--fx .path li:nth-child(even) { margin-top: 52px; }
}
/* уже 1280: шаги столбиком, нить по полю слева, за 4-м тает вдоль его текста */
@media (max-width: 1279px) {
  .put--fx { --put-dir: v; }
  .put--fx .path { grid-template-columns: 1fr; gap: 34px; max-width: 640px; padding-left: 46px; }
  .put--fx .path li { padding-top: 0; }
  .put--fx .path__n { margin-bottom: 10px; font-size: 30px; }
}

/* ---------- «Люди ЭВОРИИ» (заход 10 - только Святослав Стрелин): портрет крупно справа, текст слева; лёгкий параллакс ---------- */
.doc__photo { overflow: hidden; border-radius: 2px; }
.doc__photo img { transform: translate3d(0, var(--py, 0px), 0) scale(1.07); will-change: transform; }
.docs--one { display: block; margin-top: clamp(18px, 2vw, 32px); }
.docs--one .doc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); gap: clamp(32px, 6vw, 110px); align-items: end; }
.docs--one .doc__photo { grid-column: 2; grid-row: 1; }
.docs--one .doc__photo img { aspect-ratio: 4 / 4.7; max-height: min(calc(100svh - 150px), 760px); object-position: 50% 16%; }   /* заход 12, отступы: на 1920 портрет был 758×891 и оставлял слева ~550 px пустого поля над текстом; до 1440 не меняется */
.docs--one .doc__copy { grid-column: 1; grid-row: 1; max-width: 560px; padding: 0 0 clamp(8px, 2vw, 32px); }
.docs--one .doc__name { margin-top: 4px; font: 400 clamp(46px, 5vw, 84px)/.98 var(--serif); letter-spacing: -.018em; }
.docs--one .doc__role { margin-top: 18px; font-size: 15px; }
.docs--one .doc__sum { margin-top: 26px; max-width: 26em; font: italic 400 clamp(22px, 1.9vw, 28px)/1.35 var(--serif); color: var(--ink); }
.docs--one .doc__more { margin-top: 36px; }
/* заход 12, отступы: подпись главы «Люди ЭВОРИИ» стояла одна вверху слева, под ней ~320 px пусто до имени (текст прижат к низу портрета) -
   теперь она внизу левой колонки, прямо над текстом о враче; портрет справа - с верха главы. Сетка главы, карточка врача - подсетка */
@media (min-width: 761px) { @supports (grid-template-rows: subgrid) {   /* без подсетки (старые браузеры) - прежний вид */
  .lyudi { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); grid-template-rows: 1fr auto auto; column-gap: clamp(32px, 6vw, 110px); }
  .lyudi > .eyebrow { grid-column: 1; grid-row: 1; align-self: end; margin: 0 0 clamp(18px, 2vw, 28px); }
  .docs--one { display: contents; }
  .docs--one .doc { grid-column: 1 / -1; grid-row: 1 / span 2; grid-template-columns: subgrid; grid-template-rows: subgrid; row-gap: 0; }
  .docs--one .doc__photo { grid-column: 2; grid-row: 1 / span 2; }
  .docs--one .doc__copy { grid-column: 1; grid-row: 2; }
  .lyudi__all { grid-column: 2; grid-row: 3; margin-top: clamp(16px, 1.6vw, 24px); }   /* ссылка - при портрете, а не посреди пустого поля (было 28-48) */
} }

/* ---------- нижняя навигация телефона (их «Быстрая навигация») ---------- */
.tabbar { display: none; }

/* ---------- общее для внутренних страниц ---------- */
.pg main { display: block; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.pintro { padding: calc(72px + clamp(40px, 5.6vw, 96px)) var(--pad) clamp(32px, 3.6vw, 56px); }   /* заход 12, отступы: было 48-112 / 36-60 */
.pintro__h1 { margin: 4px 0 24px; font: 400 clamp(64px, 8.6vw, 136px)/.9 var(--serif); letter-spacing: -.025em; }
.pintro__p { max-width: 30em; font-size: 18px; line-height: 1.55; color: #4a3d36; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0 0 28px; font-size: 13px; color: var(--muted); }
.crumbs a { color: var(--accent); text-decoration: none; background: linear-gradient(var(--accent), var(--accent)) 0 100% / 0 1px no-repeat; transition: background-size .6s var(--ease); }
.crumbs a:hover { background-size: 100% 1px; }
.crumbs span:last-child { min-width: 0; }

/* ---------- Услуги: каталог слева, кадр девушки справа - липкий, пока идёт список ---------- */
.sv { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .74fr); column-gap: clamp(32px, 4vw, 72px); padding-right: var(--pad); }
.sv__intro { grid-column: 1; grid-row: 1; padding-right: 0; }
.sv-frame {
  grid-column: 2; grid-row: 1 / span 2; align-self: start; position: sticky; top: 96px;
  height: calc(100svh - 120px); min-height: 480px; margin-top: 96px;
}
.sv-frame__in { position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: 2px; background: var(--wall); }
.sv-frame__cams { position: absolute; inset: 0; }
.cam { position: absolute; inset: 0; opacity: 0; transform-origin: 0 0; transition: opacity .9s var(--ease); }
.cam.is-on { opacity: 1; }
.cam.is-moving { transition: opacity .9s var(--ease), transform 1.25s var(--ease); }
.cam__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 50%; }
.cam__ol {
  position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; fill: none;
  filter: drop-shadow(0 0 2px rgba(255, 240, 224, .95)) drop-shadow(0 0 7px rgba(168, 119, 88, .45));
}
.cam__ol path { stroke: #fffaf3; stroke-linecap: round; stroke-dasharray: 1 1; stroke-dashoffset: 1; opacity: 0; transition: stroke-dashoffset 1.4s var(--ease), opacity .4s var(--ease); }
.cam__ol.is-drawn path { stroke-dashoffset: 0; opacity: 1; }
.sv-cat { grid-column: 1; grid-row: 2; padding: 0 0 calc(var(--sec) - 24px) var(--pad); }   /* у последней карточки и так 30 px снизу (.sc__act) */
.sv-cat__head { margin-bottom: 26px; }
/* заход 12 (слово Сергея 24.10.2026): без плашки - прилипающая матовая панель с размытием выглядела белым прямоугольником; подписи «Показано услуг» нет */
.sv-tools { display: grid; grid-template-columns: minmax(200px, 300px) 1fr; align-items: end; gap: 14px 32px; margin: 0 0 8px; padding: 18px 0 16px; }
.sv-search { position: relative; display: block; }
.sv-search svg { position: absolute; left: 0; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); fill: none; stroke: var(--muted); stroke-width: 1.5; stroke-linecap: round; }
.sv-search input {
  width: 100%; height: 44px; margin: 0; padding: 0 4px 0 30px; border: 0; border-radius: 0; outline: none; -webkit-appearance: none; appearance: none;
  font: 300 16px/1.2 var(--sans); color: var(--ink);
  background: linear-gradient(90deg, var(--accent), var(--accent) calc(100% - 30px), #f2d2b8) 0 100% / 0% 1.5px no-repeat, linear-gradient(var(--copper), var(--copper)) 0 100% / 100% 1px no-repeat;
  transition: background-size .9s var(--ease);
}
.sv-search input:focus { background-size: 100% 1.5px, 100% 1px; }
.sv-search input::placeholder { color: #a39a93; }
.sv-search input::-webkit-search-cancel-button { cursor: pointer; }
.sv-filters { grid-column: 1 / -1; position: relative; }
.sv-filters__in { position: relative; display: flex; flex-wrap: wrap; gap: 4px 24px; }
.sv-filters button {
  margin: 0; padding: 8px 0 10px; border: 0; background: none; cursor: pointer; white-space: nowrap;
  font: 400 14px/1.2 var(--sans); letter-spacing: .01em; color: var(--muted); transition: color .4s var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.sv-filters button:hover, .sv-filters button.active { color: var(--accent); }
.sv-filters__ln {
  position: absolute; left: 0; top: 0; height: 1px; width: 0; pointer-events: none;
  background: linear-gradient(90deg, var(--accent), var(--copper) 80%, #f6dcc6);
  box-shadow: 0 0 6px rgba(214, 160, 120, .35);
  transition: transform .7s var(--ease), width .7s var(--ease);
}
.sv-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(24px, 3vw, 48px); }
.sv-grid > [hidden] { display: none !important; }
.sc { position: relative; display: flex; flex-direction: column; padding-top: 26px; scroll-margin-top: 200px; transition: opacity .5s var(--ease); }
.sc::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--line); }
.sc::after {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, var(--accent), var(--copper) 85%, #f6dcc6); transform: scaleX(0); transform-origin: 0 50%;
  transition: transform .8s var(--ease);
}
.sc:hover::after, .sc:focus-within::after { transform: scaleX(1); }
.sc.is-out { opacity: 0; transition: opacity .2s var(--ease); }
.sc.is-enter { opacity: 0; transform: translateY(14px); }
.sc:not(.is-enter):not(.is-out) { transition: opacity .6s var(--ease), transform .7s var(--ease); }
.sc__body { flex: 1; display: grid; grid-template-columns: auto 1fr; align-content: start; column-gap: 14px; }
.sc__body > * { grid-column: 1 / -1; }
.sc__n { grid-column: 1; font: 400 12.5px/1.5 var(--sans); letter-spacing: .1em; color: var(--copper); }
.sc__body .eyebrow { grid-column: 2; margin: 0; }
.sc__t { margin: 14px 0 10px; font: 400 clamp(26px, 2.15vw, 33px)/1.06 var(--serif); letter-spacing: -.005em; }
.sc__t a { text-decoration: none; transition: color .4s var(--ease); }
.sc__t a:hover { color: var(--accent); }
.sc__p { font-size: 15px; line-height: 1.55; color: #4a3d36; max-width: 30em; }
.sc__facts { display: flex; flex-wrap: wrap; gap: 8px 30px; margin-top: 18px; }
.sc__facts:empty { display: none; }
.sc__facts small { display: block; margin-bottom: 2px; font-size: 11.5px; letter-spacing: .05em; color: var(--muted); }
.sc__facts b { font: 400 23px/1.1 var(--serif); color: var(--ink); }
.sc__act { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 18px; padding: 12px 0 30px; }
.sc__act a { text-decoration: none; font-size: 14px; }
.sc__more { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); }
.sc__more span { color: var(--copper); transition: transform .4s var(--ease); }
.sc__more:hover span { transform: translateX(4px); }
.sc__book { color: var(--accent); padding-bottom: 2px; background: linear-gradient(var(--accent), var(--accent)) 0 100% / 100% 1px no-repeat; transition: background-size .5s var(--ease); }
.sc__book:hover { background-size: 0 1px; background-position: 100% 100%; }
.sv-empty { padding: 56px 0 24px; border-top: 1px solid var(--line); }
.sv-empty h3 { margin: 0 0 10px; font: 400 clamp(30px, 3vw, 42px)/1.1 var(--serif); }
.sv-empty p { color: var(--muted); }
.sv-empty button {
  margin-top: 22px; padding: 12px 20px; border: 1px solid var(--copper); border-radius: 4px; background: none; cursor: pointer;
  font: 400 14px/1 var(--sans); color: var(--accent); transition: background .3s var(--ease), color .3s var(--ease);
}
.sv-empty button:hover { background: var(--accent); color: var(--cream); border-color: var(--accent); }
.sv-empty:not(.is-in) { opacity: 0; transform: translateY(10px); }
.sv-empty.is-in { opacity: 1; transform: none; transition: opacity .7s var(--ease) .15s, transform .7s var(--ease) .15s; }

/* ---------- страница услуги: первый экран - кадр зоны со шторкой до/после на линии света ---------- */
.sp-hero { position: relative; min-height: 100svh; display: flex; align-items: center; padding: 104px var(--pad) 64px; overflow: hidden; }
.sp-frame { position: absolute; inset: 0; z-index: 0; cursor: ew-resize; touch-action: pan-y; -webkit-user-select: none; user-select: none; }
.sp-frame__in {
  position: absolute; inset: 0; overflow: hidden; background: var(--wall);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 86%, rgba(0, 0, 0, 0) 100%); mask-image: linear-gradient(to bottom, #000 0%, #000 86%, rgba(0, 0, 0, 0) 100%);
}
.sp-frame .cam { opacity: 1; }
.sp-frame img { -webkit-user-drag: none; }
.cam__do { position: absolute; left: 0; top: 0; pointer-events: none; }
.cam__do img, .cam__do picture { display: block; width: 100%; height: 100%; }
.sp-line { position: absolute; left: 0; top: 0; bottom: 0; width: 0; z-index: 3; opacity: 0; pointer-events: none; transition: opacity .8s var(--ease); will-change: transform; }
.sp-frame.is-live .sp-line { opacity: 1; }
.sp-line::before {
  content: ''; position: absolute; top: 0; bottom: 0; left: -.5px; width: 1px;
  background: linear-gradient(to bottom, rgba(255, 250, 243, 0) 4%, #fffaf3 22%, #fffaf3 80%, rgba(255, 250, 243, 0) 96%);
  box-shadow: 0 0 4px 1px rgba(255, 238, 220, .8), 0 0 18px 3px rgba(168, 119, 88, .28);
}
.sp-knob {
  position: absolute; left: -17px; top: 50%; width: 34px; height: 34px; margin-top: -17px; box-sizing: border-box; border-radius: 50%;
  border: 1px solid rgba(255, 250, 243, .95); background: rgba(250, 247, 243, .16);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); box-shadow: 0 0 10px rgba(168, 119, 88, .22);
  transition: transform .4s var(--ease);
}
.sp-knob::before, .sp-knob::after {
  content: ''; position: absolute; top: 50%; width: 5px; height: 5px; margin-top: -3px; border: solid #fffaf3; border-width: 1px 1px 0 0;
}
.sp-knob::before { left: 8px; transform: rotate(-135deg); }
.sp-knob::after { right: 8px; transform: rotate(45deg); }
.sp-frame.is-drag .sp-knob { transform: scale(1.12); }
.sp-hero::after {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(250, 247, 243, .86) 0%, rgba(250, 247, 243, .62) 24%, rgba(250, 247, 243, 0) 46%);
}
.sp-hero__text { position: relative; z-index: 2; width: min(40%, 560px); }
.sp-h1 { margin: 0 0 16px; font: 400 clamp(46px, 4.6vw, 74px)/.98 var(--serif); letter-spacing: -.018em; }
.sp-sub { max-width: 26em; font: italic 400 clamp(21px, 1.7vw, 26px)/1.3 var(--serif); color: var(--accent); }
.sp-desc { margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(101, 50, 30, .22); }
.sp-desc__p { max-width: 32em; font-size: 16px; line-height: 1.6; color: #4a3d36; }
.sp-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 28px; margin: 26px 0 0; }
.sp-facts > div > span { display: block; margin-bottom: 6px; font-size: 12.5px; letter-spacing: .05em; color: var(--muted); }
.sp-facts strong { display: block; font: 400 clamp(40px, 3.6vw, 56px)/1 var(--serif); letter-spacing: -.01em; color: var(--ink); }
.sp-desc .btn { margin-top: 30px; }
/* цифры счёта - обычные (у Cormorant табличная «1» стоит с пробелом: «1 20») */

/* подробнее (страница услуги и врача): заголовок - липкий слева, пока идёт текст справа */
.detail { display: grid; grid-template-columns: minmax(240px, .78fr) minmax(0, 1.22fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
.detail__head { position: sticky; top: 120px; }
.detail__body p { max-width: 36em; font-size: 17.5px; line-height: 1.72; }
.detail__body p + p { margin-top: 1.1em; }
.detail:not(.detail--doc) .detail__body p { font: 400 clamp(24px, 2.1vw, 32px)/1.38 var(--serif); color: var(--ink); max-width: 26em; }

/* ---------- Врачи ---------- */
.dteam { padding-top: clamp(24px, 3vw, 48px); }
.dteam__head { margin-bottom: clamp(32px, 4vw, 56px); }
.dteam__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 3.4vw, 56px); align-items: start; }
.dcard > a { display: block; text-decoration: none; }
.dcard__ph { margin: 0; overflow: hidden; border-radius: 2px; background: var(--wall); }
.dcard__ph img { width: 100%; aspect-ratio: 4 / 4.6; object-fit: cover; transform: translate3d(0, var(--py, 0px), 0) scale(1.06); }
.dcard:nth-child(1) .dcard__ph img { object-position: 62% 40%; }
.dcard:nth-child(2) .dcard__ph img { object-position: 50% 18%; }
.dcard__copy { padding-top: 24px; }
.dcard__copy .eyebrow { margin-bottom: 10px; }
.dcard__name { margin: 0; font: 400 clamp(30px, 2.7vw, 42px)/1.06 var(--serif); }
.dcard__role { margin-top: 10px; font-size: 15px; color: var(--muted); }
.dcard__more {
  position: relative; display: flex; align-items: center; gap: 8px; margin-top: 22px; padding-top: 14px; font-size: 14.5px; color: var(--ink);
  background: linear-gradient(var(--line), var(--line)) 0 0 / 100% 1px no-repeat;
}
.dcard__more::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; transform: scaleX(0); transform-origin: 0 50%; transition: transform .8s var(--ease);
  background: linear-gradient(90deg, var(--accent), var(--copper) 85%, #f6dcc6);
}
.dcard > a:hover .dcard__more::before, .dcard > a:focus-visible .dcard__more::before { transform: scaleX(1); }
.dcard__more span { margin-left: auto; color: var(--copper); transition: transform .4s var(--ease); }
.dcard > a:hover .dcard__more span { transform: translateX(4px); }

/* ---------- страница врача: портрет крупно ---------- */
/* заход 12, отступы: без min-height 100svh (высоту и так задаёт портрет - экран минус 160), снизу - общее поле главы (было 56-100 + 150 следующей) */
.dp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 96px); align-items: center; padding: 100px var(--pad) var(--sec); }
.dp__ph { margin: 0; height: calc(100svh - 160px); min-height: 520px; max-height: 920px; overflow: hidden; border-radius: 2px; background: var(--wall); }
.dp__ph img { width: 100%; height: 100%; object-fit: cover; }
.dp--blinova .dp__ph img { object-position: 60% 40%; }
.dp--strelin .dp__ph img { object-position: 50% 20%; }
.dp__copy { max-width: 600px; }
.dp__h1 { margin: 0 0 14px; font: 400 clamp(48px, 5vw, 82px)/.96 var(--serif); letter-spacing: -.02em; }
.dp__role { font-size: 15px; color: var(--muted); }
.dp__q { margin: 28px 0 0; font: italic 400 clamp(26px, 2.4vw, 36px)/1.22 var(--serif); color: var(--accent); }
.dp__sum { margin-top: 22px; max-width: 30em; font-size: 17px; line-height: 1.6; color: #4a3d36; }
.dp__copy .btn { margin-top: 32px; }

/* ---------- Документы: строки по очереди, иконка документа ---------- */
.dl { padding-top: clamp(8px, 1.6vw, 24px); }   /* заход 12, отступы: было 40-80 сверх поля вступления */
.dl__row { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 12px 28px; padding: 30px 0; }
.dl__row::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: rgba(101, 50, 30, .2); transform-origin: 0 50%; }
.dl__row::after {
  content: ''; position: absolute; top: -12px; height: 25px; left: 0; width: 1px; opacity: 0; pointer-events: none;
  background: linear-gradient(to bottom, rgba(255, 250, 243, 0), #fffaf3 50%, rgba(255, 250, 243, 0)); box-shadow: 0 0 5px 1px rgba(255, 238, 220, .8), 0 0 14px 2px rgba(168, 119, 88, .3);
}
.dl__ico { width: 40px; height: 48px; fill: none; stroke: var(--copper); stroke-width: 1.1; stroke-linejoin: round; stroke-linecap: round; }
.dl__k { font-size: 13px; letter-spacing: .08em; color: var(--muted); }
.dl__v { font: 400 clamp(26px, 2.7vw, 42px)/1.15 var(--serif); font-weight: 400; text-align: right; color: var(--ink); }
.dl__empty { grid-template-columns: 52px minmax(0, 1fr); }
.dl__empty p { grid-column: 2; font: italic 400 clamp(22px, 2vw, 28px)/1.35 var(--serif); color: var(--muted); }
.dl__row:last-child { border-bottom: 1px solid rgba(101, 50, 30, .2); }
.lt .dl__row::before { transform: scaleX(0); }
.lt .dl__row > * { opacity: 0; transform: translateY(8px); }
.lt .dl__row .dl__ico path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.lt .dl__row.is-in::before { transform: scaleX(1); transition: transform 1.3s var(--ease); }
.lt .dl__row.is-in::after { animation: dl-sweep 1.3s var(--ease) both; }
.lt .dl__row.is-in > * { opacity: 1; transform: none; transition: opacity .9s var(--ease) .45s, transform .9s var(--ease) .45s; }
.lt .dl__row.is-in .dl__ico path { stroke-dashoffset: 0; transition: stroke-dashoffset 1.4s var(--ease) .35s; }
@keyframes dl-sweep { 0% { left: 0; opacity: 0; } 8% { opacity: 1; } 88% { opacity: 1; } 100% { left: 100%; opacity: 0; } }

/* ---------- узкий ПК ---------- */
@media (max-width: 1180px) and (min-width: 761px) {
  .sv { grid-template-columns: minmax(0, 1fr) minmax(0, .62fr); }
  .sv-grid { grid-template-columns: 1fr; }
  .sp-hero__text { width: min(48%, 520px); }
  .sp-hero::after { background: linear-gradient(90deg, rgba(250, 247, 243, .9) 0%, rgba(250, 247, 243, .7) 34%, rgba(250, 247, 243, 0) 58%); }
  /* заход 12, отступы: страница врача на планшете - портрет 4:5, а не полоса во весь экран (820×1180 - 360 × 1020 px, текст висел посередине) */
  .dp__ph { height: auto; min-height: 0; max-height: none; }
  .dp__ph img { height: auto; aspect-ratio: 4 / 5; }
}

/* ---------- телефон ---------- */
@media (max-width: 760px) {
  .tabbar {
    position: fixed; z-index: 55; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(4, 1fr);
    padding: 4px 6px calc(4px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(101, 50, 30, .12);
    background: rgba(250, 247, 243, .93); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    transform: translateY(105%); transition: transform .6s var(--ease);
  }
  html:not(.js) .tabbar, html.tb-on .tabbar { transform: none; }
  .tabbar a {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 50px;
    text-decoration: none; font: 400 10.5px/1.2 var(--sans); letter-spacing: .02em; color: var(--muted); -webkit-tap-highlight-color: transparent;
  }
  .tabbar svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
  .tabbar a[aria-current="page"] { color: var(--accent); }
  .tabbar a[aria-current="page"]::before {
    content: ''; position: absolute; top: -5px; left: 50%; width: 30px; height: 1px; margin-left: -15px;
    background: linear-gradient(90deg, rgba(255, 246, 234, 0), var(--accent) 30%, var(--accent) 70%, rgba(255, 246, 234, 0));
  }
  html.tb-on .concept-note { bottom: calc(66px + env(safe-area-inset-bottom, 0px)); }
  html.tb-on .rdnav__up { bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
  .foot { padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px)); }

  /* путь - нить по левому краю, за 4-м шагом тает */
  .path__n { margin-bottom: 8px; font-size: 30px; }
  .put--fx .path { gap: 30px; padding-left: 44px; }
  /* «Люди ЭВОРИИ»: портрет сверху, текст ниже */
  .docs--one .doc { grid-template-columns: 1fr; gap: 26px; }
  .docs--one .doc__photo, .docs--one .doc__copy { grid-column: 1; grid-row: auto; }
  .docs--one .doc__photo img { aspect-ratio: 4 / 4.6; }
  .docs--one .doc__name { font-size: clamp(40px, 11vw, 52px); }
  .docs--one .doc__sum { font-size: 21px; margin-top: 18px; }
  .docs--one .doc__more { margin-top: 26px; }

  .pintro { padding: calc(60px + 44px) 20px 28px; }
  .pintro__h1 { font-size: clamp(56px, 17vw, 76px); margin-bottom: 16px; }
  .pintro__p { font-size: 16px; }
  .crumbs { margin-bottom: 18px; font-size: 12px; }

  /* Услуги: кадр - липкая полоса под шапкой, карточка посередине экрана обводит свою зону */
  .pg--services .top::before { height: calc(100% + 6px); }
  .sv { display: block; padding: 0; }
  .sv-frame { position: sticky; top: 60px; z-index: 6; height: 170px; min-height: 0; margin: 0; }
  .sv-frame__in { border-radius: 0; }
  .sv-cat { padding: 30px 20px calc(var(--sec) - 14px); }
  .sc { padding-top: 20px; }
  .sc__act { padding-bottom: 20px; }   /* между карточками теснее, чем между главами (было 61 px при 64 между главами) */
  .sv-tools { grid-template-columns: minmax(0, 1fr); gap: 10px 16px; padding: 4px 0 10px; }
  .sv-search { grid-column: 1; }
  .sv-filters { margin: 0 -20px; padding: 0 20px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .sv-filters::-webkit-scrollbar { display: none; }
  .sv-filters__in { display: inline-flex; flex-wrap: nowrap; gap: 0 20px; padding-right: 20px; }
  .sv-grid { grid-template-columns: 1fr; }
  .sc { scroll-margin-top: 250px; }
  .sc__t { font-size: 28px; }

  /* страница услуги: кадр сверху, текст ниже */
  .sp-hero { display: block; min-height: 0; padding: 0 0 var(--sec); }
  .sp-frame { position: relative; height: 60svh; min-height: 400px; }
  .sp-hero::after { display: none; }
  .sp-hero__text { width: auto; padding: 22px 20px 0; }
  .sp-h1 { font-size: clamp(38px, 10.6vw, 48px); }
  .sp-sub { font-size: 20px; }
  .sp-facts strong { font-size: 40px; }
  .sp-desc .btn { width: 100%; justify-content: center; }
  .detail { grid-template-columns: 1fr; gap: 18px; }
  .detail__head { position: static; }
  .detail__body p { font-size: 16.5px; }
  .detail:not(.detail--doc) .detail__body p { font-size: 23px; }

  .dteam__grid { grid-template-columns: 1fr; gap: 44px; }
  .dp { display: block; padding: 60px 0 var(--sec); }
  .dp__ph { height: auto; min-height: 0; max-height: none; border-radius: 0; }
  .dp__ph img { height: auto; aspect-ratio: 4 / 4.4; }
  .dp__copy { padding: 26px 20px 0; }
  .dp__h1 { font-size: clamp(40px, 11vw, 52px); }
  .dp__copy .btn { width: 100%; justify-content: center; }

  .dl__row { grid-template-columns: 40px minmax(0, 1fr); gap: 6px 16px; padding: 24px 0; }
  .dl__ico { width: 32px; height: 40px; grid-row: 1 / span 2; }
  .dl__v { grid-column: 2; text-align: left; font-size: 26px; }
  .dl__empty { grid-template-columns: 40px minmax(0, 1fr); }
}