/* «Абонентам»: после site.css, до core/a11y.css. Только var(--c-*) и rem.
   base.css обнуляет margin у ul/ol[role=list] — отступы таких списков заданы с тегом. */

/* Раскладки 7/5 и 5/7 от 64em */
:is(.ab-head__grid, .connect, .fee, .tu-band, .tariff-grid, .pay-grid, .faq-grid, .ask) { display: grid; gap: 2rem; }
@media (min-width: 64em) {
  :is(.ab-head__grid, .connect, .fee, .tu-band, .tariff-grid, .pay-grid, .faq-grid, .ask) { gap: 2rem clamp(2.5rem, 5vw, 5rem); align-items: start; }
  :is(.ab-head__grid, .connect, .faq-grid, .ask) { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  :is(.fee, .tu-band, .tariff-grid, .pay-grid) { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  :is(.tu-card, .tu-band__intro) { position: sticky; top: var(--sticky-top); }
}

/* ---------- Шапка страницы: «коротко» ---------- */
.glance { padding: 0.25rem 1.25rem; border-radius: var(--radius-l); background: var(--c-surface-2); }
@media (min-width: 64em) { .glance { padding: 0.5rem 1.75rem; } }
.glance__list { margin: 0; }
.glance__list > div { display: grid; gap: 0.125rem; padding-block: 0.875rem; }
.glance__list > div + div { border-top: 1px solid var(--c-line); }
.glance dt { font-size: 0.875rem; color: var(--c-ink-2); }
.glance dd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.75rem; margin: 0; }
.glance__value { font-family: var(--font-display); font-size: 1.1875rem; font-weight: 600; line-height: 1.3; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.glance__sub { font-size: 0.875rem; color: var(--c-ink-2); text-wrap: balance; }
/* Телефон — общий .link-big, размер как у тарифа выше */
.glance__phone { margin-block: -0.5rem; }
.glance .glance__link { margin-block: -0.625rem; }

/* ---------- Подключение ---------- */
.connect__steps .steps__item { padding-bottom: 2rem; }
.connect__steps .steps__title { font-size: clamp(1.125rem, 1.06rem + 0.3vw, 1.3125rem); }
.connect__steps .steps__text { max-width: 36em; }
/* Документы к заявке — простой список с галочками: это не ссылки, их нельзя скачать */
ul.steps__docs { display: grid; gap: 0.25rem; margin-block: 0.5rem 0.625rem; max-width: 30rem; }
.steps__docs li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.5rem; align-items: start; padding-block: 0.1875rem; line-height: 1.45; }
.steps__docs .icon { width: 1rem; height: 1rem; margin-top: 0.25rem; color: var(--c-accent); stroke-width: 2.25; }

/* Карточка у шагов: шкала — общий .capacity__* из site.css */
.tu-card { display: grid; gap: 1rem; padding: var(--pad-card); border-radius: var(--radius-l); box-shadow: var(--shadow-2); }
.tu-card__text { color: var(--c-on-brand-2); }
.tu-card .tu-card__scale { margin: 0.25rem 0 0.5rem; }
.tu-card .capacity__legend { font-size: 0.875rem; }
@media (max-width: 29.99em) { .tu-card .btn { padding-inline: 1rem; } .tu-card .btn .icon { display: none; } }

.fee { margin-top: clamp(3rem, 2rem + 3vw, 4.5rem); padding-top: clamp(2rem, 1.5rem + 2vw, 3rem); border-top: 1px solid var(--c-line); }
.fee__text { margin-top: 0.75rem; color: var(--c-ink-2); max-width: 32em; }
.fee__intro .doc-link { margin-top: 1.25rem; }
.fee__table, .tariff-grid__table, .tariff-grid__tools { display: grid; gap: 1rem; align-content: start; }
.fee-table__cond { display: block; margin-top: 0.125rem; font-size: 0.875rem; font-weight: 400; color: var(--c-ink-2); }
.table .fee-table__value { font-weight: 600; vertical-align: middle; }

/* ---------- Запрос технических условий ---------- */
.tu-band__intro .lead { margin-top: 1rem; }
.plot { display: none; margin-top: 2rem; overflow: hidden; border: 1px solid var(--c-line); border-radius: var(--radius-l); background: var(--c-surface); }
@media (min-width: 64em) { .plot { display: block; } }
/* Участок и уличная сеть разрезом — тем же штрихом, что плитка «Подключиться» на главной */
.plot-art { width: 100%; height: auto; }
.plot-art > * { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.plot-art .soil { fill: var(--c-surface-2); }
.plot-art .ground { stroke: var(--c-line-strong); stroke-width: 1.5; }
.plot-art .edge { stroke: var(--c-line-strong); stroke-width: 1.5; stroke-dasharray: 5 6; }
.plot-art .ink { stroke: var(--c-ink); stroke-width: 2; }
.plot-art .ink-2 { stroke: var(--c-ink-2); stroke-width: 1.5; }
.plot-art .win { fill: var(--c-illu-clean-soft); stroke: var(--c-ink); stroke-width: 1.5; }
.plot-art .pipe { stroke: var(--c-accent); }
.plot-art .pipe-in { stroke: var(--c-illu-clean-soft); }
.plot-art .chev { stroke: var(--c-accent); stroke-width: 2; }
.plot-art .lid { stroke: var(--c-ink); stroke-width: 4; }
.tu-form .tu-form__short { max-width: 12rem; }
.check__hint { grid-column: 2; }

/* ---------- Тарифы ---------- */
ol.rates--page { margin-bottom: clamp(2rem, 1.5rem + 2vw, 3rem); }
.rates--page .rate { gap: 0.375rem; padding: clamp(1.25rem, 1rem + 1vw, 1.75rem) clamp(1.25rem, 1rem + 1vw, 2rem); }
.rates--page .rate__period { font-size: 1rem; font-weight: 600; color: var(--c-ink); }
.rates--page .rate__value { font-size: clamp(2.25rem, 1.55rem + 2.6vw, 3.5rem); }
.rate__net { color: var(--c-ink-2); font-variant-numeric: tabular-nums; }
@media (min-width: 48em) and (max-width: 63.99em) { .tariff-grid__tools { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 1.5rem; } }
.calc__tariff { font-variant-numeric: tabular-nums; }
.calc__tariff .swap { justify-items: start; }
.calc__vat { margin-top: -0.5rem; }
.tariff-table tr.is-year > * { border-top-color: var(--c-line-strong); }
.tag--up { background: var(--c-surface-2); color: var(--c-ink); }
ul.fine { display: grid; gap: 0.375rem; padding-left: 1.125rem; list-style: disc; font-size: 0.875rem; line-height: 1.5; color: var(--c-ink-2); }
.fine li::marker { color: var(--c-line-strong); }

.volume { padding: 1.25rem; border-radius: var(--radius-l); background: var(--c-surface-2); }
.volume__title { font-size: 1.0625rem; }
.volume__eq { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); align-items: center; margin-top: 0.75rem; }
.volume__op { font-family: var(--font-display); font-size: 1.1875rem; font-weight: 600; line-height: 1; color: var(--c-ink-2); }
.volume__term { display: flex; align-items: center; gap: 0.625rem; min-height: 2.5rem; line-height: 1.35; }
.volume__term .icon { width: 1.25rem; height: 1.25rem; color: var(--c-accent); }
.volume__op--sum, .volume__term--sum { align-self: stretch; display: flex; align-items: center; margin-top: 0.375rem; padding-top: 0.375rem; border-top: 2px solid var(--c-ink); }
.volume__term--sum { font-weight: 650; }
.volume__note { margin-top: 0.625rem; font-size: 0.9375rem; color: var(--c-ink-2); }

/* ---------- Оплата и договор ---------- */
.pay { display: grid; justify-items: start; gap: 1rem; padding: var(--pad-card); border-radius: var(--radius-l); background: var(--c-accent-soft); }
.pay__lead { font-size: 1.125rem; }
.pay .btn { margin-top: 0.25rem; }
.pay__note { display: flex; align-items: flex-start; gap: 0.625rem; color: var(--c-ink-2); font-size: 0.9375rem; }
.pay__note .icon { width: 1.25rem; height: 1.25rem; margin-top: 0.0625rem; color: var(--c-accent); }
ul.who { margin-top: 1.25rem; border-top: 1px solid var(--c-line); }
.who__item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; padding-block: 1.25rem; border-bottom: 1px solid var(--c-line); }
.who__icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius-m); background: var(--c-surface-2); color: var(--c-accent); }
.who__icon .icon { width: 1.375rem; height: 1.375rem; }
.who__title { padding-top: 0.5rem; font-size: 1.125rem; }
.who__text { margin-top: 0.25rem; color: var(--c-ink-2); max-width: 36em; }
/* «Договор» — на одной линии с заголовком карточки «Оплата» */
@media (min-width: 64em) { .contract { padding-top: clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem); } }

/* ---------- Вопросы ---------- */
.faq-grid__more { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.5rem; margin-top: 1rem; color: var(--c-ink-2); }
.faq__a .phone { white-space: nowrap; }

/* ---------- Задать вопрос ---------- */
.ask__head .lead { margin-top: 0.875rem; }
.ask__form { max-width: 40rem; margin-top: clamp(1.5rem, 1.2rem + 1vw, 2.25rem); }
.ask__side-title { margin-bottom: 0.75rem; font-size: 1.0625rem; }
@media (min-width: 64em) { .ask__side { margin-top: 0.5rem; } }

/* ---------- Версия для слабовидящих ---------- */
html[data-a11y="on"] :is(.ab-head__grid, .connect, .fee, .tu-band, .tariff-grid, .tariff-grid__tools, .pay-grid, .faq-grid, .ask) { grid-template-columns: minmax(0, 1fr); }
html[data-a11y="on"] :is(.tu-card, .tu-band__intro) { position: static; }
html[data-a11y="on"] :is(.tu-card, .pay, .glance, .volume) { padding: 1rem; outline: 2px solid var(--c-line); outline-offset: -2px; }
html[data-a11y="on"] :is(.glance__value, .rate__value) { letter-spacing: 0; white-space: normal; }
html[data-a11y="on"] .contract { padding-top: 0; }
html[data-a11y="on"] :is(.tu-card, .pay) .btn { padding-inline: 0.75rem; overflow-wrap: anywhere; }
html[data-a11y="on"] :is(.tu-card, .pay) .btn .icon { display: none; }
html[data-a11y="on"] :is(.steps__docs li, .volume__term, .who__text, .fee__text) { overflow-wrap: anywhere; hyphens: auto; }
html[data-a11y="on"] .volume__eq { grid-template-columns: 1.25rem minmax(0, 1fr); }
html[data-a11y="on"] .who__item { grid-template-columns: minmax(0, 1fr); }
html[data-a11y="on"] .glance__phone { margin-block: 0; }
html[data-a11y="on"] .volume__term .icon { display: none; }
html[data-a11y="on"] .rates--page .rate__value { font-size: 2.25rem; }
