@font-face{font-family:"Atma";font-style:normal;font-weight:600;font-display:swap;src:url("../font/atma-600-latin.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}
@font-face{font-family:"Atma";font-style:normal;font-weight:600;font-display:swap;src:url("../font/atma-600-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atma";font-style:normal;font-weight:600;font-display:swap;src:url("../font/atma-600-bengali.woff2") format("woff2");unicode-range:U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Atma";font-style:normal;font-weight:700;font-display:swap;src:url("../font/atma-700-latin.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}
@font-face{font-family:"Atma";font-style:normal;font-weight:700;font-display:swap;src:url("../font/atma-700-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atma";font-style:normal;font-weight:700;font-display:swap;src:url("../font/atma-700-bengali.woff2") format("woff2");unicode-range:U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:400;font-display:swap;src:url("../font/notobn-400-latin.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}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:400;font-display:swap;src:url("../font/notobn-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:400;font-display:swap;src:url("../font/notobn-400-bengali.woff2") format("woff2");unicode-range:U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:600;font-display:swap;src:url("../font/notobn-600-latin.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}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:600;font-display:swap;src:url("../font/notobn-600-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:600;font-display:swap;src:url("../font/notobn-600-bengali.woff2") format("woff2");unicode-range:U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1}
:root{
  --ink:#0c131c; --ink-2:#111b27; --slab:#16222f; --slab-2:#1b2a3a;
  --line:rgba(150,180,205,.16); --line-2:rgba(150,180,205,.30); --text:#e9f0f7; --text-2:#a8bccd;
  --cyan:#3fd0d4; --coral:#ff7a59; --sand:#f5c86b; --mint:#7ee0a8;
  --disp:"Atma", "Noto Sans Bengali", system-ui, sans-serif;
  --body:"Noto Sans Bengali", system-ui, -apple-system, sans-serif;
  --r1:10px; --r2:18px; --r3:26px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--ink); color:var(--text); font-family:var(--body);
  font-size:17px; line-height:1.66; letter-spacing:0}
body:before{content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(760px 420px at 88% -8%, rgba(63,208,212,.14), transparent 70%),
    radial-gradient(620px 380px at 4% 12%, rgba(255,122,89,.09), transparent 72%)}
.wrap{width:min(1120px, calc(100% - 40px)); margin:0 auto; position:relative; z-index:1}
a{color:var(--cyan); text-decoration:underline; text-underline-offset:3px;
  text-decoration-thickness:1px}
a:hover{color:var(--sand)}
img{max-width:100%; height:auto}
h1,h2,h3{font-family:var(--disp); font-weight:700; line-height:1.14; margin:0}
h1{font-size:clamp(31px, 3.2vw + 14px, 54px); letter-spacing:-.01em}
h2{font-size:clamp(23px, 1.1vw + 17px, 31px)}
h3{font-size:19px; font-weight:600}
p{margin:0 0 15px}
.skip{position:absolute; left:-9999px}
.skip:focus{left:16px; top:12px; z-index:40; background:var(--slab); color:#fff;
  padding:10px 16px; border-radius:var(--r1)}

/* ── шапка: две строки, разделы отдельной лентой ───────────────────── */
.top{position:sticky; top:0; z-index:20; background:var(--ink);
  border-bottom:1px solid var(--line)}
.top__a{display:flex; align-items:center; gap:14px; padding:13px 0 11px}
.mark{display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit;
  margin-inline-end:auto; min-height:40px}
.mark svg{flex:none}
.mark b{font-family:var(--disp); font-size:19px; letter-spacing:.01em; display:block;
  line-height:1.1}
/* только подпись под названием: правило `.mark span` цепляло и обёртку,
   и название сайта уезжало в капс */
.mark__t > span{display:block; font-size:12.5px; color:var(--text-2);
  letter-spacing:.06em; text-transform:uppercase}
.lang{padding:9px 15px; min-height:40px; display:inline-flex; align-items:center;
  border-radius:var(--r1); font-size:14.5px; text-decoration:none; color:var(--text-2);
  box-shadow:inset 0 0 0 1px var(--line-2)}
.lang:hover{color:#fff; background:var(--slab)}
.top__b{border-top:1px solid var(--line); overflow-x:auto; scrollbar-width:none}
.top__b::-webkit-scrollbar{display:none}
.menu{display:flex; gap:22px; padding:0; margin:0; list-style:none; white-space:nowrap}
.menu a{display:inline-block; padding:12px 0; font-size:15.5px; color:var(--text-2);
  text-decoration:none; border-bottom:2px solid transparent; min-height:44px}
.menu a:hover{color:#fff}
.menu a[aria-current]{color:#fff; border-bottom-color:var(--cyan)}

/* ── первый экран: текст и карточка рядом ──────────────────────────── */
.hero{padding:40px 0 8px}
.hero__g{display:grid; grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);
  gap:34px; align-items:start}
.hero__l{min-width:0}
.kick{display:inline-flex; align-items:center; gap:9px; font-size:13.5px;
  letter-spacing:.08em; text-transform:uppercase; color:var(--cyan);
  padding:7px 13px; border-radius:99px; box-shadow:inset 0 0 0 1px var(--line-2)}
.hero h1{margin:16px 0 0; max-width:19ch}
.lead{font-size:19.5px; color:var(--text-2); margin:15px 0 0; max-width:58ch}
.acts{display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:24px 0 0}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px;
  min-height:48px; padding:13px 26px; border-radius:var(--r1); font-weight:600;
  font-size:16.5px; text-decoration:none; color:#08121a;
  background:linear-gradient(96deg, var(--cyan), var(--mint));
  box-shadow:0 12px 30px rgba(63,208,212,.22)}
.btn:hover{color:#08121a; filter:brightness(1.06); box-shadow:0 14px 34px rgba(63,208,212,.3)}
.btn--ghost{background:none; color:var(--text); box-shadow:inset 0 0 0 1px var(--line-2)}
.btn--ghost:hover{color:#fff; background:var(--slab)}
.btn--sm{min-height:40px; padding:9px 17px; font-size:15px}
.note{font-size:14.5px; color:var(--text-2); margin:14px 0 0}
.facts{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1px;
  margin:30px 0 0; background:var(--line); border-radius:var(--r2); overflow:hidden;
  box-shadow:inset 0 0 0 1px var(--line)}
.facts div{background:var(--ink-2); padding:17px 19px}
.facts dt{font-size:13px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-2); margin:0 0 5px}
.facts dd{margin:0; font-family:var(--disp); font-size:18px; font-weight:600}

/* ── карточка сбоку: печать с фактами или оглавление ───────────────── */
.aside{border-radius:var(--r3); padding:20px 20px 16px; margin-top:6px;
  background:linear-gradient(158deg, var(--slab), var(--ink-2));
  box-shadow:inset 0 0 0 1px var(--line-2)}
.aside__h{display:flex; align-items:center; gap:12px; margin:0 0 14px}
.aside__h b{font-family:var(--disp); font-size:17.5px; line-height:1.2}
.aside__h span{display:block; font-size:13px; color:var(--text-2);
  letter-spacing:.05em; text-transform:uppercase}
.seal{width:52px; height:52px; flex:none}
.aside dl{margin:0; display:grid; gap:0}
.aside dt{font-size:12.5px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-2); padding:11px 0 0; border-top:1px solid var(--line)}
.aside dt:first-child{border-top:0; padding-top:0}
.aside dd{margin:0 0 11px; font-family:var(--disp); font-size:16.5px; font-weight:600;
  line-height:1.3; word-break:break-word}
.aside p{margin:12px 0 0; padding-top:12px; border-top:1px solid var(--line);
  font-size:14.5px; color:var(--text-2)}
.toc{list-style:none; margin:0; padding:0; counter-reset:tc}
.toc li{counter-increment:tc; border-top:1px solid var(--line)}
.toc li:first-child{border-top:0}
.toc a{display:flex; gap:11px; padding:11px 0; text-decoration:none; color:var(--text);
  font-size:15.5px; line-height:1.35; min-height:44px; align-items:center}
.toc a:before{content:counter(tc,decimal-leading-zero); font-family:var(--disp);
  font-size:13px; color:var(--cyan); flex:none}
.toc a:hover{color:var(--sand)}

/* ── бегущая строка фактов: в ширину контента, края растушёваны ─────── */
.tick{position:relative; overflow:hidden; margin:26px 0 0; padding:11px 0;
  border-block:1px solid var(--line);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent)}
.tick__t{display:flex; width:max-content; animation:tick 46s linear infinite}
.tick b{display:inline-flex; align-items:center; gap:10px; padding:0 20px;
  font-family:var(--disp); font-weight:600; font-size:15px; color:var(--text-2);
  white-space:nowrap}
.tick b:after{content:""; width:5px; height:5px; border-radius:50%;
  background:var(--cyan); opacity:.75}
@keyframes tick{from{transform:translateX(0)} to{transform:translateX(-50%)}}
.tick:hover .tick__t{animation-play-state:paused}

/* ── разделы с номером в левом поле ────────────────────────────────── */
.sec{padding:34px 0 6px; display:grid; grid-template-columns:64px minmax(0,1fr);
  gap:0 20px; align-items:start}
.sec__n{font-family:var(--disp); font-size:15px; color:var(--cyan); padding-top:7px;
  letter-spacing:.08em}
.sec__b{min-width:0}
.sec h2{margin:0 0 12px}
.sec h3{margin:20px 0 8px}
.sec p, .sec ul, .sec ol{max-width:64ch}
.sec ul, .sec ol{margin:0 0 15px; padding-inline-start:22px}
.sec li{margin:0 0 8px}
.sec li::marker{color:var(--cyan)}

/* ── карточки, таблицы, врезки ─────────────────────────────────────── */
.cards{display:grid; gap:14px; grid-template-columns:repeat(2, minmax(0,1fr)); margin:6px 0 18px}
.card{background:var(--ink-2); border-radius:var(--r2); padding:18px 19px;
  box-shadow:inset 0 0 0 1px var(--line)}
.card b{display:block; font-family:var(--disp); font-size:18px; margin:0 0 6px}
.card span{color:var(--text-2); font-size:15.5px; display:block; line-height:1.55}
/* значок, а не пустая плитка: цветной квадрат без рисунка читается как
   недоделанный блок */
.ico{display:inline-flex; align-items:center; justify-content:center; width:40px;
  height:40px; border-radius:12px; margin:0 0 12px;
  background:linear-gradient(150deg, rgba(63,208,212,.16), rgba(255,122,89,.10));
  box-shadow:inset 0 0 0 1px var(--line-2)}
.ico .ic{display:block}
.steps{counter-reset:s; margin:4px 0 18px; padding:0; list-style:none}
.steps li{counter-increment:s; position:relative; padding:0 0 14px 44px; margin:0}
.steps li:before{content:counter(s, decimal-leading-zero); position:absolute; left:0; top:1px;
  font-family:var(--disp); font-size:15px; color:var(--coral)}
.steps b{display:block; font-size:17px}
.steps span{color:var(--text-2); font-size:15.5px}
/* видно, что таблица прокручивается: край темнеет, пока есть что тянуть */
.tsc{overflow-x:auto; margin:6px 0 18px; border-radius:var(--r2);
  box-shadow:inset 0 0 0 1px var(--line);
  background:
    linear-gradient(to right, var(--ink-2) 64%, rgba(17,27,39,0)),
    linear-gradient(to left, var(--ink-2) 64%, rgba(17,27,39,0)) 100% 0,
    radial-gradient(farthest-side at 0 50%, rgba(0,0,0,.45), rgba(0,0,0,0)),
    radial-gradient(farthest-side at 100% 50%, rgba(0,0,0,.45), rgba(0,0,0,0)) 100% 0;
  background-repeat:no-repeat;
  background-size:44px 100%, 44px 100%, 15px 100%, 15px 100%;
  background-attachment:local, local, scroll, scroll}
table{border-collapse:collapse; width:100%; min-width:520px; font-size:15.5px}
caption{text-align:start; padding:13px 18px 11px; color:var(--text-2);
  font-size:14.5px; line-height:1.4}
th,td{padding:12px 18px; text-align:start; border-bottom:1px solid var(--line);
  vertical-align:top}
th{font-family:var(--disp); font-weight:600; color:#fff; font-size:15px}
tr:last-child td{border-bottom:0}
.quote{margin:8px 0 20px; padding:16px 20px; border-inline-start:3px solid var(--coral);
  background:var(--ink-2); border-radius:0 var(--r2) var(--r2) 0; color:var(--text-2);
  font-size:16.5px}
.quote b{color:var(--text)}
.mini{display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between;
  margin:10px 0 20px; padding:15px 19px; border-radius:var(--r2); background:var(--slab);
  box-shadow:inset 0 0 0 1px var(--line-2)}
.mini b{font-family:var(--disp); font-size:17.5px; display:block}
.mini span{color:var(--text-2); font-size:15px}

/* ── доказательный блок вместо рекламы ─────────────────────────────── */
.proof{margin:26px 0 8px; border-radius:var(--r3); background:var(--ink-2);
  box-shadow:inset 0 0 0 1px var(--line-2); padding:22px 22px 22px; position:relative;
  overflow:hidden}
/* цветная рейка сверху: блок сравнения не должен теряться среди абзацев */
.proof:before{content:""; position:absolute; inset:0 0 auto; height:3px;
  background:linear-gradient(90deg, var(--cyan), var(--sand) 55%, var(--coral))}
.proof h2{font-size:23px; margin:0 0 8px}
.proof p{color:var(--text-2); max-width:62ch}
.proof dl{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0;
  margin:14px 0 0}
/* без промежутка вопрос упирался в ответ: «does it»+«lilbet prints» */
.proof dt{padding:13px 0 6px; padding-inline-end:28px; font-weight:600;
  border-top:1px solid var(--line)}
.proof dd{padding:13px 0 6px; margin:0; color:var(--text-2); border-top:1px solid var(--line)}
.proof .btn{margin-top:16px}

/* ── вопросы, соседи, финал, подвал ────────────────────────────────── */
.faq{margin:4px 0 16px; border-radius:var(--r2); overflow:hidden;
  box-shadow:inset 0 0 0 1px var(--line); counter-reset:q}
.faq details{counter-increment:q}
.faq summary:before{content:counter(q,decimal-leading-zero); font-size:13px;
  color:var(--cyan); letter-spacing:.06em; flex:none; padding-top:3px}
details{border-bottom:1px solid var(--line); background:var(--ink-2)}
details:last-child{border-bottom:0}
/* строка вопроса — флекс, иначе длинный вопрос переносится под номер,
   а плавающий «+» падает на вторую строку */
summary{cursor:pointer; padding:14px 46px 14px 18px; font-family:var(--disp);
  font-size:17px; min-height:44px; list-style:none; position:relative;
  display:flex; gap:12px; align-items:flex-start}
summary::-webkit-details-marker{display:none}
summary:after{content:"+"; position:absolute; inset-inline-end:18px; top:13px;
  color:var(--cyan); font-size:20px; line-height:1; font-family:var(--body)}
details[open] summary:after{content:"–"}
details p{margin:0; padding:0 18px 15px; color:var(--text-2); max-width:64ch}
.near{display:grid; gap:13px; grid-template-columns:repeat(3, minmax(0,1fr));
  margin:10px 0 6px}
/* заголовок «дальше» прилипал к блоку сверху, а на служебной странице
   карточки упирались в подвал: там нет финального призыва */
main > nav > h2{margin-top:34px}
main > nav:last-child{padding-bottom:44px}
.near a{display:block; padding:16px 17px; border-radius:var(--r2); text-decoration:none;
  background:var(--ink-2); color:inherit; box-shadow:inset 0 0 0 1px var(--line)}
.near a:hover{box-shadow:inset 0 0 0 1px var(--line-2); background:var(--slab)}
.near b{display:block; font-family:var(--disp); font-size:17px}
/* стрелка знаком, а не escape-последовательностью: в правке через bash
   она схлопывается в управляющий байт */
.near b:after{content:"→"; float:inline-end; color:var(--cyan); font-weight:400}
.near span{color:var(--text-2); font-size:15px}
.end{margin:26px 0 40px; padding:26px 24px; border-radius:var(--r3);
  background:linear-gradient(140deg, var(--slab), var(--ink-2));
  box-shadow:inset 0 0 0 1px var(--line-2)}
.end h2{margin:0 0 8px}
.end p{color:var(--text-2); max-width:60ch}
.foot{border-top:1px solid var(--line); padding:26px 0 40px; color:var(--text-2);
  font-size:15px; background:var(--ink-2)}
.foot__g{display:grid; gap:20px; grid-template-columns:1.4fr 1fr 1fr}
.foot h3{font-size:14px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-2); margin:0 0 9px; font-family:var(--body); font-weight:600}
.foot ul{list-style:none; margin:0; padding:0}
.foot a{color:var(--text-2); text-decoration:none; display:inline-block; padding:8px 0;
  min-height:40px}
.foot a:hover{color:#fff; text-decoration:underline}
.foot__l{margin:18px 0 0; padding:16px 0 0; border-top:1px solid var(--line);
  font-size:14px; line-height:1.6}
.age{display:inline-flex; align-items:center; gap:7px; font-weight:600; color:var(--sand)}
.crumbs{font-size:14px; color:var(--text-2); padding:14px 0 0}
.crumbs a{color:var(--text-2); text-decoration:none}
.crumbs a:hover{color:#fff; text-decoration:underline}
/* .sec ul задаёт отступ списку; здесь это сдвигало весь ряд на 22 px */
.sec .links404{display:flex; flex-wrap:wrap; gap:10px; list-style:none;
  padding:0; margin:18px 0}
.links404 a{display:inline-flex; align-items:center; min-height:44px; padding:10px 17px;
  border-radius:99px; text-decoration:none; color:var(--text-2);
  box-shadow:inset 0 0 0 1px var(--line-2)}
.links404 a:hover{color:#fff; background:var(--slab)}
.band{margin:22px 0; border-radius:var(--r2); overflow:hidden;
  box-shadow:inset 0 0 0 1px var(--line)}
.band img{display:block; width:100%}

/* ── схемы: рисунок со своей подписью ──────────────────────────────── */
.shot{margin:18px 0 22px}
.shot img{display:block; width:100%; border-radius:var(--r2);
  box-shadow:inset 0 0 0 1px var(--line-2)}
.shot figcaption{margin-top:11px; font-size:15px; color:var(--text-2); max-width:66ch;
  display:flex; gap:10px}
.shot figcaption b{color:var(--cyan); font-family:var(--disp); font-weight:600;
  flex:none; font-size:14px; padding-top:2px; letter-spacing:.06em}

/* рисунок и разбор рядом: колонка текста одна не держит широкий экран */
/* Схема во всю ширину, разбор под ней в две колонки. В половину полосы
   эти схемы не помещаются: широкая отрисовка даёт там подписи по 8 px,
   а узкая — столб картинки в 1100–1500 px рядом с четырьмя строками. */
.split{margin:10px 0 24px}
.split img{display:block; width:100%; border-radius:var(--r2);
  box-shadow:inset 0 0 0 1px var(--line-2)}
.split h3{margin:18px 0 12px}
.split ul{margin:0; padding:0; list-style:none;
  columns:2; column-gap:34px}
.split li{position:relative; padding-inline-start:22px; margin:0 0 12px;
  break-inside:avoid; color:var(--text-2); font-size:16px; line-height:1.5}
.split li:before{content:""; position:absolute; inset-inline-start:0; top:9px;
  width:9px; height:9px; border-radius:3px; background:var(--cyan); opacity:.85}
.split li b{color:var(--text)}

/* Бенгальская вязь: разрядка рвёт верхнюю черту и соединения, а
   отрицательный трекинг заголовков склеивает знаки. В bn-ветке её нет
   нигде — селекторы у веток общие, и поимённо это не удержать. */
html[lang="bn"] *, html[lang="bn"] *:before, html[lang="bn"] *:after{
  letter-spacing:normal}
/* у вязи знаки выходят и над строкой, и под ней: при 1.14 реф заголовка
   упирается в строку выше, а подстрочные — в строку ниже */
html[lang="bn"] h1, html[lang="bn"] h2, html[lang="bn"] h3{line-height:1.34}
html[lang="bn"] .proof dt, html[lang="bn"] .proof dd{line-height:1.6}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important}
  /* лента остановлена — но обрезанной строки на экране остаться не должно */
  .tick__t{animation:none; width:auto; flex-wrap:wrap; justify-content:center}
  .tick{-webkit-mask-image:none; mask-image:none}
}
@media (max-width:980px){
  .hero__g{grid-template-columns:minmax(0,1fr); gap:24px}
  .split ul{columns:1}
}
@media (max-width:900px){
  /* три плитки в две колонки дают ряд 2+1 — одинокая плитка. Первая
     занимает всю ширину, под ней ровный ряд из двух */
  .facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .facts > div:first-child{grid-column:1 / -1}
  .near{grid-template-columns:minmax(0,1fr)}
  /* три колонки в две дают ряд 2+1 — одинокая плитка. Описание сайта
     занимает всю ширину, под ним ровный ряд из двух списков */
  .foot__g{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .foot__g > div:first-child{grid-column:1 / -1}
}
/* на телефоне таблица разворачивается в карточки: третья колонка иначе
   уходит за край, и читатель видит оборванную фразу */
@media (max-width:640px){
  .tsc{overflow:visible; background:none}
  table{min-width:0; display:block}
  thead{display:none}
  tbody, tr, td{display:block; width:auto}
  tr{border-bottom:1px solid var(--line); padding:6px 0 12px}
  tr:last-child{border-bottom:0}
  td{padding:7px 16px 0; border:0}
  td:before{content:attr(data-label); display:block; font-size:12px;
    letter-spacing:.07em; text-transform:uppercase; color:var(--text-2);
    margin:0 0 3px}
  /* подпись у table{display:block} схлопывается в колонку по слову */
  caption{display:block; padding:13px 16px 2px}
}
@media (max-width:430px){
  /* «BANGLADESH · INDEPENDENT REVIEW» не влезало в строку и шапка росла */
  .mark__t span{font-size:10px; letter-spacing:.03em}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .wrap{width:calc(100% - 32px)}
  .sec{grid-template-columns:minmax(0,1fr); gap:0}
  .sec__n{padding:0 0 4px}
  .cards{grid-template-columns:minmax(0,1fr)}
  .facts{grid-template-columns:minmax(0,1fr)}
  .proof dl{grid-template-columns:minmax(0,1fr)}
  .proof dd{padding-top:0; border-top:0}
  .foot__g{grid-template-columns:minmax(0,1fr)}
}