/* ======================================================================
   Арсдок — base.css
   Токены дизайн-системы, сброс, типографика, кнопки, шапка и логотип.
   Подключается: все страницы
   ====================================================================== */

:root{
  --ink: #161f30; --ink-2: #26314a;
  --paper: #edefec; --paper-2: #e3e6e1; --paper-3: #f6f7f5;
  --gold: #a9762f; --gold-2: #c99a4b;
  --stamp-red: #8b3a3a; --green: #3f6c4e;
  --text: #1b2231; --text-muted: #5a6472; --line: #d3d7cf; --radius:2px;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{ background:var(--paper); color:var(--text); font-family:'Inter',sans-serif; line-height:1.5; -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; cursor:pointer; }
.mono{ font-family:'IBM Plex Mono',monospace; }
.serif{ font-family:'PT Serif',serif; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
header.site{ background:var(--paper); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50; }
header.site .wrap{ display:flex; align-items:center; justify-content:space-between; gap:24px; height:84px; }
/* Логотип и правый блок не сжимаются, меню отдаёт ширину первым.
   Без этого длинные пункты переносились внутри себя и наезжали друг на друга:
   высота строки 84px фиксирована, второй строке просто некуда деться. */
.logo{ flex:0 0 auto; }
.header-actions{ flex:0 0 auto; }
.logo{ display:flex; align-items:center; gap:12px; }
.logo-mark{ width:42px; height:42px; border:1.5px solid var(--ink); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'PT Serif',serif; font-weight:700; font-size:15px; position:relative; flex-shrink:0; }
.logo-mark::before{ content:''; position:absolute; inset:4px; border:1px solid var(--gold); border-radius:50%; }
.logo-text{ display:flex; flex-direction:column; line-height:1.15; }
/* Название в логотипе — капителью: заглавные с небольшим разрядкой,
   иначе буквы слипаются. Меняется только отображение, разметка и тексты
   договора остаются как есть. */
.logo-text b{ font-family:'PT Serif',serif; font-size:20px; text-transform:uppercase; letter-spacing:.06em; }
.logo-text small{ color:var(--text-muted); font-size:11.5px; text-transform:uppercase; letter-spacing:0.03em; white-space:nowrap; }
/* .wrap ограничен 1180px, поэтому на широком экране места больше не становится
   и подзаголовок с меню за одну строку не борются — они не помещаются вместе
   при любой ширине окна. Там, где меню видно, подзаголовок убираем; ниже 1060px
   меню сворачивается, место освобождается и подзаголовок возвращается. */
@media (min-width:1061px){ .logo-text small{ display:none; } }
.header-actions{ display:flex; align-items:center; gap:18px; }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 22px; font-size:14px; font-weight:600; border-radius:var(--radius); border:1px solid transparent; cursor:pointer; transition:all .18s ease; white-space:nowrap; }
.btn-primary{ background:var(--ink); color:#f4f2ea; }
.btn-primary:hover{ background:var(--gold); color:var(--ink); }
.btn-ghost{ border-color:var(--ink); color:var(--ink); background:transparent; }
.btn-ghost:hover{ background:var(--ink); color:#f4f2ea; }
.btn-lg{ padding:15px 26px; font-size:14.5px; }