/* Страницы сайта: раскладка блоков поверх ядра. Компоненты и токены — в /core/app.css и /shared/tokens.css. */

/* ------------------------------------------------------------------ */
/* 1. Шапка внутренней страницы                                        */
/* ------------------------------------------------------------------ */

.s-head { padding-block: clamp(var(--space-5), 5vw, var(--space-7)) clamp(var(--space-6), 6vw, var(--space-8)); }
.s-head__grid { display: grid; gap: var(--space-6); }
.s-head__text { display: grid; gap: var(--space-4); justify-items: start; align-content: start; min-width: 0; }
.s-head__eyebrow { display: flex; align-items: center; gap: var(--space-3); }
.s-head__eyebrow::before { content: ""; width: 2rem; height: 1px; background: currentColor; flex: none; }
.s-head__title { font-size: var(--text-4xl); line-height: 1; letter-spacing: -0.015em; max-width: 17ch; }
.s-head__title--long { max-width: 22ch; font-size: clamp(2.25rem, 1.4rem + 3.6vw, 3.75rem); line-height: 1.04; }
.s-head__lead { font-size: var(--text-lg); line-height: 1.5; color: var(--color-secondary); max-width: 38rem; }
.s-head__actions { display: grid; gap: var(--space-3); width: 100%; margin-top: var(--space-2); }
.s-head .breadcrumb { margin-bottom: var(--space-4); }
.s-head__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); font-size: var(--text-sm); color: var(--color-muted-foreground); }
.s-head__meta > span { display: inline-flex; align-items: center; gap: 0.4rem; }
@media (min-width: 480px) {
  .s-head__actions { display: flex; flex-wrap: wrap; width: auto; }
}
@media (min-width: 900px) {
  .s-head__grid--aside { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(var(--space-6), 6vw, var(--space-9)); align-items: end; }
  .s-head__grid--form { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(var(--space-6), 5vw, var(--space-8)); align-items: start; }
  .s-head__lead { font-size: var(--text-xl); line-height: 1.45; }
}

/* Крупный факт рядом с заголовком */
.s-fact { display: grid; gap: var(--space-2); padding: var(--space-5) 0 0; border-top: 1px solid var(--color-foreground); }
.s-fact__value { font-size: var(--text-figure); font-weight: var(--weight-medium); line-height: 0.95; letter-spacing: -0.035em; color: var(--color-accent); }
.s-fact__label { font-size: var(--text-lg); font-weight: var(--weight-semibold); line-height: 1.35; max-width: 22rem; }
.s-fact__text { font-size: 0.9375rem; line-height: 1.5; color: var(--color-secondary); max-width: 26rem; }

/* Честная оговорка: полоса слева, без фона */
.s-note { padding-left: var(--space-4); border-left: 2px solid var(--color-accent); font-size: 0.9375rem; line-height: 1.55; color: var(--color-secondary); max-width: 40rem; }
.s-note strong { color: var(--color-foreground); }
.s-note--lg { font-size: var(--text-lg); line-height: 1.5; color: var(--color-foreground); font-weight: var(--weight-semibold); }

/* ------------------------------------------------------------------ */
/* 2. Два входа: «для жизни» и «для инвестиций»                        */
/* ------------------------------------------------------------------ */

.s-duo { display: grid; gap: var(--space-4); }
.s-duo__item {
  display: flex; flex-direction: column; gap: var(--space-4); padding: clamp(var(--space-5), 4vw, var(--space-7));
  border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-card); color: var(--color-card-foreground);
}
.s-duo__item.theme-dark { background: var(--color-background); color: var(--color-foreground); border-color: var(--color-border); }
.s-duo__num { font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: 0.06em; color: var(--color-accent); }
.s-duo__title { font-size: var(--text-display); line-height: 1; }
.s-duo__lead { font-size: var(--text-lg); line-height: 1.45; color: var(--color-secondary); max-width: 30rem; }
.s-duo__list { margin-top: var(--space-2); }
.s-duo__list li { color: var(--color-secondary); }
.s-duo__foot { display: grid; gap: var(--space-2); margin-top: auto; padding-top: var(--space-4); }
.s-duo__links { display: flex; flex-wrap: wrap; gap: 0 var(--space-5); }
@media (min-width: 480px) { .s-duo__foot .btn { justify-self: start; } }
@media (min-width: 900px) { .s-duo { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); } }

/* ------------------------------------------------------------------ */
/* 3. Строки «что — сколько» и указатель ссылок                        */
/* ------------------------------------------------------------------ */

.s-rows { display: grid; }
.s-rows__row { display: grid; gap: var(--space-2) var(--space-5); padding-block: var(--space-5); border-top: 1px solid var(--color-border); }
.s-rows__row:first-child { border-top-color: var(--color-foreground); }
.s-rows__row:last-child { border-bottom: 1px solid var(--color-border); }
.s-rows__name { display: block; font-weight: var(--weight-bold); font-size: var(--text-lg); line-height: 1.3; }
.s-rows__text { display: block; margin-top: 0.3rem; font-size: 0.9375rem; line-height: 1.5; color: var(--color-secondary); max-width: 30rem; }
.s-rows__value { font-size: var(--text-lg); font-weight: var(--weight-bold); line-height: 1.2; }
.s-rows__value--zero { font-size: var(--text-figure); font-weight: var(--weight-medium); letter-spacing: -0.035em; line-height: 0.95; color: var(--color-accent); white-space: nowrap; }
@media (min-width: 560px) {
  .s-rows__row { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .s-rows__value { text-align: right; max-width: 14rem; }
}

.s-index { display: grid; }
.s-index__link {
  position: relative; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr) auto; column-gap: var(--space-3); row-gap: 0.3rem; align-items: start;
  min-height: 64px; padding-block: var(--space-4); border-top: 1px solid var(--color-border); text-decoration: none;
}
.s-index li:first-child .s-index__link { border-top-color: var(--color-foreground); }
.s-index li:last-child .s-index__link { border-bottom: 1px solid var(--color-border); }
.s-index__num { grid-row: 1 / span 2; padding-top: 0.45rem; font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: 0.06em; color: var(--color-accent); }
.s-index__title { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-2xl); line-height: 1.12; letter-spacing: var(--tracking-display); transition: color var(--duration-fast) var(--ease-out); }
.s-index__text { grid-column: 2; font-size: 0.9375rem; line-height: 1.5; color: var(--color-secondary); max-width: 34rem; }
.s-index__arrow { grid-column: 3; grid-row: 1; margin-top: 0.3rem; color: var(--color-muted-foreground); transition: transform var(--duration-base) var(--ease-out), color var(--duration-base) var(--ease-out); }
.s-index__link:hover .s-index__title { color: var(--color-accent); }
.s-index__link:hover .s-index__arrow { transform: translateX(4px); color: var(--color-accent); }
@media (min-width: 900px) {
  .s-index--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-7); }
  .s-index--cols li:nth-child(2) .s-index__link { border-top-color: var(--color-foreground); }
  .s-index--cols li:nth-last-child(2):nth-child(odd) .s-index__link { border-bottom: 1px solid var(--color-border); }
  .s-index--cols .s-index__link { height: 100%; }
}

/* Колонки-тезисы с линейкой сверху */
.s-pillars { display: grid; gap: var(--space-5); }
.s-pillar { display: grid; gap: var(--space-3); align-content: start; padding-top: var(--space-4); border-top: 1px solid var(--color-foreground); }
.s-pillar__num { font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: 0.06em; color: var(--color-accent); }
.s-pillar__title { font-size: var(--text-2xl); line-height: 1.12; }
.s-pillar__text { font-size: 0.9375rem; line-height: 1.55; color: var(--color-secondary); }
@media (min-width: 720px) { .s-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); } }
@media (min-width: 1000px) {
  .s-pillars--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .s-pillars--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); }
}

/* Заголовок слева, содержимое справа; заголовок прилипает на широком экране */
.s-split-head { margin-bottom: 0; }
.s-split-head .link { justify-self: start; }
@media (max-width: 899px) { .s-split-head { margin-bottom: var(--space-2); } }

/* Подпись под сеткой лотов */
.s-list-note { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-5); margin-top: var(--space-6); }
.s-list-note .valid-note { max-width: 40rem; }

/* ------------------------------------------------------------------ */
/* 4. Закрывающий блок с формой                                        */
/* ------------------------------------------------------------------ */

.s-closing__intro { display: grid; gap: var(--space-5); align-content: start; }
.s-closing__intro .section-head { margin-bottom: 0; }
.s-person { display: flex; align-items: center; gap: var(--space-4); }
.s-person__name { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-2xl); line-height: 1.1; }
.s-person__role { font-size: var(--text-sm); line-height: 1.4; color: var(--color-secondary); margin-top: 0.2rem; max-width: 20rem; }

/* Свои формы: оценка и передача клиента */
.s-form__group { display: grid; gap: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.s-form__group:first-of-type { padding-top: 0; border-top: 0; }
.s-form__legend { font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--color-muted-foreground); }
.s-form .segmented--wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row; }
@media (min-width: 480px) { .s-form .segmented--wrap { grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); grid-auto-columns: auto; } }

/* ------------------------------------------------------------------ */
/* 5. Услуги                                                           */
/* ------------------------------------------------------------------ */

.s-route { display: grid; }
.s-route__stage { display: grid; gap: var(--space-5); padding-block: clamp(var(--space-6), 5vw, var(--space-7)); border-top: 1px solid var(--color-foreground); }
.s-route__stage:last-child { padding-bottom: 0; }
.s-route__head { display: grid; gap: var(--space-2); align-content: start; }
.s-route__num { font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: 0.06em; color: var(--color-accent); }
.s-route__title { font-size: var(--text-3xl); line-height: 1.05; }
.s-route__text { font-size: 0.9375rem; line-height: 1.55; color: var(--color-secondary); max-width: 24rem; }
.s-route__cards { display: grid; gap: var(--space-4); }
@media (min-width: 640px) { .s-route__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) {
  .s-route__stage { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(var(--space-6), 5vw, var(--space-8)); }
  .s-route__head { position: sticky; top: calc(var(--shell-top) + var(--space-5)); }
}

.s-service-price { display: grid; gap: var(--space-3); padding: clamp(var(--space-5), 4vw, var(--space-6)); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-card); color: var(--color-card-foreground); }
.s-service-price__value { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-3xl); line-height: 1.08; letter-spacing: var(--tracking-display); text-wrap: balance; }
.s-service-price__text { font-size: 0.9375rem; line-height: 1.55; color: var(--color-secondary); }

.s-two { display: grid; gap: var(--space-6); }
.s-two__col { display: grid; gap: var(--space-4); align-content: start; }
.s-two__title { font-size: var(--text-3xl); line-height: 1.05; padding-top: var(--space-4); border-top: 1px solid var(--color-foreground); }
.s-two .check-list, .s-two .dash-list { gap: var(--space-3); font-size: var(--text-lg); line-height: 1.45; }
.s-two .check-list .icon { margin-top: 0.3em; }
.s-two .dash-list li::before { top: 0.8em; }
@media (min-width: 900px) { .s-two { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(var(--space-6), 6vw, var(--space-9)); } }

.s-neighbors { display: grid; gap: var(--space-4); }
@media (min-width: 720px) { .s-neighbors { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.s-neighbor { position: relative; display: grid; gap: 0.35rem; min-height: 64px; padding: var(--space-4) var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-md); text-decoration: none; transition: border-color var(--duration-base) var(--ease-out); }
.s-neighbor:hover { border-color: var(--color-border-strong); }
.s-neighbor__dir { display: inline-flex; align-items: center; gap: 0.4rem; font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--color-muted-foreground); }
.s-neighbor__title { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-xl); line-height: 1.15; }
.s-neighbor--next { text-align: right; justify-items: end; }

/* ------------------------------------------------------------------ */
/* 6. База знаний и материал                                           */
/* ------------------------------------------------------------------ */

.s-kb-tools { display: grid; gap: var(--space-4); margin-bottom: var(--space-5); }
.s-kb-search { max-width: 36rem; }
.s-kb-status { min-height: 1.5rem; font-size: var(--text-sm); color: var(--color-muted-foreground); margin-bottom: var(--space-4); }
.s-chip-count { font-size: var(--text-xs); opacity: 0.75; font-variant-numeric: tabular-nums; }

.s-article { padding-bottom: var(--section-y); }
.s-article__head { display: grid; gap: var(--space-4); padding-block: clamp(var(--space-5), 5vw, var(--space-7)) var(--space-6); }
.s-article__title { font-size: clamp(2.125rem, 1.5rem + 3vw, 3.5rem); line-height: 1.04; }
.s-article__lead { font-size: var(--text-xl); line-height: 1.45; color: var(--color-secondary); }
.s-article__body { padding-top: var(--space-6); border-top: 1px solid var(--color-foreground); }
.s-article__body .prose h2 { font-size: var(--text-2xl); line-height: 1.15; }
.s-article__foot { display: grid; gap: var(--space-4); margin-top: var(--space-7); padding-top: var(--space-5); border-top: 1px solid var(--color-border); }
.s-cta-panel { display: grid; gap: var(--space-4); padding: clamp(var(--space-5), 4vw, var(--space-7)); border-radius: var(--radius-md); }
.s-cta-panel__title { font-size: var(--text-3xl); line-height: 1.05; max-width: 22ch; }
.s-cta-panel__text { color: var(--color-secondary); max-width: 34rem; }
.s-cta-panel__actions { display: grid; gap: var(--space-3); margin-top: var(--space-2); }
@media (min-width: 480px) { .s-cta-panel__actions { display: flex; flex-wrap: wrap; } }

/* ------------------------------------------------------------------ */
/* 7. Обо мне и контакты                                               */
/* ------------------------------------------------------------------ */

.s-about-hero { display: grid; gap: var(--space-6); }
.s-about-hero__portrait .portrait { width: min(100%, 16rem); }
@media (min-width: 900px) {
  .s-about-hero { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(var(--space-6), 6vw, var(--space-9)); align-items: end; }
  .s-about-hero__portrait { justify-self: end; width: 100%; }
  .s-about-hero__portrait .portrait { width: 100%; }
}

.s-story { display: grid; }
.s-story__item { display: grid; gap: var(--space-2) var(--space-5); padding-block: var(--space-5); border-top: 1px solid var(--color-border); }
.s-story__item:first-child { border-top-color: var(--color-foreground); }
.s-story__item:last-child { border-bottom: 1px solid var(--color-border); }
.s-story__when { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-2xl); line-height: 1.1; color: var(--color-accent); }
.s-story__title { font-weight: var(--weight-bold); font-size: var(--text-lg); line-height: 1.3; }
.s-story__text { margin-top: 0.4rem; color: var(--color-secondary); max-width: 36rem; }
@media (min-width: 640px) { .s-story__item { grid-template-columns: 10.5rem minmax(0, 1fr); } }

.s-facts { display: grid; counter-reset: fact; }
.s-facts li { counter-increment: fact; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); padding-block: var(--space-4); border-top: 1px solid var(--color-border); font-size: var(--text-lg); line-height: 1.45; }
.s-facts li:last-child { border-bottom: 1px solid var(--color-border); }
.s-facts li::before { content: counter(fact, decimal-leading-zero); padding-top: 0.4em; font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: 0.06em; color: var(--color-accent); font-variant-numeric: tabular-nums; }

.s-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.s-tags li { padding: 0.45rem 0.85rem; border: 1px solid var(--color-border-strong); border-radius: var(--radius-pill); font-size: 0.9375rem; line-height: 1.3; }

.s-phone { display: inline-flex; align-items: center; min-height: 56px; font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: clamp(2.125rem, 1.5rem + 3.4vw, 3.5rem); line-height: 1; letter-spacing: -0.01em; text-decoration: none; white-space: nowrap; transition: color var(--duration-fast) var(--ease-out); }
.s-phone:hover { color: var(--color-accent); }
.s-contact-block { display: grid; gap: var(--space-3); padding-top: var(--space-5); border-top: 1px solid var(--color-border); }
.s-contact-block__title { font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--color-muted-foreground); }
.s-contact-col { display: grid; gap: var(--space-5); align-content: start; }

/* ------------------------------------------------------------------ */
/* 8. Политика                                                         */
/* ------------------------------------------------------------------ */

.s-legal .prose { font-size: var(--text-base); line-height: 1.65; }
.s-legal .prose h2 { font-size: var(--text-2xl); line-height: 1.15; margin-top: 2em; }
.s-legal .prose a:not(.btn) { text-decoration: underline; }
.s-legal__toc { display: grid; gap: 0; margin-top: var(--space-5); }
.s-legal__toc a { display: flex; align-items: center; min-height: 44px; border-bottom: 1px solid var(--color-border); text-decoration: none; font-weight: var(--weight-semibold); }
.s-legal__toc a:hover { color: var(--color-accent); }
.s-legal__toc li:first-child a { border-top: 1px solid var(--color-border); }

/* ------------------------------------------------------------------ */
/* 9. Не найдено внутри шаблона                                        */
/* ------------------------------------------------------------------ */

.s-missing { padding-block: clamp(var(--space-6), 8vw, var(--space-9)); }

/* Номера этапов на сером фоне: акцентный цвет там не проходит по контрасту (4,3), берём тёмную бронзу. */
.section--muted .steps__num, .section--muted .s-pillar__num, .section--muted .s-index__num, .section--muted .s-duo__num { color: var(--color-on-accent-soft); }
.section--muted .theme-dark .s-duo__num, .section--muted .s-duo__item:not(.theme-dark) .s-duo__num { color: var(--color-accent); }

/* Заголовок раздела «в строку» без ссылки-действия: дети не должны разъезжаться по двум колонкам сетки ядра. */
@media (min-width: 900px) { .section-head--row > :not(.section-head__action) { grid-column: 1; } }

/* Закреплённая кнопка — только на телефоне: на широком экране форма и кнопки шапки страницы и так на виду. */
@media (min-width: 900px) { .sticky-cta { display: none; } }

/* Нечётное число услуг на этапе: первая карточка — во всю ширину, чтобы в сетке не оставалось дыры. */
@media (min-width: 640px) { .s-route__cards--odd > :first-child { grid-column: 1 / -1; } }

/* Рубрики на широком экране переносятся, а не листаются. */
@media (min-width: 900px) { .s-kb-tools .chips[data-scroll-x] { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding: 0; } }

/* Число комнат: пять вариантов в одну строку, «Студия» занимает две доли. */
.s-form [data-field="rooms"] .segmented { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-flow: row; }
.s-form [data-field="rooms"] .segmented__item:first-child { grid-column: span 2; }
.s-form [data-field="rooms"] .segmented__item span { padding-inline: 0.25rem; }
