/* egebro: токены дизайн-системы (claude.ai/artifact/BS9o7mzHkGL3AVhzNi2sDQ) и базовые стили. Mobile-first, от 360 px. */

@font-face{font-family:"Onest";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("../fonts/onest-cyrillic.fe2bd26ae82a.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("../fonts/onest-latin.3db826ed1c5d.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* Цвета */
  --surface:#F6F7F2;
  --surface-raised:#FFFFFF;
  --ink:#14161F;
  --ink-muted:#5A5F6E;
  --line:#DADDD3;
  --graphite:#14161F;
  --on-graphite:#F6F7F2;
  --brand-lime:#C6F432;   /* только заливка, текст на нём — --on-accent */
  --coral:#FF6B4A;        /* только заливка или маркер, текст на нём — --on-accent */
  --coral-text:#B3361A;
  --success:#157A50;
  --on-accent:#14161F;
  --field-border:#8A8F9C; /* граница полей ввода: не меньше 3:1 к фону */
  /* Шрифт */
  --font-sans:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* Отступы */
  --space-2:8px;--space-4:16px;--space-6:24px;--space-12:48px;
  /* Скругления */
  --radius-sm:8px;--radius-md:16px;--radius-pill:999px;
  /* Минимальная высота кнопок и полей */
  --tap:44px;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{
    --surface:#14161F;
    --surface-raised:#1E2130;
    --ink:#F2F3EE;
    --ink-muted:#A3A8B6;
    --line:#2E3242;
    --graphite:#262A3A;
    --on-graphite:#F2F3EE;
    --coral-text:#FF8A6E;
    --success:#4CC38A;
    --field-border:#6B7184;
  }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface);color:var(--ink);font:400 16px/24px var(--font-sans)}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* Типографика */
.display{font:800 40px/44px var(--font-sans);letter-spacing:-.02em;margin:0 0 var(--space-4)}
h1,.h1{font:800 28px/34px var(--font-sans);letter-spacing:-.01em;margin:0 0 var(--space-4)}
h2,.h2{font:700 22px/28px var(--font-sans);margin:var(--space-6) 0 var(--space-2)}
.body-lg{font-size:18px;line-height:28px}
.label{font:600 14px/20px var(--font-sans)}
.caption{font:500 13px/18px var(--font-sans)}
.muted{color:var(--ink-muted)}
.error{color:var(--coral-text)}
.success{color:var(--success)}
@media (min-width:768px){
  .display{font-size:56px;line-height:60px}
  h1,.h1{font-size:36px;line-height:42px}
  h2,.h2{font-size:24px;line-height:30px}
}

/* Раскладка */
.wrap{max-width:960px;margin:0 auto;padding:0 var(--space-4)}
.narrow{max-width:440px}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:64px}
.logo{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--tap);text-decoration:none;font:800 22px/28px var(--font-sans);letter-spacing:-.03em}
.logo-mark{width:28px;height:28px;border-radius:6px;background:var(--graphite);color:var(--brand-lime);display:inline-grid;place-items:center}
@media (prefers-color-scheme:dark){.logo-mark{background:var(--brand-lime);color:#262A3A}}
.site-nav{display:flex;align-items:center;gap:var(--space-2)}
.site-nav a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--space-2);text-decoration:none;font-weight:600}
main{padding:var(--space-4) 0 var(--space-12)}
@media (min-width:768px){.wrap{padding:0 var(--space-6)}}

/* Карточка: без теней, фон и рамка */
.card{background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-4)}
@media (min-width:768px){.card{padding:var(--space-6)}}
.stack>*+*{margin-top:var(--space-4)}

/* Кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--tap);padding:10px 20px;
  border:0;border-radius:var(--radius-md);font:600 16px/24px var(--font-sans);text-decoration:none;cursor:pointer;
  background:var(--graphite);color:var(--on-graphite)}
.btn-primary{background:var(--brand-lime);color:var(--on-accent)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--field-border)}
.btn-block{width:100%}
.btn:disabled{opacity:.5;cursor:default}

/* Формы */
.field{display:block}
.field label{display:block;margin-bottom:6px;font:600 14px/20px var(--font-sans)}
.input{display:block;width:100%;min-height:var(--tap);padding:10px 14px;border:1px solid var(--field-border);border-radius:var(--radius-sm);
  background:var(--surface-raised);color:var(--ink);font:400 16px/24px var(--font-sans)}
.input-code{font-size:24px;letter-spacing:.3em;text-align:center}
.check{display:flex;gap:12px;align-items:flex-start;min-height:var(--tap);padding:10px 0;cursor:pointer}
.check input{width:22px;height:22px;margin:1px 0 0;flex-shrink:0;accent-color:var(--graphite)}
.field-error{margin:6px 0 0;color:var(--coral-text);font:500 14px/20px var(--font-sans)}

/* Бейджи и прогресс */
.badge{display:inline-flex;align-items:center;min-height:28px;padding:2px 12px;border-radius:var(--radius-pill);background:var(--brand-lime);color:var(--on-accent);font:600 14px/20px var(--font-sans)}
.progress{height:8px;border-radius:var(--radius-pill);background:var(--line);overflow:hidden}
.progress>span{display:block;height:100%;background:var(--brand-lime)}

/* Юридические документы */
.doc ul,.doc ol{padding-left:22px}
.doc li{margin:4px 0}

/* Подвал и cookie */
.site-footer{border-top:1px solid var(--line);padding:var(--space-6) 0 var(--space-12);font:400 14px/20px var(--font-sans);color:var(--ink-muted)}
.site-footer .links{display:flex;flex-wrap:wrap;gap:0 var(--space-4)}
.site-footer .links a{display:inline-flex;align-items:center;min-height:var(--tap)}
#cookie{position:fixed;left:var(--space-4);right:var(--space-4);bottom:var(--space-4);max-width:560px;margin:0 auto;display:none;gap:var(--space-4);align-items:center;
  background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-md);padding:12px var(--space-4);font:400 14px/20px var(--font-sans);z-index:10}
#cookie .btn{flex-shrink:0}