/* Текстовые страницы (соглашения, оферты, политики, статьи), перенесённые из обычных блоков Tilda.
   Блок .tf — бывшая запись Tilda: отступы --pt/--pb (телефон --ptm/--pbm), фон --bg.
   Элемент .tf-t — заголовок или текст: ширина --w, высота не меньше --h, смещение от центра --cx, отступ сверху --mt,
   типографика --fs/--lh/--fw/--c/--ta/--ls (суффикс m — телефон). Значения сняты с исходной страницы. */

.tfp { background: #f3f3f3; }
.tf { padding: calc(var(--pt, 0) * 1px) 0 calc(var(--pb, 0) * 1px); background: var(--bg, transparent); }
.tf::after { content: ''; display: table; clear: both; }
.tf > * {
    display: block; width: min(calc(var(--w) * 1px), calc(100% - 40px)); min-height: calc(var(--h, 0) * 1px); margin: calc(var(--mt, 0) * 1px) auto 0;
    translate: calc(var(--cx, 0) * 1px) 0;
}
.tf-t {
    font-family: var(--ff, inherit); font-size: calc(var(--fs) * 1px); line-height: var(--lh, 1.55); font-weight: var(--fw, 400);
    color: var(--c, #222); text-align: var(--ta, left); letter-spacing: calc(var(--ls, 0) * 1px); text-transform: var(--tt, none);
    padding: calc(var(--ipt, 0) * 1px) 0 calc(var(--ipb, 0) * 1px); overflow-wrap: break-word; /* длинные «______» в бланках не раздвигают страницу */
}
.tf-t p { margin: 0; }
.tf-t ul, .tf-t ol { margin: 0; padding-left: 20px; }
.tf-t a { color: inherit; text-decoration: underline; }
.tf-t strong, .tf-t b { font-weight: 700; }

.tf-table { overflow-x: auto; }
.tf-table table { width: 100%; border-collapse: separate; border-spacing: 0; }
/* сетка как в Tilda: рамка слева у каждой ячейки, справа у последней, сверху у первой строки */
.tf-table td:last-child, .tf-table th:last-child { border-right: var(--tdbd, 1px solid #ddd); }
.tf-table thead > tr:first-child > *, .tf-table table:not(:has(thead)) > tbody > tr:first-child > * { border-top: var(--tdbd, 1px solid #ddd); }
.tf-table td, .tf-table th { box-sizing: content-box; padding: var(--tdpad, 10px); border-left: var(--tdbd, 1px solid #ddd); border-bottom: var(--tdbd, 1px solid #ddd); color: var(--tdc, #222); background: var(--tdbg, transparent); font-size: calc(var(--tdfs, 16) * 1px); line-height: var(--tdlh, 1.55); text-align: left; vertical-align: top; }

.tf-table th { padding: var(--thpad, var(--tdpad, 10px)); border-bottom: var(--thbd, var(--tdbd)); color: var(--thc, var(--tdc)); background: var(--thbg, var(--tdbg)); font-size: calc(var(--thfs, var(--tdfs, 16)) * 1px); line-height: var(--thlh, var(--tdlh, 1.55)); font-weight: var(--thfw, 700); }

/* полоса прогресса чтения (бывший T602) — без JS, на анимации от прокрутки */
.tf-progress { position: fixed; left: 0; top: 0; z-index: 200; width: 100%; height: 4px; background: #00e673; transform-origin: 0 50%; transform: scaleX(0); }
@supports (animation-timeline: scroll()) { .tf-progress { animation: tf-progress linear both; animation-timeline: scroll(root); } }
@keyframes tf-progress { to { transform: scaleX(1); } }

/* точки-навигация по разделам справа (бывший T607) */
.tf-dots { position: fixed; right: 20px; top: 50%; z-index: 50; translate: 0 -50%; display: flex; flex-direction: column; gap: 25px; }
.tf-dots a { position: relative; display: block; width: 13px; height: 13px; border: 2px solid #f3f3f3; border-radius: 50%; background: #003837; }
.tf-dots span { position: absolute; right: 33px; top: 50%; translate: 0 -50%; display: none; padding: 0 10px; border-radius: 3px; background: #f3f3f3; color: #000; font-size: 14px; font-weight: 600; line-height: 2.5; white-space: nowrap; }
.tf-dots a:hover span { display: block; }

@media (max-width: 959px) {
    .tf { padding: calc(var(--ptm, var(--pt, 0)) * 1px) 0 calc(var(--pbm, var(--pb, 0)) * 1px); }
    .tf > * { width: calc(var(--wm, var(--w)) * 1px); max-width: calc(100% - 40px); min-height: calc(var(--hm, var(--h, 0)) * 1px); margin-top: calc(var(--mtm, var(--mt, 0)) * 1px); translate: calc(var(--cxm, 0) * 1px) 0; }
    .tf-t { padding: calc(var(--iptm, var(--ipt, 0)) * 1px) 0 calc(var(--ipbm, var(--ipb, 0)) * 1px); font-size: calc(var(--fsm, var(--fs)) * 1px); line-height: var(--lhm, var(--lh, 1.55)); font-weight: var(--fwm, var(--fw, 400)); color: var(--cm, var(--c, #222)); text-align: var(--tam, var(--ta, left)); }
    .tf-table td, .tf-table th { padding: var(--tdpadm, var(--tdpad, 10px)); font-size: calc(var(--tdfsm, var(--tdfs, 16)) * 1px); line-height: var(--tdlhm, var(--tdlh, 1.55)); }
    .tf-table th { padding: var(--thpadm, var(--thpad, var(--tdpad))); font-size: calc(var(--thfsm, var(--thfs, var(--tdfs, 16))) * 1px); line-height: var(--thlhm, var(--thlh, 1.55)); }
    /* широкая таблица прокручивается внутри колонки, как в Tilda */
    .tf > .tf-table { width: auto; translate: none; margin-inline: 20px; }
    .tf-dots { display: none; }
}

/* всплывающее уведомление в координатной вёрстке (kz/ofd/agreement) — во всю ширину, фон затемнён и размыт, как в Tilda */
.zpop { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; overflow: auto; }
.zpop[open] { display: flex; align-items: center; animation: zpop-in .3s ease-out; }
.zpop::backdrop { background: rgba(0, 56, 55, .7); backdrop-filter: blur(4px); }
.zpop:focus { outline: none; }
.zpop > .z { flex: none; width: 100%; overflow: visible; } /* крестик выходит за край карточки */
@keyframes zpop-in { from { opacity: 0; } }
