@font-face{font-family:'Familjen';src:url('/assets/fonts/familjen-var.woff2')format('woff2-variations');
  font-weight:400 700;font-display:swap;font-style:normal}
@font-face{font-family:'Crimson';src:url('/assets/fonts/crimson-var.woff2')format('woff2-variations');
  font-weight:200 900;font-display:swap;font-style:normal}
@font-face{font-family:'Crimson';src:url('/assets/fonts/crimson-var-italic.woff2')format('woff2-variations');
  font-weight:200 900;font-display:swap;font-style:italic}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#f4f2ef;color:#3a3630;
  font:400 20px/1.68 'Crimson',Georgia,serif;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto}
a{color:#6a4226;text-underline-offset:3px}
a:hover{color:#52311c}
:focus-visible{outline:3px solid #6a4226;outline-offset:3px}

.tt-skip{position:absolute;left:-9999px}
.tt-skip:focus{left:8px;top:8px;z-index:9;background:#1a1815;color:#fff;
  padding:10px 15px;font-family:'Familjen',sans-serif;font-size:14px}

/* Боковые отступы задаются ТОЛЬКО здесь. Секционные классы ниже обязаны
   использовать padding-top/padding-bottom, а не сокращённую запись: при
   равной специфичности shorthand обнулит боковые отступы и на мобильном
   текст пойдёт от края до края. Эта ошибка уже случалась в ledger. */
.tt-col{max-width:700px;margin:0 auto;padding:0 22px}
.tt-wide{max-width:1060px;margin:0 auto;padding:0 22px}

/* --- шапка --- */
.tt-head{border-bottom:1px solid #d8d2c8;background:#fbfaf8}
.tt-head__in{max-width:1060px;margin:0 auto;padding:14px 22px;display:flex;
  flex-wrap:wrap;gap:9px 24px;align-items:baseline;justify-content:space-between}
.tt-brand{font-family:'Familjen',sans-serif;font-weight:700;font-size:17px;
  letter-spacing:-.02em;color:#1a1815;text-decoration:none}
.tt-brand:hover{color:#6a4226}
.tt-menu{display:flex;flex-wrap:wrap;gap:4px 18px;font-family:'Familjen',sans-serif;
  font-size:14.5px}
.tt-menu a{color:#5f5a52;text-decoration:none;padding:2px 0;
  border-bottom:2px solid transparent}
.tt-menu a:hover{color:#1a1815;border-bottom-color:#d8d2c8}
.tt-menu a[aria-current]{color:#1a1815;border-bottom-color:#6a4226}

/* --- начало главной --- */
.tt-open{padding-top:58px;padding-bottom:44px}
.tt-open h1{font-family:'Familjen',sans-serif;font-weight:700;
  font-size:clamp(30px,4.4vw,46px);line-height:1.14;letter-spacing:-.028em;
  color:#1a1815;margin:0 0 20px;max-width:21ch}
.tt-open__lede{font-size:20.5px;line-height:1.6;color:#5f5a52;margin:0;max-width:58ch}
.tt-open__go{margin:30px 0 0;display:flex;flex-wrap:wrap;gap:12px}
.tt-open__go a{font-family:'Familjen',sans-serif;font-weight:600;font-size:15px;
  text-decoration:none;padding:11px 19px;border:2px solid #6a4226;color:#6a4226}
.tt-open__go a:first-child{background:#6a4226;color:#fff}
.tt-open__go a:hover{background:#52311c;border-color:#52311c;color:#fff}

/* --- УКАЗАТЕЛЬ: полоса, пропорциональная числу материалов -------------
   Длина считается при сборке от фактического количества записей и
   выводится инлайновым стилем. Рядом стоит само число, чтобы длину
   можно было проверить, а не принимать на веру.                       */
.tt-index{border-top:1px solid #d8d2c8;background:#fbfaf8;
  padding-top:50px;padding-bottom:58px}
.tt-index__hd{max-width:62ch;margin:0 0 42px}
.tt-index__hd h2{font-family:'Familjen',sans-serif;font-weight:700;font-size:23px;
  line-height:1.28;letter-spacing:-.025em;color:#1a1815;margin:0 0 10px}
.tt-index__hd p{margin:0;color:#5f5a52;font-size:18.5px;line-height:1.6}

.tt-sec{margin:0 0 44px}
.tt-sec__t{display:flex;flex-wrap:wrap;align-items:baseline;
  justify-content:space-between;gap:6px 18px;margin:0 0 8px}
.tt-sec__t h3{font-family:'Familjen',sans-serif;font-weight:700;font-size:20px;
  letter-spacing:-.022em;color:#1a1815;margin:0}
.tt-sec__t h3 a{color:#1a1815;text-decoration:none}
.tt-sec__t h3 a:hover{color:#6a4226;text-decoration:underline}
.tt-sec__n{font-family:'Familjen',sans-serif;font-size:13px;color:#8b857b;
  white-space:nowrap}

/* дорожка и заполненная часть */
.tt-bar{height:6px;background:#e8e3db;margin:0 0 16px}
.tt-bar span{display:block;height:100%;background:#6a4226}

.tt-sec__d{font-family:'Familjen',sans-serif;font-size:15px;line-height:1.6;
  color:#5f5a52;margin:0 0 20px;max-width:74ch}
.tt-list{list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:0 38px}
.tt-item{padding:9px 0;border-bottom:1px solid #e8e3db}
.tt-item a{display:block;text-decoration:none;color:#1a1815;
  font-family:'Crimson',Georgia,serif;font-size:18px;line-height:1.38}
.tt-item a:hover{color:#6a4226}
.tt-item span{display:block;font-family:'Familjen',sans-serif;font-size:12px;
  color:#8b857b;margin-top:2px}

/* --- вводный текст --- */
.tt-note{padding-top:44px;padding-bottom:54px}
.tt-note p{margin:0 0 20px}
.tt-note h2{font-family:'Familjen',sans-serif;font-weight:700;font-size:21px;
  line-height:1.32;letter-spacing:-.022em;color:#1a1815;margin:36px 0 13px;
  padding-top:15px;border-top:1px solid #d8d2c8}
.tt-note h2:first-child{margin-top:0}
.tt-note ul,.tt-note ol{margin:0 0 20px;padding-left:23px}
.tt-note li{margin:0 0 8px}

/* --- страница материала --- */
.tt-piece{padding-top:40px;padding-bottom:64px}
.tt-trail{font-family:'Familjen',sans-serif;font-size:14px;color:#5f5a52;
  margin:0 0 22px}
.tt-trail a{color:#5f5a52;text-decoration:none}
.tt-trail a:hover{color:#6a4226;text-decoration:underline}
.tt-h1{font-family:'Familjen',sans-serif;font-weight:700;
  font-size:clamp(27px,4vw,39px);line-height:1.16;letter-spacing:-.028em;
  color:#1a1815;margin:0 0 18px}
.tt-sum{font-size:20.5px;line-height:1.6;color:#5f5a52;margin:0 0 14px}
.tt-kind{font-family:'Familjen',sans-serif;font-size:13px;color:#8b857b;
  margin:0 0 34px;padding-bottom:16px;border-bottom:2px solid #6a4226}

.tt-text p{margin:0 0 20px}
.tt-text h2{font-family:'Familjen',sans-serif;font-weight:700;
  font-size:clamp(20px,2.6vw,25px);line-height:1.3;letter-spacing:-.024em;
  color:#1a1815;margin:42px 0 15px;padding-top:15px;
  border-top:1px solid #d8d2c8}
.tt-text h3{font-family:'Familjen',sans-serif;font-weight:600;font-size:17px;
  color:#1a1815;margin:28px 0 9px}
.tt-text ul,.tt-text ol{margin:0 0 20px;padding-left:23px}
.tt-text li{margin:0 0 8px}
.tt-text strong{font-weight:700;color:#1a1815}
.tt-text em{font-style:italic}
.tt-text blockquote{margin:0 0 20px;padding:2px 0 2px 18px;
  border-left:3px solid #6a4226;color:#5f5a52}
.tt-text code{font-family:'Familjen',ui-monospace,monospace;font-size:.87em;
  background:#e8e3db;padding:1px 5px}

/* --- подвал материала --- */
.tt-more{margin:46px 0 0;padding-top:20px;border-top:2px solid #6a4226}
.tt-more__t{font-family:'Familjen',sans-serif;font-weight:700;font-size:14px;
  color:#1a1815;margin:0 0 11px}
.tt-more ul{list-style:none;margin:0;padding:0}
.tt-more li{margin:0 0 9px;line-height:1.44}
.tt-more li a{color:#3a3630;text-decoration:none;font-size:18px}
.tt-more li a:hover{color:#6a4226;text-decoration:underline}

/* --- страница раздела --- */
.tt-hub{padding-top:40px;padding-bottom:56px}
.tt-count{font-family:'Familjen',sans-serif;font-size:13px;color:#5f5a52;
  margin:0 0 30px;padding-bottom:13px;border-bottom:2px solid #6a4226}
.tt-row{margin:0 0 30px;padding-bottom:26px;border-bottom:1px solid #e8e3db}
.tt-row:last-child{border-bottom:0}
.tt-row h2{font-family:'Familjen',sans-serif;font-weight:700;font-size:21px;
  line-height:1.28;letter-spacing:-.024em;margin:0 0 8px}
.tt-row h2 a{color:#1a1815;text-decoration:none}
.tt-row h2 a:hover{color:#6a4226}
.tt-row p{margin:0 0 7px;font-size:18px;line-height:1.6}
.tt-row__k{font-family:'Familjen',sans-serif;font-size:12.5px;color:#8b857b;margin:0}

/* --- подвал --- */
.tt-foot{border-top:1px solid #d8d2c8;background:#fbfaf8;
  padding-top:38px;padding-bottom:44px;margin-top:8px}
.tt-foot__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:24px 30px}
.tt-foot__t{font-family:'Familjen',sans-serif;font-weight:700;font-size:13px;
  color:#1a1815;margin:0 0 9px}
.tt-foot ul{list-style:none;margin:0;padding:0}
.tt-foot li{margin:0 0 6px}
.tt-foot li a{font-family:'Familjen',sans-serif;font-size:14.5px;color:#5f5a52;
  text-decoration:none}
.tt-foot li a:hover{color:#6a4226;text-decoration:underline}
.tt-foot__note{font-family:'Familjen',sans-serif;font-size:13.5px;line-height:1.65;
  color:#8b857b;margin:26px 0 0;padding-top:16px;
  border-top:1px solid #e8e3db;max-width:80ch}

@media(prefers-reduced-motion:reduce){*{transition:none!important}}


/* --- independent software comparisons --- */
.cmp-article{max-width:850px}
.cmp-note{margin:28px 0;padding:18px 20px;background:#fbfaf8;border-left:4px solid #6a4226}
.cmp-table-wrap{overflow-x:auto;margin:0 0 34px}
.cmp-table{width:100%;border-collapse:collapse;font-family:'Familjen',sans-serif;font-size:14px;line-height:1.45}
.cmp-table th,.cmp-table td{text-align:left;vertical-align:top;padding:12px 10px;border-bottom:1px solid #d8d2c8}
.cmp-table th{color:#1a1815;background:#e8e3db;font-weight:700}
.cmp-table td:first-child{width:54px;color:#8b857b}
.cmp-card{position:relative;margin:0 0 42px;padding:0 0 28px;border-bottom:1px solid #d8d2c8}
.cmp-card .cmp-rank{font-family:'Familjen',sans-serif;font-weight:700;font-size:12px;letter-spacing:.12em;color:#8b857b;margin:0 0 -34px;text-align:right}
.cmp-home{margin-top:0}
.cmp-home-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cmp-home-grid article{padding:20px;border:1px solid #d8d2c8;background:#f4f2ef}
.cmp-home-grid h3{font:700 18px/1.3 'Familjen',sans-serif;margin:0 0 10px}
.cmp-home-grid p{font-size:17px;line-height:1.5;margin:0}
.cmp-home-note{max-width:70ch;margin:28px 0 0}
@media(max-width:760px){.cmp-home-grid{grid-template-columns:1fr}.cmp-table{min-width:700px}}