/* Страницы продукта: цены и «о нас» (SCRUM-302, 24.09.2026).

   СВОЕГО СТИЛЯ ЗДЕСЬ ПОЧТИ НЕТ, И ЭТО НАМЕРЕННО. Первый экран - классы первого экрана
   лендинга (`.sc-ln-hero__title`, `.sc-ln-hero__sub`), секции - `.sc-ln-sec` / `.sc-ln-wrap`,
   заголовки разделов - `.sc-ln-h2`, вопросы - аккордеон лендинга, карточки тарифов - окно
   тарифов кабинета (`plans.css`). Своё - только строка «заголовок слева, текст справа»,
   которой у лендинга нет, и списки внутри неё.

   Переменных файл не объявляет: значения - из токенов. Ширину решает контейнерный запрос
   по ширине секции (`.sc-ln-sec` - контейнер), а не медиазапрос к окну. */

/* Первый экран: заголовок и лид слева, как у широкой раскладки лендинга, без центровки. */
.sc-pp-hero{padding-block-end:var(--sc-space-48)}
.sc-pp-hero .sc-ln-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sc-space-24)}
.sc-pp-hero .sc-ln-hero__title{max-inline-size:18ch}
.sc-pp-hero .sc-ln-hero__sub{max-inline-size:52ch}
.sc-pp-hero .sc-note{max-inline-size:60ch}

/* Тарифы: секция идёт вплотную к первому экрану, выбор срока - над сеткой. */
.sc-pp-plans{padding-block-start:0}
.sc-pp-plans .sc-pl__cycle{margin-block-end:var(--sc-space-24)}
/* Ссылка на ценник кредитов под сеткой тарифов (SCRUM-641). */
.sc-pp-more{margin:var(--sc-space-24) 0 0}
.sc-pp-more a{display:inline-flex;align-items:center;gap:var(--sc-space-8);color:var(--sc-ink-900);font-weight:var(--sc-fw-medium);text-decoration:none}
.sc-pp-more a span{text-decoration:underline;text-underline-offset:3px}
.sc-pp-more .sc-icon{font-size:18px}

/* Строка раздела. Линия - сверху у каждой строки: разделы читаются как список, а не как
   поток. На узком - одна колонка, с 900 - заголовок 5 частей, текст 7. */
.sc-pp-sec{padding-block:0}
.sc-pp-row{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sc-space-16) var(--sc-space-48);
  padding-block:var(--sc-space-48);border-block-start:var(--sc-rule-w-hair) solid var(--sc-l-hairline)}
@container (min-width:900px){
  .sc-pp-row{grid-template-columns:minmax(0,5fr) minmax(0,7fr);padding-block:var(--sc-space-64)}
}

.sc-pp-text{display:flex;flex-direction:column;gap:var(--sc-space-16);min-inline-size:0;
  font-size:var(--sc-text-body);line-height:1.6;color:var(--sc-ink-800)}
.sc-pp-text p{margin:0}

/* Пункты: точка вместо маркера браузера - маркер браузера не встаёт по центру первой строки. */
.sc-pp-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--sc-space-12)}
.sc-pp-list li{position:relative;padding-inline-start:var(--sc-space-24)}
.sc-pp-list li::before{content:"";position:absolute;inset-inline-start:var(--sc-space-4);inset-block-start:.7em;
  inline-size:6px;block-size:6px;border-radius:50%;background:var(--sc-ink-400)}

/* Шаги: номер в кружке. */
.sc-pp-steps{margin:0;padding:0;list-style:none;counter-reset:sc-pp-step;display:flex;flex-direction:column;gap:var(--sc-space-16)}
.sc-pp-steps li{position:relative;counter-increment:sc-pp-step;padding-inline-start:44px;min-block-size:28px}
.sc-pp-steps li::before{content:counter(sc-pp-step);position:absolute;inset-inline-start:0;inset-block-start:0;
  display:grid;place-items:center;inline-size:28px;block-size:28px;border-radius:var(--sc-radius-pill);
  border:var(--sc-rule-w-hair) solid var(--sc-l-hairline);background:var(--sc-surface);
  font-size:var(--sc-text-caption);font-weight:var(--sc-fw-medium);font-variant-numeric:tabular-nums}

/* «Every plan includes»: пункты с галочкой, на широком - в две колонки. */
.sc-pp-checks{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:minmax(0,1fr);
  gap:var(--sc-space-12) var(--sc-space-32);font-size:var(--sc-text-body);line-height:1.5;color:var(--sc-ink-800)}
.sc-pp-checks li{display:flex;align-items:flex-start;gap:var(--sc-space-12)}
.sc-pp-checks .sc-icon{flex:none;font-size:20px;color:var(--sc-success)}
@container (min-width:1100px){.sc-pp-checks{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Вопросы - аккордеон лендинга на родном `<details>`: маркер браузера снят, стрелка
   поворачивается по `open`, а не по `aria-expanded`, которого у `<summary>` нет. */
.sc-pp-acc .sc-ln-acc__btn{list-style:none;cursor:pointer}
.sc-pp-acc .sc-ln-acc__btn::-webkit-details-marker{display:none}
.sc-pp-acc details[open] > .sc-ln-acc__btn .sc-icon{rotate:180deg}
.sc-pp-acc .sc-ln-acc__body.sc-pp-text{font-size:var(--sc-text-body-sm);gap:var(--sc-space-12)}

/* Последняя строка: действие страницы. */
.sc-pp-end .sc-ln-wrap{display:flex;flex-wrap:wrap;gap:var(--sc-space-12);padding-block:var(--sc-space-48) clamp(64px,7vw,112px);
  border-block-start:var(--sc-rule-w-hair) solid var(--sc-l-hairline)}

/* БЛОГ ПЛАТФОРМЫ (24.09.2026): лента карточками и статья колонкой для чтения, в той же пластике.
   Карточка - одна ссылка целиком; мера строки статьи - 68 знаков, кегль тела 18, как у текста
   первого экрана лендинга, а не мелкий шрифт справки. */
.sc-bl-meta{margin:0;font-size:var(--sc-text-body-sm);color:var(--sc-ink-600)}
.sc-bl-grid{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sc-space-16)}
@container (min-width:720px){.sc-bl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:1100px){.sc-bl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sc-bl-card__a{block-size:100%;display:flex;flex-direction:column;gap:var(--sc-space-12);padding:var(--sc-space-24);
  border:var(--sc-rule-w-hair) solid var(--sc-l-hairline);border-radius:var(--sc-radius-lg);background:var(--sc-surface);
  color:inherit;text-decoration:none;transition:border-color var(--sc-dur-fast,.15s) ease}
.sc-bl-card__a:hover{border-color:var(--sc-ink-400)}
/* Обложка в карточке (30.09.2026) - во всю ширину карточки, до её рамки: поля карточки снимаются
   отрицательным отступом, углы повторяют скругление карточки изнутри. */
.sc-bl-card__img{display:block;inline-size:calc(100% + 2 * var(--sc-space-24));max-inline-size:none;block-size:auto;
  aspect-ratio:16/9;object-fit:cover;margin-inline:calc(-1 * var(--sc-space-24));margin-block:calc(-1 * var(--sc-space-24)) var(--sc-space-4);
  border-start-start-radius:calc(var(--sc-radius-lg) - 1px);border-start-end-radius:calc(var(--sc-radius-lg) - 1px);background:var(--sc-l-surface-2)}
.sc-bl-card__t{margin:0;font-family:var(--sc-font-display);font-weight:var(--sc-fw-display,400);font-size:22px;line-height:1.25;text-wrap:balance}
.sc-bl-card__ex{margin:0;flex:1;font-size:var(--sc-text-body-sm);color:var(--sc-ink-700);text-wrap:pretty}
.sc-bl-card__go{display:inline-flex;align-items:center;gap:var(--sc-space-8);font-size:var(--sc-text-body-sm);color:var(--sc-ink-900)}
.sc-bl-card__go .sc-icon{font-size:18px}
.sc-bl-card__a:focus-visible{outline:2px solid var(--sc-acc-600);outline-offset:2px}
.sc-bl-empty{margin:0;color:var(--sc-ink-700)}
.sc-bl-pages{margin-block-start:var(--sc-space-32)}
.sc-bl-pages .nav-links{display:flex;flex-wrap:wrap;gap:var(--sc-space-8)}
.sc-bl-pages .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-inline-size:44px;min-block-size:44px;padding-inline:var(--sc-space-12);
  border:var(--sc-rule-w-hair) solid var(--sc-l-hairline);border-radius:var(--sc-radius-pill);color:inherit;text-decoration:none}
.sc-bl-pages .page-numbers.current{background:var(--sc-ink-900);border-color:var(--sc-ink-900);color:var(--sc-surface)}

.sc-bl-head .sc-bl-title{max-inline-size:22ch}
.sc-bl-crumb{display:inline-flex;align-items:center;gap:var(--sc-space-8);font-size:var(--sc-text-body-sm);color:var(--sc-ink-700);text-decoration:none}
.sc-bl-crumb:hover{color:var(--sc-ink-900)}
.sc-bl-crumb .sc-icon{font-size:18px}
/* Обложка статьи - ширины колонки текста: мера `68ch` считается от кегля 18, как у тела. */
.sc-bl-cover{display:block;font-size:18px;inline-size:100%;max-inline-size:68ch;block-size:auto;aspect-ratio:16/9;
  object-fit:cover;margin-block-end:var(--sc-space-32);border-radius:var(--sc-radius-lg);background:var(--sc-l-surface-2)}
.sc-bl-body{max-inline-size:68ch;padding-block-end:clamp(48px,6vw,96px);font-size:18px;line-height:1.7;color:var(--sc-ink-900)}
.sc-bl-body > *{margin-block:0 var(--sc-space-16)}
.sc-bl-body h2{margin-block:var(--sc-space-48) var(--sc-space-16);font-family:var(--sc-font-display);font-weight:var(--sc-fw-display,400);font-size:clamp(26px,2.4vw,32px);line-height:1.2;text-wrap:balance}
.sc-bl-body h3{margin-block:var(--sc-space-32) var(--sc-space-12);font-size:20px;line-height:1.35;font-weight:var(--sc-fw-heading,500)}
.sc-bl-body ul,.sc-bl-body ol{padding-inline-start:var(--sc-space-24)}
.sc-bl-body li{margin-block-end:var(--sc-space-8)}
.sc-bl-body a{color:var(--sc-acc-700);text-decoration:underline;text-underline-offset:3px}
.sc-bl-body a:hover{text-decoration-thickness:2px}
.sc-bl-body strong{font-weight:var(--sc-fw-bold)}

/* Таблица сравнения (SCRUM-302, 24.09.2026): пункт, мы, они. Значение и пояснение - две строки
   в одной ячейке, а не два столбца: на 390 четыре столбца не помещаются без прокрутки, а
   прокрутка таблицы на телефоне прячет половину сравнения. Столбец пунктов шире двух других. */
.sc-cmp{inline-size:100%;table-layout:fixed;border-collapse:collapse;font-size:var(--sc-text-body-sm);line-height:1.5;color:var(--sc-ink-800)}
.sc-cmp caption{caption-side:top;text-align:start;padding-block-end:var(--sc-space-16);color:var(--sc-ink-700)}
.sc-cmp th,.sc-cmp td{padding:var(--sc-space-12) var(--sc-space-8);vertical-align:top;text-align:start;overflow-wrap:anywhere;
  border-block-start:var(--sc-rule-w-hair) solid var(--sc-l-hairline)}
.sc-cmp thead th{border-block-start:0;font-weight:var(--sc-fw-medium);color:var(--sc-ink-900)}
/* Ширины - по первой строке (раскладка fixed): длинное имя продукта в шапке столбца (прод -
   SiteCreatorEngine) иначе раздвигало таблицу за край экрана на 390, замер 24.09.2026. */
.sc-cmp thead th:first-child{inline-size:36%}
.sc-cmp tbody th{font-weight:var(--sc-fw-medium);color:var(--sc-ink-900)}
.sc-cmp th:first-child,.sc-cmp td:first-child{padding-inline-start:0}
.sc-cmp__v{display:block;font-weight:var(--sc-fw-medium);color:var(--sc-ink-900)}
.sc-cmp__n{display:block;margin-block-start:var(--sc-space-4);font-size:var(--sc-text-caption);color:var(--sc-ink-600)}
.sc-pp-text .sc-pp-list a{color:var(--sc-ink-900);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}

/* Кнопка в первом экране страниц отраслей и возможностей (12.10.2026, перед рекламой): пришедший из
   объявления видит действие сразу, а не через 3-4 тысячи точек прокрутки. */
.sc-kp-cta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sc-space-12) var(--sc-space-16);margin:var(--sc-space-24) 0 0}
.sc-kp-cta__note{color:var(--sc-ink-600);font-size:var(--sc-text-caption)}