/* RESI — компоненты (файл 55, разделы 4, 6, 7): основа текста, ссылки, кнопки, поля, фокус, знак RESI.
   Подключается после tokens.css и до стилей страницы. Раскладка страниц — в style.css / landing.css. */

/* атрибут hidden сильнее любого display у компонентов (иначе скрытые кнопки видны) */
[hidden]{display:none!important}
*,*::before,*::after{box-sizing:border-box}
body{font-family:var(--font-ui);color:var(--ink);background:var(--bg);font-size:16px;line-height:1.55;-webkit-text-size-adjust:100%}
.t-mono{font-family:var(--font-mono);font-size:14px;text-transform:uppercase;letter-spacing:.02em;color:var(--muted)}

/* ссылки */
a{color:var(--navy);text-underline-offset:3px}
a:hover{color:var(--navy-hover)}
.link-action{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:5px}

/* фокус с клавиатуры: контур 2 px navy + зазор 2 px */
:focus-visible{outline:2px solid var(--navy);outline-offset:2px}

/* кнопки: основная — navy; вторичная — граница navy; ссылка-действие — подчёркнутый текст */
.btn,.btn-main,.btn-alt{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--ctl-h);padding:0 28px;
  border:1.5px solid var(--navy);border-radius:var(--radius);background:var(--navy);color:#fff;
  font:600 16px/1.2 var(--font-ui);text-decoration:none;text-align:center;cursor:pointer}
.btn:hover,.btn-main:hover{background:var(--navy-hover);border-color:var(--navy-hover);color:#fff}
.btn:active,.btn-main:active{background:var(--navy-active);border-color:var(--navy-active)}
.btn.secondary,.btn-alt{background:transparent;color:var(--navy)}
.btn.secondary:hover,.btn-alt:hover{background:transparent;color:var(--navy-hover);border-color:var(--navy-hover)}
.btn.secondary:active,.btn-alt:active{color:var(--navy-active);border-color:var(--navy-active)}
.btn.link{min-height:auto;padding:0;border:0;background:none;color:var(--navy);text-decoration:underline;text-underline-offset:5px}
.btn.link:hover{background:none;color:var(--navy-hover)}
/* отключено: читается, граница --line-strong, текст --muted */
.btn:disabled,.btn[aria-disabled="true"]{background:var(--surface);border-color:var(--line-strong);color:var(--muted);cursor:not-allowed;opacity:1}
.btn.link:disabled{background:none;border:0}

/* поля ввода: высота 48, граница --line-strong, белый фон, радиус 4 */
input[type=text],input[type=email],input[type=date],select{min-height:var(--ctl-h)}
input[type=text],input[type=email],input[type=date],select,textarea{width:100%;padding:11px 12px;border:1px solid var(--line-strong);border-radius:var(--radius-ctl);
  background:var(--surface);color:var(--ink);font:16px/1.4 var(--font-ui)}
input[type=text]:focus-visible,input[type=email]:focus-visible,input[type=date]:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
/* ошибка: граница --err + текст под полем со значком (не только цвет) */
.field-invalid input,.field-invalid select,.field-invalid textarea,[aria-invalid="true"]{border-color:var(--err)}
.error:not(:empty){color:var(--err);display:flex;gap:8px;align-items:flex-start}
.error:not(:empty)::before{content:"";flex:none;width:16px;height:16px;margin-top:.2em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='%23B42318' stroke-width='1.6'/%3E%3Cpath d='M8 4v5' stroke='%23B42318' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='11.6' r='1.1' fill='%23B42318'/%3E%3C/svg%3E") no-repeat center/16px}
.okmsg:not(:empty){color:var(--ok)}

/* знак RESI: слово (Inter 700, 24 px, navy) + мини-шкала справа: пять сегментов 13×6, зазор 3, выбран третий, ▲ (SVG) под ним */
.brand{display:inline-flex;align-items:center;gap:14px;color:var(--navy);text-decoration:none;font:700 24px/1 var(--font-ui);letter-spacing:.02em}
.brand:hover{color:var(--navy)}
.brand-mark{display:inline-flex;flex-direction:column;align-items:center;gap:3px}
.brand-segs{display:flex;gap:3px}
.brand-segs i{display:block;width:13px;height:6px;background:var(--seg)}
.brand-segs i.on{background:var(--amber)}
.brand-tri{display:block;width:8px;height:6px;fill:var(--amber)}
/* монохромная версия: всё navy, выбранный сегмент заполнен */
.brand.mono-mark .brand-segs i{background:none;box-shadow:inset 0 0 0 1px var(--navy)}
.brand.mono-mark .brand-segs i.on{background:var(--navy)}
.brand.mono-mark .brand-tri{fill:var(--navy)}
@media print{.brand-segs i,.brand-tri{-webkit-print-color-adjust:exact;print-color-adjust:exact}}