/* ============================================================
   Единый стиль юридических страниц CS2LAND
   Используется на /oferta/, /terms/, /personal-data/, /refund/.
   Один и тот же файл лежит копией в assets/css/1.css каждого
   из этих модулей — модули на движке самодостаточны и общего
   места для CSS у них нет. Правите один — переносите во все.

   Палитра — переменные темы NEO (:root).
   ⚠ Глобальное правило темы svg{width:1rem;height:1rem} —
   размеры svg задаём явно.
   ============================================================ */

.lgl {
  --lgl-line: var(--transparent-10-w, rgba(255, 255, 255, .1));
  --lgl-line-soft: var(--transparent-5-w, rgba(255, 255, 255, .05));
  color: var(--text-default, #fff);
  font-family: var(--font-family-2, inherit);
}

.lgl *,
.lgl *::before,
.lgl *::after { box-sizing: border-box; }

.lgl svg { flex-shrink: 0; }

/* ---------- Шапка документа ---------- */

.lgl-hero {
  padding: 26px 28px;
  margin-bottom: 18px;
  border: 1px solid var(--lgl-line);
  border-radius: var(--br-16, 16px);
  background:
    radial-gradient(900px 240px at 0% 0%, var(--money-bg, rgba(244, 202, 128, .1)), transparent 65%),
    var(--card, #1f1f28);
}

.lgl-hero__eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  font-size: var(--font-size-xs, 10px);
  font-weight: var(--font-weight-7, 700);
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--money, #f4ca80);
}

.lgl-hero__title {
  margin: 0 0 8px;
  font-family: var(--font-family-1, inherit);
  font-size: var(--font-size-xxl, 22px);
  font-weight: var(--font-weight-7, 700);
  line-height: 1.25;
  color: var(--text-default, #fff);
}

.lgl-hero__sub {
  margin: 0;
  max-width: 720px;
  font-size: var(--font-size-m, 14px);
  line-height: 1.55;
  color: var(--text-secondary, #9fa2b9);
}

/* Строка «оператор / контакт / дата» */
.lgl-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.lgl-meta__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 10px 14px;
  border: 1px solid var(--lgl-line-soft);
  border-radius: var(--br-10, 10px);
  background: var(--transparent-3-w, rgba(255, 255, 255, .03));
}

.lgl-meta__label {
  font-size: var(--font-size-xs, 10px);
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text-secondary, #9fa2b9);
}

.lgl-meta__value {
  font-size: var(--font-size-s, 12px);
  font-weight: var(--font-weight-6, 600);
  color: var(--text-default, #fff);
  overflow-wrap: anywhere;
}

.lgl-meta__value a { color: var(--money, #f4ca80); text-decoration: none; }
.lgl-meta__value a:hover { text-decoration: underline; }

/* Плашка «главное в двух строках» */
.lgl-note {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 14px 16px;
  margin-bottom: 18px;
  border: 1px solid var(--money-bg, rgba(244, 202, 128, .1));
  border-left: 3px solid var(--money, #f4ca80);
  border-radius: var(--br-10, 10px);
  background: var(--money-bg, rgba(244, 202, 128, .1));
  font-size: var(--font-size-s, 12px);
  line-height: 1.6;
  color: var(--text-secondary, #9fa2b9);
}

.lgl-note svg { width: 17px; height: 17px; flex: 0 0 17px; margin-top: 1px; fill: var(--money, #f4ca80); }
.lgl-note b { color: var(--text-default, #fff); }

/* ---------- Оглавление ---------- */

.lgl-toc {
  padding: 16px 18px;
  margin-bottom: 18px;
  border: 1px solid var(--lgl-line);
  border-radius: var(--br-12, 12px);
  background: var(--transparent-3-w, rgba(255, 255, 255, .03));
}

.lgl-toc__title {
  margin-bottom: 10px;
  font-size: var(--font-size-xs, 10px);
  font-weight: var(--font-weight-7, 700);
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--money, #f4ca80);
}

/* minmax(0,…) — иначе длинный пункт распирает грид (готча темы) */
.lgl-toc__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: lgl-toc;
}

.lgl-toc__list a {
  display: block;
  padding: 5px 0;
  font-size: var(--font-size-s, 12px);
  line-height: 1.45;
  color: var(--text-secondary, #9fa2b9);
  text-decoration: none;
  transition: var(--transition-ease-2, all .2s ease);
}

.lgl-toc__list a:hover { color: var(--text-default, #fff); }
.lgl-toc__list a.is-active { color: var(--money, #f4ca80); }

/* ---------- Разделы ---------- */

.lgl-doc {
  padding: 4px 28px 26px;
  border: 1px solid var(--lgl-line);
  border-radius: var(--br-16, 16px);
  background: var(--card, #1f1f28);
}

.lgl-section {
  padding-top: 26px;
  /* якорь не должен уводить заголовок под фиксированную шапку сайта */
  scroll-margin-top: 90px;
}

.lgl-section + .lgl-section { border-top: 1px solid var(--lgl-line-soft); }

.lgl-section__title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 14px;
  font-family: var(--font-family-1, inherit);
  font-size: var(--font-size-l, 18px);
  font-weight: var(--font-weight-7, 700);
  line-height: 1.3;
  color: var(--text-default, #fff);
}

.lgl-section__num {
  flex: 0 0 auto;
  font-size: var(--font-size-m, 14px);
  font-weight: var(--font-weight-8, 800);
  color: transparent;
  -webkit-text-stroke: 1px var(--money, #f4ca80);
}

.lgl-anchor {
  margin-left: auto;
  padding-left: 10px;
  font-size: var(--font-size-m, 14px);
  color: var(--money, #f4ca80);
  text-decoration: none;
  opacity: 0;
  transition: opacity .2s ease;
}

.lgl-section:hover .lgl-anchor { opacity: .7; }
.lgl-anchor:hover { opacity: 1 !important; }

/* на тач-устройствах hover нет — показываем якорь приглушённым */
@media (hover: none) {
  .lgl-anchor { opacity: .4; }
}

.lgl-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lgl-list > li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  font-size: var(--font-size-m, 14px);
  line-height: 1.65;
  color: var(--text-secondary, #9fa2b9);
}

.lgl-list > li > .lgl-num {
  font-size: var(--font-size-s, 12px);
  font-weight: var(--font-weight-7, 700);
  color: var(--text-default, #fff);
  opacity: .55;
  padding-top: 2px;
  white-space: nowrap;
}

.lgl-list b,
.lgl-list strong { color: var(--text-default, #fff); font-weight: var(--font-weight-6, 600); }

.lgl-list a { color: var(--money, #f4ca80); text-decoration: none; }
.lgl-list a:hover { text-decoration: underline; }

/* Вложенный перечень внутри пункта */
.lgl-sublist {
  margin: 8px 0 0;
  padding: 0 0 0 2px;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.lgl-sublist li {
  position: relative;
  padding-left: 16px;
  font-size: var(--font-size-s, 12px);
  line-height: 1.6;
}

.lgl-sublist li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: .62em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--money, #f4ca80);
  opacity: .7;
}

/* Акцентная врезка внутри раздела */
.lgl-callout {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid var(--span-10, rgba(118, 171, 41, .1));
  border-left: 3px solid var(--span, #76ab29);
  border-radius: var(--br-10, 10px);
  background: var(--span-10, rgba(118, 171, 41, .1));
  font-size: var(--font-size-s, 12px);
  line-height: 1.6;
  color: var(--text-secondary, #9fa2b9);
}

.lgl-callout b { color: var(--text-default, #fff); }

/* ---------- Подвал документа ---------- */

.lgl-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding: 18px 20px;
  border: 1px solid var(--lgl-line);
  border-radius: var(--br-12, 12px);
  background: var(--transparent-3-w, rgba(255, 255, 255, .03));
}

.lgl-footer__text b { display: block; margin-bottom: 3px; color: var(--text-default, #fff); font-size: var(--font-size-m, 14px); }
.lgl-footer__text span { font-size: var(--font-size-s, 12px); color: var(--text-secondary, #9fa2b9); }

.lgl-footer__links { display: flex; gap: 8px; flex-wrap: wrap; }

.lgl-footer__links a {
  padding: 9px 14px;
  border: 1px solid var(--lgl-line);
  border-radius: var(--br-10, 10px);
  font-size: var(--font-size-s, 12px);
  color: var(--text-default, #fff);
  text-decoration: none;
  transition: var(--transition-ease-2, all .2s ease);
}

.lgl-footer__links a:hover { background: var(--transparent-5-w, rgba(255, 255, 255, .05)); }

/* ---------- Мобильные ---------- */

@media (max-width: 760px) {
  .lgl-hero { padding: 20px 18px; }
  .lgl-hero__title { font-size: var(--font-size-l, 18px); }
  .lgl-doc { padding: 4px 18px 20px; }
  .lgl-toc__list { grid-template-columns: minmax(0, 1fr); }
  .lgl-list > li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .lgl-list > li > .lgl-num { padding-top: 0; }
  .lgl-section__title { font-size: var(--font-size-m, 14px); }
  .lgl-footer__links { width: 100%; }
  .lgl-footer__links a { flex: 1 1 auto; text-align: center; }
}