/* Shared shell: type scale, header, text-size controls, footer, article pages.
   Page-specific things (hero, quiz, result) stay in index.html.
   Every size is px * var(--k) so one control moves the whole page. */

:root{--k:1}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);
  font-size:calc(20px * var(--k));line-height:1.6;overflow-x:hidden}
@media (min-width:900px){body{font-size:calc(21px * var(--k))}}
img{max-width:100%;height:auto;display:block}
a{color:var(--action-text)}
:focus-visible{outline:4px solid var(--focus);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--container);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
p a[href^="tel:"]{display:inline-block;padding:4px 2px;min-height:44px;font-weight:700}
.off{display:none !important}

/* усиленный контраст */
body.contrast{--paper:#fff;--sand:#EFEAE2;--ink:#000;--ink-2:#1F1C19;--line:#000;--line-input:#000;--money:#0A3B2C;--brand:#07343A}
body.contrast .card,body.contrast .opt{border-width:2px}

/* ---------- шапка ---------- */
.hdr{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid var(--line)}
.hdr__in{max-width:var(--container);margin:0 auto;padding:8px var(--gutter);display:flex;align-items:center;gap:10px;min-height:68px}
.brand{font-family:var(--font-head);font-weight:700;font-size:calc(17px * var(--k));line-height:1.15;color:var(--brand);
  text-decoration:none;flex:0 1 auto;min-width:0;padding:6px 2px;display:inline-block}
.brand i{font-style:normal;display:block;white-space:nowrap}
.hdr__spacer{flex:1 1 auto;min-width:4px}
.tel{display:inline-flex;align-items:center;gap:8px;min-height:50px;padding:8px 14px;border-radius:var(--r-pill);
  background:var(--action);border:2px solid var(--action);color:#fff;text-decoration:none;
  font-weight:700;font-size:calc(17px * var(--k));line-height:1.1;white-space:nowrap;flex:0 0 auto}
.tel:hover,.tel:active{background:var(--action-deep);border-color:var(--action-deep)}
.tel svg{fill:currentColor;flex:0 0 auto;width:20px;height:20px}
@media (max-width:620px){
  .brand{font-size:calc(15px * var(--k));max-width:40%}
  .brand i{white-space:normal}
  .tel{font-size:calc(16px * var(--k));padding:8px 12px;gap:6px}
  .tel svg{width:18px;height:18px}
}
@media (min-width:900px){.brand{font-size:calc(24px * var(--k))}.brand i{display:inline}.hdr__in{min-height:76px;gap:16px}}

/* ---------- управление размером текста ----------
   Живёт в шапке, а не плавающим кружком: для этой аудитории подписанная кнопка
   на видном месте работает, а иконка в углу — нет. */
.a11y__inline{display:inline-flex;align-items:baseline;gap:4px;min-height:50px;padding:8px 12px;flex:0 0 auto;
  border-radius:var(--r-pill);border:2px solid var(--brand);background:var(--white);color:var(--brand);
  font-family:var(--font-head);font-weight:700;cursor:pointer;line-height:1}
.a11y__inline:hover{background:var(--sand)}
.a11y__inline[aria-expanded="true"]{background:var(--brand);color:var(--ink-on-dark)}
.a11y__inline{align-items:center;gap:8px}
.a11y__inline svg{width:26px;height:26px;flex:0 0 auto}
.a11y__inline .lab{font-family:var(--font-body);font-size:calc(16px * var(--k));font-weight:700}
@media (max-width:760px){.a11y__inline .lab{display:none}.a11y__inline{padding:8px 10px}}

.a11y__panel{display:none;background:var(--sand);border-top:1px solid var(--line)}
.a11y__panel.on{display:block}
.a11y__row{max-width:var(--container);margin:0 auto;padding:10px var(--gutter);display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.a11y__row span{font-weight:700;font-size:calc(17px * var(--k));margin-right:4px}
.a11y__row button{min-height:52px;padding:8px 16px;border-radius:var(--r-btn);border:2px solid var(--line-input);
  background:var(--white);color:var(--ink);font-family:var(--font-body);font-size:calc(17px * var(--k));font-weight:700;cursor:pointer}
.a11y__row button:hover{background:var(--sand)}
.a11y__row button[aria-pressed="true"]{background:var(--brand);color:var(--ink-on-dark);border-color:var(--brand)}

/* ---------- кнопки ---------- */
.btn{display:block;width:100%;max-width:520px;min-height:60px;padding:14px 22px;border:0;border-radius:var(--r-btn);
  background:var(--action);color:#fff;font-family:var(--font-body);font-weight:700;font-size:calc(20px * var(--k));
  line-height:1.25;cursor:pointer;text-align:center;text-decoration:none}
.btn:hover,.btn:active{background:var(--action-deep);color:#fff}
.btn[disabled]{opacity:.55;cursor:default}
.btn--ghost{background:var(--white);color:var(--action-text);border:2px solid var(--action)}
.btn--ghost:hover{background:var(--sand);color:var(--action-text)}

/* ---------- страницы-справочники ---------- */
.article{padding-top:var(--s4);padding-bottom:var(--s7);max-width:760px}
.crumb{font-size:calc(16px * var(--k));color:var(--ink-2);margin:0 0 var(--s3)}
.article h1{font-family:var(--font-head);font-weight:700;font-size:calc(32px * var(--k));line-height:1.15;margin:0 0 var(--s3)}
@media (min-width:900px){.article h1{font-size:calc(42px * var(--k))}}
.article h2{font-family:var(--font-head);font-weight:700;font-size:calc(25px * var(--k));line-height:1.2;margin:var(--s5) 0 var(--s2)}
.article p,.article li{font-size:calc(19px * var(--k));line-height:1.65;color:var(--ink-2);margin:0 0 var(--s2)}
.article .lede{font-size:calc(21px * var(--k));color:var(--ink);margin:0 0 var(--s4)}
.article b{color:var(--ink)}
.article ul,.article ol{padding-left:24px;margin:0 0 var(--s3)}
.article li{margin:0 0 10px}
.article table{border-collapse:collapse;width:100%;margin:0 0 var(--s3);font-size:calc(18px * var(--k))}
.article th,.article td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.article th{background:var(--sand)}
.cta-box{margin:var(--s6) 0 0;padding:var(--s4);background:var(--sand);border:1px solid var(--line);border-radius:var(--r-card)}
.cta-box h2{margin-top:0}
.cta-box p{margin-bottom:var(--s3)}

/* ---------- подвал ---------- */
.ftr{background:var(--brand);color:var(--ink-on-dark);padding:var(--s6) 0 var(--s4);margin-top:var(--s6)}
.ftr a{color:var(--ink-on-dark)}
.ftr h3{font-family:var(--font-head);font-weight:700;font-size:calc(19px * var(--k));margin:0 0 var(--s2);color:var(--ink-on-dark)}
.ftr p{font-size:calc(16px * var(--k));line-height:1.6;margin:0 0 var(--s2)}
.ftr__cols{display:grid;gap:var(--s4)}
@media (min-width:760px){.ftr__cols{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--s5)}}
.ftr__nav{display:flex;flex-direction:column}
.ftr__nav a{padding:10px 0;font-size:calc(16px * var(--k));line-height:1.4;min-height:44px}
.ftr__cta{font-weight:700}
.ftr__small{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid rgba(251,247,241,.25)}
.ftr__small p{font-size:calc(15px * var(--k));opacity:.9;max-width:900px;margin:0}