/* =====================================================================
   GeoWise — страницы документов: Договор-оферта, Политика, Согласие.
   Компонент .doc. Подключается отдельным файлом сразу после
   components.css (дописывать в components.css нельзя — он FROZEN).
   Все размеры, цвета и отступы — переменные из tokens.css.
   Числа в комментариях: ПК 1440 / планшет 768 / телефон 390.
   Дизайн-114.
   ===================================================================== */

/* Правило пакета `@media (min-width:768px) and (max-width:1023px){:root{--gutter:40px}}`
   снято по наряду Д-114: на планшете поля остаются 48 px, как в tokens.css и на
   остальных страницах сайта, чтобы шапка и подвал совпадали с соседними страницами.
   Сознательное отличие от макета 02_maket (там 40). */

/* ---------- Страница ---------- */
.doc{padding:var(--section-y) 0}                                   /* 104 / 80 / 56 */
.doc .lead{max-width:720px}
.doc-meta{margin-top:var(--gap-lead);font-size:var(--fs-small);line-height:var(--lh-small);color:var(--gray)} /* «Редакция от …» 15/20 */

/* Две колонки на ПК: содержание слева (липкое), текст справа ≤ 720 px */
.doc-layout{display:grid;grid-template-columns:minmax(0,280px) minmax(0,720px);justify-content:space-between;column-gap:var(--gap-head);align-items:start}

/* ---------- Содержание ---------- */
.doc-toc{position:sticky;top:calc(var(--header-h) + var(--gap));max-height:calc(100vh - var(--header-h) - var(--gap) * 2);overflow-y:auto}
.doc-toc__title{display:block;font-size:var(--fs-label);line-height:var(--lh-label);font-weight:700;text-transform:uppercase;color:var(--gray);list-style:none;cursor:default}
.doc-toc__title::-webkit-details-marker{display:none}
.doc-toc__list{margin-top:var(--gap-eyebrow);list-style:none}
.doc .doc-toc__list a{display:block;padding:calc(var(--gap-eyebrow) / 4) 0;font-size:var(--fs-small);line-height:var(--lh-small);color:var(--gray)}
.doc .doc-toc__list a:hover{opacity:.9}
.doc .doc-toc__list a.is-active{color:var(--ink);font-weight:700}

/* ---------- Текст документа ---------- */
.doc-body{min-width:0;overflow-wrap:break-word}
.doc a{color:var(--blue);overflow-wrap:anywhere}
.doc a:hover{opacity:.9}
.doc-sec{scroll-margin-top:calc(var(--header-h) + var(--gap))}
.doc-sec + .doc-sec{margin-top:calc(var(--section-y) / 2)}            /* между разделами 52 / 40 / 28 */
.doc-sec > * + *{margin-top:var(--gap-eyebrow)}                        /* между абзацами 16 / 12 / 12 */
.doc-h2{font-size:var(--fs-title-l);line-height:var(--lh-title-l);font-weight:700;color:var(--ink)} /* 24 / 22 / 20 */
.doc-sec > .doc-h2 + *{margin-top:var(--gap-lead)}                    /* от заголовка раздела 24 / 20 / 18 */
.doc-h3{font-size:var(--fs-title-s);line-height:var(--lh-title-s);font-weight:700;color:var(--ink)} /* 20 / 19 / 18 */
.doc-sec > * + .doc-h3{margin-top:calc(var(--gap-head) - var(--gap-eyebrow) / 2)}
.doc-p{scroll-margin-top:calc(var(--header-h) + var(--gap))}
.doc-num{font-weight:700}                                             /* номер пункта «6.9.» */
.doc-term{font-weight:700}                                            /* определяемый термин в разделе «Термины» */

/* Д-119, правки 90: наборный (основной) текст документов — серый --gray
   #6E6E73, тот же токен, что у «Выясняем, на какие сайты ссылаются…»
   на главной (.rows__item p, components.css). Касается только пунктов,
   абзацев, списков и значений в карточках-таблицах; заголовки документа
   и разделов (.doc-h2/.doc-h3/.doc-card__title/.doc-card__sub) и ссылки
   (.doc a) свои цвета сохраняют — они заданы явно выше. */
.doc-p,.doc-list li,.doc-row__v{color:var(--gray)}

/* Списки с тире */
.doc-list li{position:relative;padding-left:1.5em}
.doc-list li::before{content:"—";position:absolute;left:0;top:0;color:var(--gray-2)}
.doc-list li + li{margin-top:calc(var(--gap-eyebrow) / 2)}             /* 8 / 6 / 6 */

/* ---------- Карточки вместо таблиц ---------- */
.doc-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--gap)}                                /* 24 / 16 / 12 */
.doc-card{min-width:0;background:var(--bg-soft);border-radius:var(--r-lg);padding:var(--card-py) var(--card-px)} /* #F5F5F7, r 32/28/28, поля 32×30 / 24×22 */
.doc-card__title{font-size:var(--fs-title-s);line-height:var(--lh-title-s);font-weight:700;color:var(--ink)}
.doc-card__sub{margin-top:calc(var(--gap-eyebrow) / 2);font-weight:700;color:var(--ink)}
.doc-card__note{font-weight:400;color:var(--gray)}
.doc-card__title + .doc-rows,.doc-card__sub + .doc-rows{margin-top:var(--gap-eyebrow)}
.doc-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);column-gap:var(--gap);padding:var(--gap-eyebrow) 0;border-top:1px solid var(--line-2)}
.doc-card > .doc-rows:first-child > .doc-row:first-child{padding-top:0;border-top:0}
.doc-row:last-child{padding-bottom:0}
.doc-row__k{font-size:var(--fs-small);line-height:var(--lh-small);color:var(--gray)}
.doc-row__v p + p{margin-top:calc(var(--gap-eyebrow) / 2)}

/* ---------- Приложение ---------- */
.doc-sec--app{padding-top:calc(var(--section-y) / 2);border-top:1px solid var(--line-2)}
.doc-sec + .doc-sec--app{margin-top:calc(var(--section-y) / 2)}
.doc-sec--app .doc-meta{margin-top:calc(var(--gap-eyebrow) / 2)}

/* ---------- Планшет и телефон: одна колонка, содержание — раскрывающаяся плашка ---------- */
@media (max-width:1023px){
  .doc-layout{display:block}
  .doc-toc{position:static;max-height:none;overflow:visible;margin-bottom:var(--gap-head);background:var(--bg-soft);border-radius:var(--r-md);padding:var(--card-py) var(--card-px)}
  .doc-toc__title{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:var(--fs-body);line-height:var(--lh-body);text-transform:none;color:var(--ink)}
  .doc-toc__title::after{content:"";width:12px;height:8px;background:currentColor;transition:none;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") center/contain no-repeat;
            mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") center/contain no-repeat}
  .doc-toc[open] .doc-toc__title::after{transform:rotate(180deg)}
  .doc .doc-toc__list a{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
  .doc .doc-toc__list a.is-active{font-weight:400}
}
@media (max-width:767px){
  /* Д-116: границы переноса по замеру приёмки Д-114 — геометрия макета на 390. */
  .doc-body{-webkit-hyphens:auto;hyphens:auto;
    hyphenate-limit-chars:14 7 7;
    -webkit-hyphenate-limit-before:7;-webkit-hyphenate-limit-after:7}
  .doc-body a{-webkit-hyphens:none;hyphens:none}
  .doc-row{grid-template-columns:minmax(0,1fr);row-gap:calc(var(--gap-eyebrow) / 3)}
}
