/* Статьи LAWERA. Отдельный лёгкий стиль: игровой css весит 70 КБ и тянет
   анимации, а статью человек пришёл ЧИТАТЬ.
   ⚠️ Шрифт тот же, что на сайте (Montserrat, свой файл), чтобы раздел не
   выглядел чужим. */
@font-face {
  font-family: Montserrat; font-style: normal; font-weight: 100 900;
  font-display: swap; src: url("/sloi2/shrift/montserrat.woff2") format("woff2");
}
:root { --fon: #0e0f12; --tekst: #e8e3da; --tusklo: #9a958c; --zoloto: #e2bd80; --karta: #16181d; }
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--fon); color: var(--tekst);
  font-family: Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 17px; line-height: 1.65; -webkit-text-size-adjust: 100%;
}
.verh, .niz {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  max-width: 860px; margin: 0 auto; padding: 18px clamp(16px, 4vw, 28px);
}
.znak { color: var(--tekst); text-decoration: none; font-size: 1.15rem; letter-spacing: 0.14em; line-height: 0; }
/* Логотип вместо слова LaWEra (23.09.2026): «строка» — кольцо и надпись в
   ряд; стопка в шапку не годится — «GROUP» стало бы 5-пиксельным. */
/* ⚠️ Ширина от экрана: на 320–360 логотип 160 px вместе с четырьмя кнопками
   языков давал горизонтальную прокрутку (замер: документ 375 px). */
.znak img { display: block; width: clamp(96px, calc(100vw - 230px), 160px); height: auto; }
.yazyki { display: flex; gap: 4px; }
.yazyki a {
  color: var(--tusklo); text-decoration: none; font-size: 0.82rem;
  padding: 7px 10px; border-radius: 8px; min-height: 40px; display: flex; align-items: center;
}
.yazyki a.tek { color: var(--fon); background: var(--zoloto); }
/* Возврат к консультации и соседние статьи. Оба блока про одно: статья не
   должна быть тупиком — человеку некуда было шагнуть, а весу некуда течь. */
.zov {
  margin: 40px 0 8px; padding: 22px clamp(16px, 4vw, 26px);
  background: var(--karta); border: 1px solid rgba(226, 189, 128, 0.26); border-radius: 14px;
}
.zov-zagol { font-size: 1.12rem; font-weight: 500; color: #fff; margin: 0 0 8px; }
.zov p { color: var(--tusklo); }
.zov-knopka {
  display: inline-flex; align-items: center; min-height: 46px; margin-top: 8px;
  padding: 0 22px; border-radius: 10px; background: var(--zoloto); color: #14161a;
  text-decoration: none; font-weight: 500; letter-spacing: 0.02em;
}
.eshchyo { margin: 34px 0 8px; }
.eshchyo-metka {
  font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--tusklo); margin: 0 0 10px;
}
.eshchyo ul { list-style: none; padding: 0; margin: 0; }
.eshchyo li { margin: 0; border-top: 1px solid rgba(232, 227, 218, 0.12); }
.eshchyo a { display: block; padding: 13px 0; color: var(--tekst); text-decoration: none; line-height: 1.4; }
.eshchyo a:hover { color: var(--zoloto); }
/* «Направление ведёт» — единственное место, где у текста есть живой человек.
   ⚠️ Это НЕ подпись автора: тексты писал не он. Станет «проверил, дата»,
   когда юрист их вычитает. */
.vedet {
  margin: 30px 0 0; padding-top: 14px; color: var(--tusklo); font-size: 0.9rem;
  border-top: 1px solid rgba(232, 227, 218, 0.12);
}
.vedet a { color: var(--tekst); text-decoration: none; }
.vedet a:hover { color: var(--zoloto); }
.podval { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.podval a { color: var(--tusklo); text-decoration: none; font-size: 0.86rem; }
.podval a:hover { color: var(--zoloto); }
.niz { flex-wrap: wrap; }
.polosa { max-width: 720px; margin: 0 auto; padding: 8px clamp(16px, 4vw, 28px) 56px; }
h1 { font-size: clamp(1.7rem, 5vw, 2.5rem); line-height: 1.15; font-weight: 500; margin: 18px 0 10px; }
h2 { font-size: clamp(1.2rem, 3.4vw, 1.5rem); font-weight: 500; margin: 34px 0 10px; }
h3 { font-size: 1.1rem; font-weight: 500; margin: 26px 0 8px; }
p, li { margin: 0 0 12px; }
ul, ol { padding-left: 22px; }
/* ⚠️ Нумерованный список — это «порядок действий по шагам», самое
   ценное в статье. Ему нужен воздух между пунктами, иначе шаги
   читаются как сплошной текст. */
ol li { margin-bottom: 8px; }
/* ⚠️ Таблица на телефоне шире экрана — заворачиваем её, а не страницу:
   иначе горизонтально поедет весь текст. */
.tablica-obertka { overflow-x: auto; margin: 22px 0; -webkit-overflow-scrolling: touch; }
table { border-collapse: collapse; width: 100%; min-width: 420px; font-size: 0.94rem; }
th, td { text-align: left; padding: 10px 14px; border-bottom: 1px solid rgba(232, 227, 218, 0.12); }
th { color: var(--zoloto); font-weight: 500; white-space: nowrap; }
tr:last-child td { border-bottom: none; }
strong { color: #fff; font-weight: 600; }
a { color: var(--zoloto); }
.putj, .data { color: var(--tusklo); font-size: 0.85rem; }
blockquote {
  margin: 22px 0; padding: 14px 18px; border-left: 3px solid var(--zoloto);
  background: var(--karta); border-radius: 0 12px 12px 0; color: var(--tekst);
}
blockquote p:last-child { margin-bottom: 0; }
.vstup { color: var(--tusklo); margin-bottom: 26px; }
.spisok { list-style: none; padding: 0; margin: 0; }
.spisok li { margin: 0 0 12px; }
.spisok a {
  display: block; background: var(--karta); border: 1px solid rgba(232, 227, 218, 0.08);
  border-radius: 14px; padding: 16px 18px; text-decoration: none; color: var(--tekst);
}
.spisok a:hover { border-color: rgba(226, 189, 128, 0.45); }
.spisok b { display: block; font-weight: 500; margin-bottom: 4px; }
.spisok span { color: var(--tusklo); font-size: 0.9rem; }
.razdel { color: var(--zoloto); font-size: 0.78rem; letter-spacing: 0.14em;
          text-transform: uppercase; margin: 34px 0 12px; }
.niz { border-top: 1px solid rgba(232, 227, 218, 0.08); color: var(--tusklo); font-size: 0.85rem; }
.niz a { color: var(--tusklo); }
/* Реквизиты (23.09.2026): юрлицо, лицензия, адрес, телефон офиса. */
.rekvizity { flex-basis: 100%; font-size: 0.8rem; line-height: 1.5; }

/* Карточки команды. Круглые портреты: в присланной презентации они круглые,
и квадратные на сайте выглядели бы как другая компания. */
.komanda {
display: grid; gap: 22px 16px; margin: 26px 0 8px;
grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
}
.chelovek { margin: 0; text-align: center; }
.chelovek img {
width: 108px; height: 108px; border-radius: 50%; object-fit: cover;
background: var(--karta); border: 1px solid rgba(226, 189, 128, 0.28);
}
.chelovek figcaption { display: block; margin-top: 9px; line-height: 1.35; }
.chelovek b { display: block; font-weight: 500; font-size: 0.92rem; }
.chelovek span { display: block; color: var(--tusklo); font-size: 0.78rem; margin-top: 3px; }
/* Основатели на странице «О нас» — крупнее карточек команды: это лица
   обращения, которое стоит рядом. */
.osnovateli { display: flex; flex-wrap: wrap; justify-content: center; gap: 22px 40px; margin: 24px 0 8px; }
.osnovateli .chelovek { width: 170px; }
.osnovateli .chelovek img { width: 140px; height: 140px; }
/* Карточка без фото (23.09.2026): инициалы в круге размером с портрет.
   Фото не выдумываем — ждём настоящее от компании. */
.chelovek .inicialy {
display: flex; align-items: center; justify-content: center; margin: 0 auto 17px; /* 17 = 9 (отступ подписи, схлопывается) + 8 (зазор под строчной img у соседей) */
width: 108px; height: 108px; border-radius: 50%;
background: var(--karta); border: 1px solid rgba(226, 189, 128, 0.28);
color: var(--zoloto); font-size: 1.7rem; font-weight: 400; letter-spacing: 0.08em;
}

/* Калькуляторы. ⚠️ Вся таблица и ставки напечатаны в разметке — скрипт их
   только пересчитывает. Без JavaScript страница остаётся полезной. */
.schyot {
  margin: 26px 0; padding: 20px clamp(14px, 3vw, 22px);
  background: var(--karta); border: 1px solid rgba(226, 189, 128, 0.22); border-radius: 14px;
}
.schyot-metka { color: var(--tusklo); font-size: 0.86rem; margin: 0 0 12px; }
.schyot-vvod { display: block; margin: 12px 0; color: var(--tusklo); font-size: 0.9rem; }
.schyot-vvod input, .schyot-vvod select {
  display: block; width: 100%; margin-top: 6px; padding: 11px 13px; font: inherit;
  font-size: 16px; /* мельче — iOS увеличивает страницу при фокусе */
  color: var(--tekst); background: #0f1114;
  border: 1px solid rgba(232, 227, 218, 0.18); border-radius: 9px;
}
.schyot .chislo { text-align: right; white-space: nowrap; }
.schyot-itogo td { border-top: 1px solid rgba(226, 189, 128, 0.3); }
.schyot-vyvod { margin: 16px 0 0; font-size: 1.02rem; }
.schyot-vyvod b { color: var(--zoloto); }
.schyot-zamechanie { margin: 10px 0 0; color: #e8b9a0; font-size: 0.88rem; }
.schyot-ogovorka { margin: 14px 0 0; color: var(--tusklo); font-size: 0.84rem; }