/* Первый экран и верхние секции. */

/* ---------- hero ---------- */
.tb-hero{
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(135deg,#3f1160 0%,#20022a 58%,#40130c 100%);
  padding-block:var(--size-4) var(--size-4);
  min-height:50vh;display:flex;align-items:center;
  border-bottom:var(--border-size-1) solid var(--tb-line-soft);
}
.tb-hero__bg{
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;
  object-fit:cover;object-position:right center;
}
.tb-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(80% 75% at 50% 50%,rgba(32,2,42,.62) 0%,rgba(32,2,42,.4) 70%,rgba(32,2,42,.7) 100%);
}
@media (max-width:767px){
  .tb-hero__bg{object-position:72% center}
  .tb-hero::after{background:rgba(32,2,42,.66)}
}
.tb-hero__in{position:relative;z-index:1;text-align:center}
.tb-hero h1{margin-bottom:var(--size-2)}
.tb-hero__kicker{
  display:block;font-family:var(--tb-font);font-size:var(--font-size-0);
  letter-spacing:var(--font-letterspacing-4);text-transform:uppercase;
  color:var(--tb-hot-ink);margin-bottom:var(--size-1);
}
.tb-hero__lead{
  font-size:var(--font-size-1);color:var(--tb-text);margin:0 auto var(--size-4);
  line-height:var(--font-lineheight-3);
}
.tb-hero__cta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:var(--size-3)}
.tb-hero__cta .tb-btn{flex:1 1 220px;max-width:340px;min-width:0}
.tb-tiles{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
}
.tb-tile{
  background:rgba(47,17,65,.75);border:var(--border-size-1) solid var(--tb-line);
  border-radius:var(--radius-2);padding:7px 6px;text-align:center;
}
.tb-tile b{
  display:block;font-family:var(--tb-font);font-weight:var(--font-weight-8);
  font-size:var(--font-size-2);line-height:1.1;color:#fff;
}
.tb-tile span{display:block;font-size:var(--font-size-0);color:var(--tb-muted);line-height:1.3;margin-top:4px}
.tb-hero__fine{
  margin-top:var(--size-3);margin-bottom:0;font-size:var(--font-size-0);color:var(--tb-muted);opacity:.7;
}
@media (min-width:640px){
  .tb-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  .tb-tile{padding:14px 10px}
  .tb-tile b{font-size:var(--font-size-4)}
}
@media (min-width:1024px){
  .tb-hero{min-height:54vh;padding-block:var(--size-6) var(--size-6)}
  .tb-hero__lead{font-size:var(--font-size-2);max-width:74ch}
}

/* ---------- свёрнутое оглавление ---------- */
.tb-toc{margin-block:var(--size-4) 0}
.tb-toc details{
  border:var(--border-size-1) solid var(--tb-line-soft);border-radius:var(--radius-2);
  background:var(--tb-bg-2);
}
.tb-toc summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;
  padding:9px 12px;font-size:var(--font-size-0);color:var(--tb-muted);
  letter-spacing:var(--font-letterspacing-1);
}
.tb-toc summary::-webkit-details-marker{display:none}
.tb-toc summary .tb-i{width:16px;height:16px}
.tb-toc summary .tb-toc__ar{margin-left:auto;transition:transform .2s var(--ease-2)}
.tb-toc details[open] summary .tb-toc__ar{transform:rotate(180deg)}
.tb-toc ol{
  list-style:none;margin:0;padding:0 12px 12px;
  display:flex;flex-wrap:wrap;gap:4px 16px;
}
.tb-toc li{font-size:var(--font-size-0)}
.tb-toc a{color:var(--tb-muted);text-decoration:none;border-bottom:1px dotted var(--tb-line)}

/* ---------- общий заголовок секции ---------- */
.tb-h{display:flex;align-items:center;gap:12px;margin-bottom:var(--size-4)}
.tb-h .tb-i{width:26px;height:26px;color:var(--tb-hot);flex:none}
.tb-h h2{margin:0}
.tb-h__row{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;justify-content:space-between;margin-bottom:var(--size-4)}
.tb-h__row h2{margin:0}
.tb-sub{color:var(--tb-muted);margin-top:-6px;margin-bottom:var(--size-4)}
.tb-alt{background:var(--tb-bg-2)}
.tb-alt2{background:linear-gradient(180deg,var(--tb-bg) 0%,#1b0a28 100%)}

.tb-wide{margin:var(--size-5) 0}
.tb-wide img{width:100%;border-radius:var(--radius-2);border:var(--border-size-1) solid var(--tb-line)}

/* ---------- иллюстрация сбоку ---------- */
.tb-figpair{display:grid;gap:var(--size-5);align-items:start}
.tb-figpair figure{margin:0}
.tb-figpair img{width:100%;border-radius:var(--radius-2);border:var(--border-size-1) solid var(--tb-line)}
.tb-figpair figcaption{font-size:var(--font-size-0);color:var(--tb-muted);margin-top:6px}
@media (min-width:900px){
  .tb-figpair{grid-template-columns:minmax(0,1fr) 340px}
  .tb-figpair--wide{grid-template-columns:minmax(0,1fr) 420px}
  .tb-figpair--flip{grid-template-columns:340px minmax(0,1fr)}
  .tb-figpair--wide.tb-figpair--flip{grid-template-columns:420px minmax(0,1fr)}
  .tb-figpair--flip>figure{order:-1}
}
.tb-figpair:not(:last-child){margin-bottom:var(--size-6)}

/* ---------- таблица быстрых фактов ---------- */
.tb-tablewrap{overflow-x:auto;border:var(--border-size-1) solid var(--tb-line);border-radius:var(--radius-2)}
.tb-swipe{font-size:var(--font-size-0);color:var(--tb-muted);margin:6px 0 0}
@media (min-width:768px){.tb-swipe{display:none}}
table.tb-t{width:100%;border-collapse:collapse;font-size:var(--font-size-0);min-width:520px}
table.tb-t caption{text-align:left;padding:10px 14px;color:var(--tb-muted);font-size:var(--font-size-0)}
table.tb-t th{
  text-align:left;background:rgba(143,0,255,.16);color:#fff;font-family:var(--tb-font);
  font-weight:var(--font-weight-6);padding:12px 14px;border-bottom:var(--border-size-1) solid var(--tb-line);
}
table.tb-t td{padding:12px 14px;border-bottom:var(--border-size-1) solid var(--tb-line-soft);vertical-align:top}
table.tb-t tr:last-child td{border-bottom:0}
table.tb-t tbody tr:nth-child(even){background:rgba(255,255,255,.025)}
table.tb-t .tb-cell{display:flex;align-items:center;gap:8px}
table.tb-t .tb-cell .tb-i{width:17px;height:17px;color:var(--tb-brand-ink)}
.tb-facts td:first-child{width:38%;color:var(--tb-muted)}
.tb-facts td:last-child{color:#fff;font-weight:var(--font-weight-6)}

/* ---------- метки дат ---------- */
.tb-stamps{display:flex;flex-wrap:wrap;gap:16px;margin:var(--size-4) 0;font-size:var(--font-size-0);color:var(--tb-muted)}
.tb-stamps span{display:inline-flex;align-items:center;gap:6px}
.tb-stamps .tb-i{width:15px;height:15px}

/* ---------- честная плашка о лицензии ---------- */
.tb-licence{
  border:var(--border-size-1) solid var(--tb-line);border-left:var(--border-size-3) solid var(--tb-warn);
  border-radius:var(--radius-2);background:rgba(255,176,32,.07);padding:var(--size-4) var(--size-5);
  margin-bottom:var(--size-5);
}
.tb-licence h3{display:flex;align-items:center;gap:10px;color:var(--tb-warn);font-size:var(--font-size-2)}
.tb-licence h3 .tb-i{width:20px;height:20px}
.tb-licence p{font-size:var(--font-size-0);color:var(--tb-text)}
.tb-licence dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:var(--size-3) 0 0;font-size:var(--font-size-0)}
.tb-licence dt{color:var(--tb-muted)}
.tb-licence dd{margin:0;color:#fff}

/* ---------- безопасность: три панели ---------- */
.tb-sec3{display:grid;gap:var(--size-4)}
.tb-sec3>div{
  border:var(--border-size-1) solid var(--tb-line);border-radius:var(--radius-2);
  background:var(--tb-surface);padding:var(--size-5);
}
.tb-sec3 .tb-i{width:26px;height:26px;color:var(--tb-brand-ink);margin-bottom:10px}
.tb-sec3 p{font-size:var(--font-size-0);color:var(--tb-muted)}
@media (min-width:860px){.tb-sec3{grid-template-columns:repeat(3,minmax(0,1fr))}}

.tb-callout{
  margin-top:var(--size-5);border-left:var(--border-size-3) solid var(--tb-brand-soft);
  background:rgba(143,0,255,.12);padding:var(--size-4) var(--size-5);border-radius:0 var(--radius-2) var(--radius-2) 0;
}
.tb-callout b{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-family:var(--tb-font)}
.tb-callout .tb-i{width:18px;height:18px;color:var(--tb-brand-ink)}
.tb-callout p{font-size:var(--font-size-0);color:var(--tb-muted)}

/* ---------- «Your Benefits» — двухколоночный чек-лист без карточек ---------- */
.tb-checks{list-style:none;margin:0;padding:0;display:grid;gap:var(--size-4)}
.tb-checks li{display:flex;gap:12px;padding-bottom:var(--size-4);border-bottom:var(--border-size-1) solid var(--tb-line-soft)}
.tb-checks li:last-child{border-bottom:0;padding-bottom:0}
.tb-checks .tb-i{width:20px;height:20px;color:var(--tb-hot);margin-top:5px}
.tb-checks h4{color:#fff}
.tb-checks p{font-size:var(--font-size-0);color:var(--tb-muted);margin:0}
@media (min-width:860px){.tb-checks{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--size-7)}}

/* ---------- шаги: кружки с цифрами в столбик ---------- */
.tb-steps{list-style:none;counter-reset:tbstep;margin:0;padding:0;position:relative}
.tb-steps::before{content:"";position:absolute;left:19px;top:14px;bottom:26px;width:2px;background:var(--tb-line)}
.tb-steps li{position:relative;padding:0 0 var(--size-5) 56px;counter-increment:tbstep}
.tb-steps li:last-child{padding-bottom:0}
.tb-steps li::before{
  content:counter(tbstep);position:absolute;left:0;top:0;width:40px;height:40px;
  display:flex;align-items:center;justify-content:center;border-radius:var(--radius-round);
  background:var(--tb-brand);color:#fff;font-family:var(--tb-font);font-weight:var(--font-weight-8);
  box-shadow:0 0 0 5px var(--tb-bg);
}
.tb-steps h4{color:var(--tb-brand-ink);margin-bottom:4px}
.tb-steps p{font-size:var(--font-size-0);color:var(--tb-muted);margin:0}
.tb-inline{background:none;border:0;padding:0;color:var(--tb-hot-ink);font:inherit;cursor:pointer;text-decoration:underline}
