/* ============================================================
   uvolnenie.pro — дизайн-система
   Палитра: тёмно-синий / белый / янтарный + семантика
   ============================================================ */
:root{
  --navy:#0E2A4E;      /* основной */
  --navy-2:#163C6B;    /* светлее, для градиента */
  --navy-3:#0A1F3A;    /* темнее, подвал */
  --amber:#E8912D;     /* акцент */
  --amber-2:#F7B75A;   /* акцент светлый */
  --ink:#16233A;       /* текст */
  --ink-2:#4A5A72;     /* текст вторичный */
  --line:#DEE5EF;      /* рамки */
  --bg:#FFFFFF;
  --bg-2:#F4F7FB;      /* подложка секций */
  --bg-3:#EAF0F8;      /* подложка врезок */
  --ok:#16855C;
  --ok-bg:#E8F6F0;
  --warn:#C2410C;
  --warn-bg:#FFF2E6;
  --danger:#B3261E;
  --danger-bg:#FDECEA;
  --r:14px;            /* радиус */
  --r-s:10px;
  --shadow:0 2px 4px rgba(14,42,78,.05), 0 12px 28px rgba(14,42,78,.07);
  --shadow-s:0 1px 2px rgba(14,42,78,.06), 0 4px 12px rgba(14,42,78,.05);
  --wrap:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16.5px;line-height:1.68;color:var(--ink);background:var(--bg);
  overflow-x:clip;-webkit-touch-callout:none;
}
img{max-width:100%;height:auto;display:block}
a{color:#12508F;text-decoration:none}
a:hover{text-decoration:underline}
p,li,h1,h2,h3,h4,td,th,summary,figcaption{overflow-wrap:break-word}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:4px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
.wrap,.wrap>*{min-width:0}

/* ---------- Типографика ---------- */
h1,h2,h3,h4{color:var(--navy);line-height:1.22;letter-spacing:-.015em;font-weight:800}
h1{font-size:41px;margin-bottom:16px;letter-spacing:-.025em}
h2{font-size:28px;margin:44px 0 16px;display:flex;align-items:center;gap:12px}
h2>svg{flex:0 0 auto}
h3{font-size:21px;margin:28px 0 10px}
h4{font-size:17.5px;margin:20px 0 8px}
p{margin:0 0 15px}
.lead{font-size:18.5px;color:var(--ink-2);line-height:1.6}
.eyebrow{
  display:inline-block;font-size:13px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--amber);margin-bottom:12px;
}
.gr{background:linear-gradient(96deg,var(--amber),#D8720F);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Кнопки с переливом ---------- */
.btn{
  display:inline-flex;align-items:center;gap:9px;position:relative;overflow:hidden;
  padding:13px 26px;border:0;border-radius:var(--r-s);cursor:pointer;
  font-size:15.5px;font-weight:700;font-family:inherit;line-height:1.2;
  color:#fff;text-decoration:none;min-height:44px;
  background:linear-gradient(100deg,var(--amber) 0%,var(--amber-2) 25%,var(--amber) 50%,#D8720F 75%,var(--amber) 100%);
  background-size:230% 100%;background-position:0% 50%;
  box-shadow:0 4px 14px rgba(232,145,45,.32);
  transition:background-position .7s ease,transform .18s ease,box-shadow .18s ease;
}
.btn:hover{background-position:100% 50%;transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(232,145,45,.42);text-decoration:none;color:#fff}
.btn:active{transform:translateY(0)}
.btn::after{
  content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-18deg);transition:left .75s ease;
}
.btn:hover::after{left:120%}
.btn-navy{
  background:linear-gradient(100deg,var(--navy) 0%,var(--navy-2) 30%,var(--navy) 55%,#08213E 80%,var(--navy) 100%);
  background-size:230% 100%;box-shadow:0 4px 14px rgba(14,42,78,.28);
}
.btn-navy:hover{box-shadow:0 8px 22px rgba(14,42,78,.36)}
.btn-ghost{
  background:#fff;color:var(--navy);border:1.5px solid var(--line);box-shadow:none;
}
.btn-ghost:hover{color:var(--navy);border-color:var(--navy);background:#fff;transform:translateY(-2px);box-shadow:var(--shadow-s)}
.btn-ghost::after{display:none}
.btn-s{padding:9px 16px;font-size:14.5px;min-height:38px}

/* ---------- Шапка ---------- */
.hdr{position:sticky;top:0;z-index:60;background:var(--navy);color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.08),0 6px 18px rgba(10,31,58,.18)}
.hdr-in{display:flex;align-items:center;gap:26px;height:66px}
.hdr-in,.hdr-in>*{min-width:0}
.logo{display:flex;align-items:center;gap:10px;color:#fff;flex:0 0 auto}
.logo:hover{text-decoration:none}
.logo-mark{width:36px;height:36px;flex:0 0 auto}
.logo-t{font-size:19px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.logo-t span{display:block;font-size:11px;font-weight:600;letter-spacing:.04em;
  color:rgba(255,255,255,.62);text-transform:none}
.nav{display:flex;gap:4px;flex:1 1 auto;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.nav::-webkit-scrollbar{display:none}
.nav a{
  color:rgba(255,255,255,.86);font-size:15px;font-weight:600;padding:9px 12px;
  border-radius:8px;white-space:nowrap;position:relative;transition:background .18s,color .18s;
}
.nav a:hover{background:rgba(255,255,255,.10);color:#fff;text-decoration:none}
.nav a.on{color:#fff}
.nav a.on::after{content:"";position:absolute;left:12px;right:12px;bottom:2px;height:2.5px;
  background:var(--amber);border-radius:2px}
.hdr-act{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.icon-btn{
  width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:9px;background:rgba(255,255,255,.10);color:#fff;cursor:pointer;
  transition:background .18s;
}
.icon-btn:hover{background:rgba(255,255,255,.2)}
.burger{display:none}

/* ---------- Крошки ---------- */
.crumbs{background:var(--bg-2);border-bottom:1px solid var(--line);font-size:14px}
.crumbs ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:11px 0}
.crumbs li{display:flex;align-items:center;gap:8px;color:var(--ink-2)}
.crumbs li+li::before{content:"/";color:#B7C3D4}
.crumbs a{color:var(--ink-2)}
.crumbs a:hover{color:var(--navy)}

/* ---------- Герой ---------- */
.hero{background:linear-gradient(168deg,#FFFFFF 0%,#F4F7FB 58%,#EAF0F8 100%);
  border-bottom:1px solid var(--line);padding:46px 0 40px;position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;right:-140px;top:-160px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle at 40% 40%,rgba(232,145,45,.14),transparent 62%);pointer-events:none;
}
.hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:stretch;position:relative}
.hero-in,.hero-in>*{min-width:0}
.hero h1{font-size:46px}
.hero .lead{margin-bottom:22px;max-width:34em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}
.trust{display:flex;flex-wrap:wrap;gap:22px}
.trust div{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--ink-2);max-width:230px}
.trust svg{flex:0 0 auto;margin-top:1px}
.trust b{display:block;color:var(--navy);font-size:14.5px}

/* ---------- Подбор ситуации (сигнатурный блок) ---------- */
.hero-in>div:last-child{display:flex;flex-direction:column}
.picker{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);
  overflow:hidden}
.picker-h{background:linear-gradient(100deg,var(--navy),var(--navy-2));color:#fff;padding:18px 22px}
.picker-h b{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:800}
.picker-h p{margin:6px 0 0;font-size:13.5px;color:rgba(255,255,255,.7);line-height:1.5}
.picker-b{padding:18px 22px 22px}
.opts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.opt{
  border:1.5px solid var(--line);background:#fff;color:var(--navy);cursor:pointer;
  font:600 14.5px/1.2 inherit;padding:10px 14px;border-radius:999px;min-height:40px;
  transition:border-color .18s,background .18s,color .18s,transform .15s;
}
.opt:hover{border-color:var(--amber);transform:translateY(-1px)}
.opt[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.out{border-top:1px dashed var(--line);padding-top:16px}
.out h4{margin:0 0 10px;font-size:16px}
.out ul{list-style:none;margin:0 0 14px}
.out li{display:flex;gap:9px;align-items:flex-start;font-size:14.8px;padding:5px 0;color:var(--ink)}
.out li svg{flex:0 0 auto;margin-top:3px}
.out .goto{display:flex;flex-wrap:wrap;gap:8px}
.out .goto a{
  display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;
  background:var(--bg-3);color:var(--navy);padding:8px 13px;border-radius:8px;min-height:38px;
}
.out .goto a:hover{background:var(--navy);color:#fff;text-decoration:none}
.hint{font-size:13.2px;color:var(--ink-2);margin:12px 0 0}

/* ---------- Секции ---------- */
.sec{padding:52px 0}
.sec-alt{background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}
.sec-h h2{margin:0}
.sec-h a{font-size:15px;font-weight:700;white-space:nowrap}

/* ---------- Сетки карточек ---------- */
.grid{display:grid;gap:18px}
.grid,.grid>*{min-width:0}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;
  box-shadow:var(--shadow-s);position:relative;transition:transform .2s,box-shadow .2s,border-color .2s;
  display:flex;flex-direction:column;
}
.card,.card>*{min-width:0}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#C9D6E8}
.card-ico{
  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,var(--bg-3),#DCE7F5);color:var(--navy);margin-bottom:14px;flex:0 0 auto;
}
.card-ico.am{background:linear-gradient(140deg,#FDEBD4,#FBD9AC);color:#B7660C}
.card h3{margin:0 0 8px;font-size:18px}
.card p{font-size:14.8px;color:var(--ink-2);margin:0 0 14px}
.card .go{margin-top:auto;display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:14.5px;color:var(--amber)}
.card .go:hover{gap:11px;text-decoration:none}
.card .go svg{transition:transform .2s}

/* ---------- Плитки со счётчиками ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.stats,.stats>*{min-width:0}
.stat{background:#fff;border:1px solid var(--line);border-left:4px solid var(--amber);
  border-radius:var(--r-s);padding:18px 20px}
.stat b{display:block;font-size:30px;font-weight:800;color:var(--navy);letter-spacing:-.02em;line-height:1.1}
.stat span{display:block;font-size:14px;color:var(--ink-2);margin-top:5px}

/* ---------- Врезки ---------- */
.note{
  display:flex;gap:14px;background:var(--bg-3);border-left:4px solid var(--navy);
  border-radius:0 var(--r-s) var(--r-s) 0;padding:18px 20px;margin:24px 0;
}
.note,.note>*{min-width:0}
.note svg{flex:0 0 auto;margin-top:2px;color:var(--navy)}
.note b{display:block;margin-bottom:4px;color:var(--navy);font-size:16px}
.note p:last-child{margin-bottom:0}
.note p{font-size:15.5px}
.note-warn{background:var(--warn-bg);border-left-color:var(--warn)}
.note-warn svg,.note-warn b{color:var(--warn)}
.note-ok{background:var(--ok-bg);border-left-color:var(--ok)}
.note-ok svg,.note-ok b{color:var(--ok)}
.note-law{background:#F6F3EC;border-left-color:#8A6D3B}
.note-law svg,.note-law b{color:#7A5F31}

/* ---------- Цитата ---------- */
.quote{
  position:relative;margin:30px 0;padding:30px 32px 28px 74px;border-radius:var(--r);
  background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 68%,#1D4B84 100%);
  color:#fff;box-shadow:var(--shadow);overflow:hidden;
}
.quote::before{
  content:"\201C";position:absolute;left:20px;top:2px;font-size:96px;line-height:1;
  font-family:Georgia,"Times New Roman",serif;color:var(--amber);opacity:.85;
}
.quote::after{
  content:"";position:absolute;right:-70px;bottom:-90px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(232,145,45,.22),transparent 65%);
}
.quote p{font-size:19.5px;line-height:1.55;font-weight:600;margin:0;position:relative}
.quote cite{display:block;margin-top:12px;font-size:14px;font-style:normal;
  color:rgba(255,255,255,.68);position:relative}

/* ---------- Шаги ---------- */
.steps{counter-reset:s;display:grid;gap:14px;margin:24px 0}
.steps,.steps>*{min-width:0}
.step{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);
  padding:18px 20px 18px 66px;box-shadow:var(--shadow-s);
}
.step::before{
  counter-increment:s;content:counter(s);position:absolute;left:18px;top:16px;
  width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,var(--amber),#D8720F);color:#fff;font-weight:800;font-size:16px;
}
.step b{display:block;color:var(--navy);font-size:16.5px;margin-bottom:3px}
.step p{margin:0;font-size:15.3px;color:var(--ink-2)}

/* ---------- Списки ---------- */
.ul{list-style:none;margin:18px 0}
.ul li{display:flex;gap:11px;align-items:flex-start;padding:7px 0;font-size:16px}
.ul li svg{flex:0 0 auto;margin-top:4px;color:var(--ok)}
.ul-x li svg{color:var(--danger)}
.content ol{margin:16px 0 16px 22px}
.content ol li{padding:5px 0}

/* ---------- Плитки-словарь ---------- */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:24px 0}
.tiles,.tiles>*{min-width:0}
.tile{background:#fff;border:1px solid var(--line);border-radius:var(--r-s);padding:16px 17px;
  transition:border-color .2s,transform .2s}
.tile:hover{border-color:var(--amber);transform:translateY(-2px)}
.tile svg{color:var(--amber);margin-bottom:9px}
.tile b{display:block;color:var(--navy);font-size:15.5px;margin-bottom:4px}
.tile p{font-size:13.8px;color:var(--ink-2);margin:0;line-height:1.55}

/* ---------- Таблицы ---------- */
.scroll{margin:24px 0}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:15.3px;
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
thead th{
  background:linear-gradient(100deg,var(--navy),var(--navy-2));color:#fff;text-align:left;
  padding:14px 16px;font-size:14.2px;font-weight:700;letter-spacing:.01em;vertical-align:bottom;
}
tbody td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:top}
tbody tr:nth-child(even) td{background:#FAFCFE}
tbody tr:hover td{background:var(--bg-3)}
tbody td:first-child{font-weight:700;color:var(--navy)}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:13.2px;font-weight:700;
  padding:4px 10px;border-radius:999px;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.p-ok{background:var(--ok-bg);color:var(--ok)}
.p-warn{background:var(--warn-bg);color:var(--warn)}
.p-bad{background:var(--danger-bg);color:var(--danger)}
.tcap{font-size:13.5px;color:var(--ink-2);margin:9px 0 0}

/* ---------- Калькулятор ---------- */
.calc{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);
  overflow:hidden;margin:28px 0}
.calc-h{background:linear-gradient(100deg,var(--navy),var(--navy-2));color:#fff;padding:18px 24px;
  display:flex;align-items:center;gap:12px}
.calc-h b{font-size:18px;font-weight:800}
.calc-b{display:grid;grid-template-columns:1.15fr .85fr;gap:0}
.calc-b,.calc-b>*{min-width:0}
.calc-form{padding:22px 24px}
.field{margin-bottom:15px}
.field label{display:block;font-size:14.5px;font-weight:600;color:var(--navy);margin-bottom:6px}
.field input{
  width:100%;font:inherit;font-size:16.5px;padding:11px 14px;border:1.5px solid var(--line);
  border-radius:var(--r-s);color:var(--ink);background:#fff;min-height:44px;
}
.field input:focus{border-color:var(--amber);outline:none}
.field small{display:block;font-size:13px;color:var(--ink-2);margin-top:5px}
.calc-res{background:linear-gradient(160deg,var(--bg-3),#DCE7F5);padding:22px 24px;
  display:flex;flex-direction:column;justify-content:center}
.calc-res .sum{font-size:38px;font-weight:800;color:var(--navy);letter-spacing:-.025em;line-height:1.1}
.calc-res .sum small{font-size:19px;font-weight:700}
.calc-res .lbl{font-size:14px;color:var(--ink-2);margin-bottom:4px}
.calc-rows{margin-top:16px;border-top:1px dashed #B9C9DE;padding-top:14px}
.calc-rows div{display:flex;justify-content:space-between;gap:12px;font-size:14.3px;padding:4px 0}
.calc-rows span:last-child{font-weight:700;color:var(--navy);white-space:nowrap}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:10px;margin:22px 0}
.faq details{background:#fff;border:1px solid var(--line);border-radius:var(--r-s);
  transition:border-color .2s,box-shadow .2s}
.faq details[open]{border-color:#C3D3E8;box-shadow:var(--shadow-s)}
.faq summary{
  cursor:pointer;list-style:none;padding:15px 50px 15px 18px;font-weight:700;font-size:16.2px;
  color:var(--navy);position:relative;min-height:44px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:18px;top:20px;width:10px;height:10px;
  border-right:2.5px solid var(--amber);border-bottom:2.5px solid var(--amber);
  transform:rotate(45deg);transition:transform .22s;
}
.faq details[open] summary::after{transform:rotate(-135deg);top:23px}
.faq .a{padding:0 18px 16px;font-size:15.6px;color:var(--ink-2)}
.faq .a p:last-child{margin-bottom:0}

/* ---------- Оглавление ---------- */
.toc{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;margin:26px 0}
.toc b{display:flex;align-items:center;gap:10px;color:var(--navy);font-size:16.5px;margin-bottom:12px}
.toc ol{columns:2;column-gap:34px;margin:0 0 0 20px;font-size:15.3px}
.toc li{padding:3px 0;break-inside:avoid}

/* ---------- Дата обновления ---------- */
.upd{display:inline-flex;align-items:center;gap:9px;background:var(--ok-bg);color:var(--ok);
  font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;margin-bottom:18px}

/* ---------- Куда дальше ---------- */
.next{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0}
.next,.next>*{min-width:0}
.next a{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);
  padding:17px 18px;transition:transform .2s,border-color .2s,box-shadow .2s}
.next a:hover{transform:translateY(-3px);border-color:var(--amber);box-shadow:var(--shadow-s);text-decoration:none}
.next svg{color:var(--amber);margin-bottom:8px}
.next b{display:block;color:var(--navy);font-size:15.8px;margin-bottom:4px}
.next span{font-size:13.6px;color:var(--ink-2);line-height:1.5}

/* ---------- Полоса CTA ---------- */
.band{background:linear-gradient(100deg,var(--navy),var(--navy-2) 70%,#1D4B84);color:#fff;
  border-radius:18px;padding:26px 30px;display:flex;align-items:center;gap:22px;margin:34px 0;
  box-shadow:var(--shadow)}
.band,.band>*{min-width:0}
.band .bi{width:56px;height:56px;border-radius:14px;background:rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.band b{display:block;font-size:20px;font-weight:800;margin-bottom:4px}
.band p{margin:0;color:rgba(255,255,255,.76);font-size:15.3px}
.band .btn{margin-left:auto;flex:0 0 auto}

/* ---------- Статья ---------- */
.art{display:grid;grid-template-columns:262px 1fr;gap:46px;padding:34px 0 20px;align-items:start}
.art,.art>*{min-width:0}
.side{position:sticky;top:88px}
.side b{display:block;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);margin-bottom:12px}
.side ol{list-style:none;counter-reset:t;border-left:2px solid var(--line)}
.side li{counter-increment:t}
.side a{display:block;padding:7px 0 7px 16px;margin-left:-2px;border-left:2px solid transparent;
  font-size:14.6px;color:var(--ink-2);line-height:1.45}
.side a:hover{color:var(--navy);border-left-color:var(--amber);text-decoration:none}
.content h2:first-of-type{margin-top:8px}
.content{font-size:16.8px}

/* ---------- Подвал ---------- */
.ftr{background:var(--navy-3);color:rgba(255,255,255,.72);padding:46px 0 26px;margin-top:60px;font-size:15px}
.ftr-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px}
.ftr-in,.ftr-in>*{min-width:0}
.ftr-h{color:#fff;font-size:15.5px;font-weight:700;margin-bottom:13px}
.ftr ul{list-style:none}
.ftr li{padding:4px 0}
.ftr a{color:rgba(255,255,255,.72)}
.ftr a:hover{color:var(--amber)}
.ftr .about{font-size:14.4px;line-height:1.65;max-width:34em}
.ftr .logo{margin-bottom:14px}
.ftr-bot{border-top:1px solid rgba(255,255,255,.12);margin-top:32px;padding-top:20px;
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:13.6px;
  color:rgba(255,255,255,.5)}

/* ============================================================
   АДАПТАЦИЯ
   ============================================================ */
@media (max-width:1000px){
  .hero-in{grid-template-columns:1fr;gap:30px}
  .hero h1{font-size:37px}
  .art{grid-template-columns:1fr;gap:0}
  .side{position:static;margin-bottom:8px}
  .side ol{columns:2;column-gap:26px;border-left:0}
  .side a{padding-left:0;border-left:0}
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .next{grid-template-columns:repeat(2,1fr)}
  .ftr-in{grid-template-columns:1fr 1fr}
  .calc-b{grid-template-columns:1fr}
}
@media (max-width:768px){
  h1{font-size:33px}
  .hero h1{font-size:33px}
  h2{font-size:25px;margin:36px 0 14px}
  .band{flex-direction:column;align-items:flex-start;gap:16px}
  .band .btn{margin-left:0}
  .toc ol{columns:1}
  .quote{padding:26px 24px 24px 60px}
  .quote p{font-size:17.5px}
  .burger{display:flex}
  .nav{position:fixed;left:0;right:0;top:66px;background:var(--navy);flex-direction:column;
    gap:0;padding:10px 16px 18px;display:none;box-shadow:0 14px 24px rgba(10,31,58,.3);overflow:visible}
  .nav.open{display:flex}
  .nav a{padding:12px 10px;font-size:16px;white-space:normal}
  .nav a.on::after{display:none}

  /* таблицы → карточки */
  table,.scroll table{display:block;border:0;background:transparent}
  thead,thead tr,thead th{position:absolute;left:0;top:0;width:1px;height:1px;margin:-1px;
    padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;font-size:1px}
  tbody,tbody tr,tbody td{display:block}
  tbody tr{background:#fff;border:1px solid var(--line);border-radius:var(--r-s);
    margin-bottom:12px;box-shadow:var(--shadow-s);overflow:hidden}
  tbody tr:nth-child(even) td,tbody tr:hover td{background:transparent}
  tbody td{border-top:1px solid var(--line);display:flex;gap:12px;align-items:flex-start;padding:11px 15px}
  tbody td:first-child{background:var(--bg-2);border-top:0;font-size:16.2px;padding:13px 15px}
  tbody td::before{content:attr(data-label);flex:0 0 40%;font-weight:600;color:var(--ink-2);font-size:14px}
  tbody td:first-child::before{display:none}
}
@media (max-width:480px){
  .wrap{padding:0 16px}
  h1,.hero h1{font-size:29px}
  h2{font-size:22px}
  .lead{font-size:17px}
  .g4,.g3,.g2,.stats,.tiles,.next,.ftr-in{grid-template-columns:1fr}
  .side ol{columns:1}
  .trust div{max-width:none;width:100%}
  .btn{width:100%;justify-content:center}
  .hdr-in{height:60px}
  .nav{top:60px}
  .calc-res .sum{font-size:32px}
}
@media (max-width:380px){
  tbody td{display:block;padding:10px 14px}
  tbody td::before{display:block;flex:none;margin-bottom:2px}
  .picker-b,.calc-form,.calc-res{padding-left:16px;padding-right:16px}
  .step{padding:16px 16px 16px 58px}
  h1,.hero h1{font-size:26px}
  body{font-size:16px}
  .card p,.tile p{font-size:14px}
}
@media (max-width:340px){
  .wrap{padding:0 12px}
  h1,.hero h1{font-size:24px}
  .logo-mark{width:30px;height:30px}
  .logo-t{font-size:17px}
}
@media (hover:none){
  .card:hover,.tile:hover,.next a:hover,.btn:hover{transform:none}
  .btn:hover::after{left:-60%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* ---------- Шпаргалка под подбором ситуации ---------- */
.cheat{margin-top:18px;flex:1 1 auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow-s);padding:18px 20px}
.cheat>b{display:flex;align-items:center;gap:10px;color:var(--navy);font-size:16px;margin-bottom:12px}
.cheat>b svg{color:var(--amber)}
.cheat dl{display:grid;grid-template-columns:auto 1fr;gap:10px 14px;margin:0;align-items:baseline}
.cheat dt{font-size:19px;font-weight:800;color:var(--navy);letter-spacing:-.02em;white-space:nowrap}
.cheat dd{margin:0;font-size:14.3px;color:var(--ink-2);line-height:1.5}
.cheat .more{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:14.2px;
  font-weight:700;color:var(--amber)}
.cheat .more:hover{gap:11px;text-decoration:none}

/* ---------- Поиск по сайту ---------- */
.sr{position:fixed;inset:0;z-index:90;background:rgba(10,31,58,.55);
  display:none;padding:70px 16px 16px;backdrop-filter:blur(2px)}
.sr.open{display:block}
.sr-box{max-width:660px;margin:0 auto;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(10,31,58,.35);overflow:hidden}
.sr-top{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.sr-top svg{color:var(--ink-2);flex:0 0 auto}
.sr-top input{flex:1 1 auto;min-width:0;border:0;outline:none;font:inherit;font-size:17.5px;color:var(--ink);background:transparent}
.sr-esc{border:1px solid var(--line);background:var(--bg-2);color:var(--ink-2);border-radius:7px;
  font:600 12.5px/1 inherit;padding:7px 9px;cursor:pointer;flex:0 0 auto}
.sr-res{max-height:60vh;overflow:auto;padding:8px}
.sr-res a{display:block;padding:11px 14px;border-radius:10px;color:var(--ink)}
.sr-res a:hover,.sr-res a.sel{background:var(--bg-2);text-decoration:none}
.sr-res b{display:block;color:var(--navy);font-size:15.8px;margin-bottom:2px}
.sr-res span{font-size:13.6px;color:var(--ink-2)}
.sr-empty{padding:24px 16px;text-align:center;color:var(--ink-2);font-size:15px}

/* ---------- Кнопка консультации ---------- */
.hdr .btn-lawyer{padding:10px 18px;font-size:14.6px;min-height:40px;white-space:nowrap}
@media (max-width:1000px){.hdr .btn-lawyer{display:none}}

/* ---------- Полоса сроков ---------- */
.terms-sec{padding:34px 0 10px}
.terms{background:linear-gradient(104deg,var(--navy) 0%,var(--navy-2) 62%,#1D4B84 100%);
  color:#fff;border-radius:20px;padding:30px 32px 26px;box-shadow:var(--shadow);
  position:relative;overflow:hidden}
.terms::after{content:"";position:absolute;right:-90px;top:-120px;width:340px;height:340px;
  border-radius:50%;background:radial-gradient(circle,rgba(232,145,45,.20),transparent 66%);pointer-events:none}
.terms-h{position:relative;max-width:60em;margin-bottom:24px}
.terms-h b{display:flex;align-items:center;gap:11px;font-size:22px;font-weight:800;letter-spacing:-.02em}
.terms-h b svg{color:var(--amber-2);flex:0 0 auto}
.terms-h p{margin:8px 0 0;font-size:15.4px;color:rgba(255,255,255,.72);line-height:1.6}
.terms-g{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;position:relative}
.terms-g,.terms-g>*{min-width:0}
.term{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-s);padding:16px 17px;transition:background .2s,transform .2s}
.term:hover{background:rgba(255,255,255,.12);transform:translateY(-3px)}
.term b{display:block;font-size:25px;font-weight:800;color:var(--amber-2);
  letter-spacing:-.025em;line-height:1.15}
.term i{display:block;font-style:normal;font-size:14.6px;font-weight:700;color:#fff;margin:4px 0 5px}
.term span{display:block;font-size:13.6px;color:rgba(255,255,255,.7);line-height:1.5}
.terms-more{display:inline-flex;align-items:center;gap:8px;margin-top:20px;position:relative;
  font-size:14.8px;font-weight:700;color:var(--amber-2)}
.terms-more:hover{gap:12px;color:var(--amber-2);text-decoration:none}
@media (max-width:1000px){.terms-g{grid-template-columns:repeat(3,1fr)}}
@media (max-width:768px){.terms{padding:26px 22px 22px}.terms-g{grid-template-columns:repeat(2,1fr)}
  .terms-h b{font-size:20px}}
@media (max-width:480px){.terms-g{grid-template-columns:1fr}.terms-sec{padding:26px 0 4px}}

/* ---------- Карточка скачивания документа ---------- */
.docbox{display:grid;grid-template-columns:158px 1fr;gap:24px;align-items:start;
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;
  box-shadow:var(--shadow-s);margin:26px 0}
.docbox,.docbox>*{min-width:0}
.docbox-img{border:1px solid var(--line);border-radius:8px;overflow:hidden;
  box-shadow:0 6px 18px rgba(14,42,78,.10);transition:transform .25s}
.docbox-img:hover{transform:translateY(-3px) rotate(-.6deg)}
.docbox h3{margin:0 0 6px;font-size:19px}
.docbox>div>p{font-size:15.3px;color:var(--ink-2);margin:0 0 14px}
.docbox-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.docbox-meta span{display:inline-flex;align-items:center;gap:6px;background:var(--bg-2);
  color:var(--ink-2);font-size:13.2px;font-weight:600;padding:5px 11px;border-radius:999px}
.docbox-acts{display:flex;flex-wrap:wrap;gap:10px}
.docbox-acts .btn small{font-weight:600;opacity:.8;font-size:12.5px}
@media (max-width:600px){
  .docbox{grid-template-columns:1fr;gap:18px}
  .docbox-img{max-width:180px}
  .docbox-acts .btn{width:100%;justify-content:center}
}

/* ---------- Поля калькулятора со степперами ---------- */
.stepper{display:flex;align-items:stretch;border:1.5px solid var(--line);border-radius:var(--r-s);
  overflow:hidden;background:#fff}
.stepper:focus-within{border-color:var(--amber)}
.stepper input{flex:1 1 auto;min-width:0;border:0;border-radius:0;text-align:center;
  font-size:17px;font-weight:700;color:var(--navy);padding:11px 6px;min-height:46px;
  -moz-appearance:textfield}
.stepper input:focus{outline:none}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0}
.st{flex:0 0 auto;width:48px;min-height:46px;border:0;background:var(--bg-2);color:var(--navy);
  font:700 22px/1 inherit;cursor:pointer;transition:background .15s;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation}
.st:hover{background:var(--bg-3)}
.st:active{background:#DCE7F5}
.calc-res .sum{transition:none}
@media (max-width:1000px){
  /* на телефоне результат виден сразу, до полей ввода */
  .calc-b{display:flex;flex-direction:column}
  .calc-res{order:-1;position:sticky;top:66px;z-index:5;
    box-shadow:0 6px 16px rgba(14,42,78,.10)}
  .calc-res .sum{font-size:34px}
}
@media (max-width:380px){
  .st{width:44px}
  .stepper input{font-size:16.5px}
}

/* ---------- Конструктор заявления ---------- */
.gen{border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);
  padding:22px 24px;margin:26px 0}
.gen-h{display:flex;align-items:center;gap:11px;margin-bottom:6px}
.gen-h b{font-size:19px;color:var(--navy);letter-spacing:-.01em}
.gen-h svg{color:var(--amber)}
.gen>p.gen-sub{font-size:14.8px;color:var(--ink-2);margin:0 0 18px}
.gen-b{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.gen-b,.gen-b>*{min-width:0}
.gen-form{display:grid;gap:13px}
.gen-form .field input,.gen-form .field select{width:100%;padding:11px 13px;font:inherit;font-size:15.4px;
  color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r-s)}
.gen-form .field select{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%235B6B80' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;padding-right:36px}
.gen-form .field input:focus,.gen-form .field select:focus{outline:none;border-color:var(--amber);
  box-shadow:0 0 0 3px rgba(247,183,90,.25)}
.gen-out{background:#fff;border:1px solid var(--line);border-radius:var(--r-s);box-shadow:var(--shadow-s);
  padding:22px 24px;min-height:300px}
.gen-out pre{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:14.6px;line-height:1.62;
  color:var(--ink);white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}
.gen-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.gen-acts .btn{padding:11px 18px;font-size:14.8px}
.gen-note{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:12px 14px;
  background:var(--ok-bg);border-radius:var(--r-s);font-size:14.2px;color:var(--ink-2);line-height:1.5}
.gen-note svg{color:var(--ok);flex:0 0 auto;margin-top:1px}
.gen-note b{color:var(--navy)}
.gen-ok{font-size:13.8px;color:var(--ok);font-weight:700;margin-top:10px;min-height:18px}
@media (max-width:1000px){.gen-b{grid-template-columns:1fr;gap:20px}}
@media (max-width:480px){.gen{padding:18px 16px}.gen-out{padding:16px 15px}
  .gen-out pre{font-size:13.6px}.gen-acts .btn{width:100%;justify-content:center}}
@media print{
  body>*{display:none!important}
  .gen-print,.gen-print *{display:block!important}
  .gen-print{position:absolute;inset:0;padding:0;background:#fff;border:0;box-shadow:none}
  .gen-print pre{font-size:13pt;line-height:1.7}
}

/* ---------- Большой калькулятор расчёта ---------- */
.bc{border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);padding:22px 24px;margin:26px 0}
.bc-h{display:flex;align-items:center;gap:11px;margin-bottom:6px}
.bc-h b{font-size:19px;color:var(--navy);letter-spacing:-.01em}
.bc-h svg{color:var(--amber)}
.bc>p.bc-sub{font-size:14.8px;color:var(--ink-2);margin:0 0 18px}
.bc-b{display:grid;grid-template-columns:1.15fr 1fr;gap:26px;align-items:start}
.bc-b,.bc-b>*{min-width:0}
.bc-form{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.bc-form .wide{grid-column:1/-1}
.bc-form .field input,.bc-form .field select{width:100%;padding:10px 12px;font:inherit;font-size:15.2px;
  color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r-s)}
.bc-form .field select{appearance:none;padding-right:34px;background-repeat:no-repeat;
  background-position:right 12px center;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%235B6B80' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E")}
.bc-form .field input:focus,.bc-form .field select:focus{outline:none;border-color:var(--amber);
  box-shadow:0 0 0 3px rgba(247,183,90,.25)}
.bc-res{background:var(--navy);color:#fff;border-radius:var(--r-s);padding:22px 24px;box-shadow:var(--shadow-s)}
.bc-res .lbl{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  color:rgba(255,255,255,.66);margin-bottom:6px}
.bc-res .sum{display:block;font-size:38px;font-weight:800;letter-spacing:-.03em;line-height:1.05;margin-bottom:4px}
.bc-res .sum small{font-size:22px;font-weight:700;opacity:.8}
.bc-res .sub{font-size:13.6px;color:rgba(255,255,255,.7)}
.bc-rows{margin-top:18px;border-top:1px solid rgba(255,255,255,.16);padding-top:12px}
.bc-rows div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;font-size:14.6px;
  color:rgba(255,255,255,.82);border-bottom:1px solid rgba(255,255,255,.08)}
.bc-rows div:last-child{border-bottom:0}
.bc-rows div.tot{color:#fff;font-weight:700;font-size:15.4px}
.bc-rows div.neg span:last-child{color:#FFC9A8}
.bc-rows span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums}
.bc-det{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);padding:0 16px}
.bc-det summary{cursor:pointer;list-style:none;padding:13px 0;font-size:14.8px;font-weight:700;
  color:var(--navy);display:flex;justify-content:space-between;align-items:center}
.bc-det summary::-webkit-details-marker{display:none}
.bc-det summary::after{content:"+";font-size:19px;color:var(--amber);font-weight:800}
.bc-det[open] summary::after{content:"\2212"}
.bc-det .in{padding:0 0 14px;font-size:14.2px;color:var(--ink-2);line-height:1.6}
.bc-det .in p{margin:0 0 8px;font-size:14.2px}
.bc-det code{background:var(--bg-2);border-radius:4px;padding:1px 6px;font-size:13.4px;color:var(--navy)}
.bc-warn{display:flex;gap:9px;align-items:flex-start;margin-top:14px;font-size:13.9px;
  color:var(--ink-2);line-height:1.5}
.bc-warn svg{color:var(--amber);flex:0 0 auto;margin-top:2px}
@media (max-width:1000px){.bc-b{grid-template-columns:1fr;gap:20px}}
@media (max-width:480px){.bc{padding:18px 16px}.bc-form{grid-template-columns:1fr}
  .bc-res{padding:18px 17px}.bc-res .sum{font-size:31px}}