/* Tulpar — тёмная тема. Цвета флага КР: красный + солнечно-жёлтый. */
:root {
  --bg: #14161b; --bg2: #1b1e24; --card: #20242b; --card2: #262a33; --line: #323743; --line2: #424856;
  --tx: #eceef2; --tx2: #b4bac6; --tx3: #858c99;
  --red: #e8334a; --red2: #ff5368; --sun: #ffc53d; --mint: #3ccf91; --sky: #5aa9ff;
  --r: 14px; --r2: 22px; --wrap: 1200px;
  --ff: Onest, "Segoe UI", Arial, sans-serif; --fh: Unbounded, Onest, Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 84px; }
body { margin: 0; background: var(--bg); color: var(--tx); font: 400 17px/1.65 var(--ff); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--sun); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: #ffd76e; }
:focus-visible { outline: 2px solid var(--sun); outline-offset: 2px; }
.tp-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.tp-skip { position: absolute; left: -999px; top: 8px; background: var(--sun); color: #000; padding: 8px 14px; z-index: 99; border-radius: 8px; }
.tp-skip:focus { left: 8px; }
.tp-lock { overflow: hidden; }

/* ── верхняя строка и шапка ── */
.tp-topline { background: #0f1115; color: var(--tx3); font-size: 13px; text-align: center; padding: 6px 0; border-bottom: 1px solid var(--line); }
.tp-topline a { color: var(--tx2); }
.tp-head { position: sticky; top: 0; z-index: 40; background: #15171c; border-bottom: 1px solid var(--line); }
.tp-head-in { display: flex; align-items: center; gap: 20px; min-height: 70px; }
.tp-brand img { width: 190px; }
.tp-menu { margin-left: auto; }
.tp-menu > ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.tp-menu a, .tp-sub-btn { display: block; color: var(--tx); text-decoration: none; font: 600 15px/1 var(--ff); padding: 12px 14px; border-radius: 10px; background: none; border: 0; cursor: pointer; }
.tp-menu a:hover, .tp-sub-btn:hover, .tp-sub.is-open > .tp-sub-btn { background: var(--card); color: var(--tx); }
.tp-menu a[aria-current="page"] { color: var(--sun); }
.tp-sub { position: relative; }
.tp-sub-btn::after { content: ""; display: inline-block; width: 7px; height: 7px; margin-left: 8px; border: solid currentColor; border-width: 0 2px 2px 0; transform: translateY(-3px) rotate(45deg); }
.tp-sub-list { display: none; position: absolute; top: calc(100% + 8px); left: 0; min-width: 230px; list-style: none; margin: 0; padding: 8px; background: var(--card); border: 1px solid var(--line2); border-radius: var(--r); box-shadow: 0 18px 40px rgba(0, 0, 0, .45); }
.tp-sub.is-open .tp-sub-list { display: block; }
.tp-sub-list a { font-weight: 500; padding: 10px 12px; }
.tp-sub-list a:hover { background: var(--card2); }
.tp-head-cta { background: var(--red); color: #fff; text-decoration: none; font: 700 14px/1 var(--fh); padding: 13px 18px; border-radius: 999px; white-space: nowrap; }
.tp-head-cta:hover { background: var(--red2); color: #fff; }
.tp-menu-btn { display: none; margin-left: auto; align-items: center; gap: 10px; background: var(--card); color: var(--tx); border: 1px solid var(--line2); border-radius: 999px; padding: 10px 16px; font: 600 15px var(--ff); cursor: pointer; }
.tp-menu-ico, .tp-menu-ico::before, .tp-menu-ico::after { display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; position: relative; }
.tp-menu-ico::before, .tp-menu-ico::after { content: ""; position: absolute; left: 0; }
.tp-menu-ico::before { top: -6px; } .tp-menu-ico::after { top: 6px; }

/* ── герой ── */
.tp-hero { background: radial-gradient(900px 400px at 85% 0%, rgba(232, 51, 74, .18), transparent 60%), linear-gradient(180deg, #181b21, var(--bg)); border-bottom: 1px solid var(--line); }
.tp-hero-in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; padding-top: 28px; padding-bottom: 40px; align-items: center; }
.tp-hero--img .tp-hero-in, .tp--brand_review .tp-hero-in { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.tp-path ol { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0 0 18px; padding: 0; font-size: 14px; color: var(--tx3); }
.tp-path li + li::before { content: "›"; margin-right: 6px; color: var(--line2); }
.tp-path a { color: var(--tx2); text-decoration: none; }
.tp-path a:hover { color: var(--sun); }
h1, h2, h3 { font-family: var(--fh); font-weight: 700; line-height: 1.22; letter-spacing: -.01em; }
h1 { font-size: clamp(28px, 3.6vw, 44px); margin: 0 0 18px; hyphens: auto; overflow-wrap: break-word; }
.tp-lead { font-size: 19px; color: var(--tx2); }
.tp-lead p { margin: 0 0 12px; }
.tp-stamp { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; font-size: 13px; color: var(--tx3); }
.tp-stamp span { border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; }
.tp-note { color: var(--tx3); font-size: 15px; margin: 8px 0 0; }
.tp-hero-pic { margin: 0; border-radius: var(--r2); overflow: hidden; border: 1px solid var(--line); aspect-ratio: 4 / 3; }
.tp-hero-pic img { width: 100%; height: 100%; object-fit: cover; object-position: 78% 50%; }

/* ── кнопки ── */
.tp-acts { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 0; }
.tp-go, .tp-ghost { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 999px; font: 700 15px/1.1 var(--ff); text-decoration: none; text-align: center; cursor: pointer; transition: background .15s, border-color .15s; }
.tp-go { background: var(--red); color: #fff; border: 2px solid var(--red); }
.tp-go:hover { background: var(--red2); border-color: var(--red2); color: #fff; }
.tp-ghost { background: transparent; color: var(--tx); border: 2px solid var(--line2); }
.tp-ghost:hover { border-color: var(--sun); color: var(--sun); }
.tp-go--s { min-height: 38px; padding: 0 16px; font-size: 14px; }

/* ── счётчики ── */
.tp-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; list-style: none; margin: 24px 0 0; padding: 0; }
.tp-stats li { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; font-size: 14px; color: var(--tx2); line-height: 1.4; }
.tp-stats b { display: block; color: var(--sun); font: 700 20px/1.2 var(--fh); margin-bottom: 2px; }

/* ── раскладка ── */
.tp-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 48px; padding-top: 40px; padding-bottom: 64px; align-items: start; }
.tp-layout--solo, .tp--home .tp-layout { grid-template-columns: minmax(0, 1fr); }
.tp-layout--solo .tp-text, .tp--home .tp-text { max-width: 980px; }
.tp-layout:not(:has(.tp-side)) { grid-template-columns: minmax(0, 1fr); }
.tp-side { position: sticky; top: 92px; display: grid; gap: 16px; }
.tp-toc { background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.tp-toc summary { font: 700 14px var(--fh); cursor: pointer; list-style: none; color: var(--tx); }
.tp-toc summary::-webkit-details-marker { display: none; }
.tp-toc summary::after { content: "+"; float: right; color: var(--sun); }
.tp-toc[open] summary::after { content: "–"; }
.tp-toc ol { margin: 12px 0 0; padding: 0 0 0 18px; font-size: 14px; line-height: 1.45; max-height: 60vh; overflow: auto; }
.tp-toc li { margin: 6px 0; color: var(--tx3); }
.tp-toc a { color: var(--tx2); text-decoration: none; }
.tp-toc a:hover { color: var(--sun); }
.tp-side-top { background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.tp-side-top ol { list-style: none; margin: 8px 0 10px; padding: 0; counter-reset: s; }
.tp-side-top li { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--line); counter-increment: s; }
.tp-side-top li::before { content: counter(s); font: 700 13px var(--fh); color: var(--bg); background: var(--sun); width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; }
.tp-side-top a { color: var(--tx); text-decoration: none; font-weight: 600; flex: 1; }
.tp-side-top b { color: var(--sun); font-family: var(--fh); font-size: 14px; }

/* ── текст ── */
.tp-text { min-width: 0; }
.tp-text h2 { font-size: clamp(22px, 2.4vw, 29px); margin: 52px 0 16px; padding-top: 4px; }
.tp-text h2::before { content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--red) 60%, var(--sun) 60%); margin-bottom: 14px; }
.tp-text h2.tp-plain::before { display: none; }
.tp-text > h2:first-child, .tp-text > :first-child { margin-top: 0; }
.tp-text h3 { font-size: 19px; margin: 32px 0 10px; color: #fff; }
.tp-text p, .tp-text ul, .tp-text ol { margin: 0 0 16px; }
.tp-text ul, .tp-text ol { padding-left: 22px; }
.tp-text li { margin: 6px 0; }
.tp-text li::marker { color: var(--red2); }
.tp-text strong { color: #fff; }
.tp-text blockquote { margin: 20px 0; padding: 16px 20px; background: var(--bg2); border-left: 4px solid var(--sun); border-radius: 0 var(--r) var(--r) 0; color: var(--tx2); }
.tp-text blockquote p:last-child { margin: 0; }
.tp-text hr { border: 0; border-top: 1px solid var(--line); margin: 36px 0; }
.tp-cap { display: block; font: 600 12px/1.3 var(--ff); text-transform: uppercase; letter-spacing: .08em; color: var(--tx3); }
.tp-fine { font-size: 14px; }
.tp-dim { color: var(--tx3); }
.tp-ok { color: var(--mint); font-weight: 600; }
.tp-no { color: var(--red2); font-weight: 600; }
.tp-pending { color: var(--tx3); font-style: italic; }
.tp--draft .tp-pending { background: #5a4600; color: #ffe08a; font-style: normal; padding: 0 4px; border-radius: 4px; }

/* ── таблицы ── */
.tp-scroll { overflow-x: auto; margin: 0 0 20px; border: 1px solid var(--line); border-radius: var(--r); background: var(--bg2); -webkit-overflow-scrolling: touch; }
.tp-grid { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.tp-grid--wide { min-width: 720px; }
.tp-grid th, .tp-grid td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.tp-grid thead th { background: var(--card2); font: 600 13px/1.3 var(--ff); color: var(--tx2); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.tp-grid tbody tr:last-child > * { border-bottom: 0; }
.tp-grid tbody tr:hover { background: rgba(255, 255, 255, .02); }
.tp-grid a { color: var(--tx); }
.tp-grid a:hover { color: var(--sun); }
.tp-spec th[scope="row"] { width: 42%; color: var(--tx3); font-weight: 500; }

.tp-mark { display: inline-flex; align-items: baseline; gap: 1px; background: var(--sun); color: #16130a; font: 700 15px/1 var(--fh); padding: 6px 10px; border-radius: 8px; white-space: nowrap; }
.tp-mark small { font-size: 11px; opacity: .7; }
.tp-mark.is-wait { background: var(--card2); color: var(--tx3); font: 500 13px var(--ff); }

.tp-pairs { list-style: none; padding: 0 !important; margin: 0 0 20px; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.tp-pairs li { display: grid; grid-template-columns: 200px 1fr; gap: 14px; padding: 11px 16px; margin: 0 !important; border-bottom: 1px solid var(--line); background: var(--bg2); }
.tp-pairs li:last-child { border-bottom: 0; }
.tp-pairs li > span:first-child { color: var(--tx3); }

/* ── список казино ── */
.tp-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.tp-chip { background: var(--card); color: var(--tx2); border: 1px solid var(--line2); border-radius: 999px; padding: 9px 16px; font: 600 14px var(--ff); cursor: pointer; }
.tp-chip:hover { color: var(--tx); border-color: var(--tx3); }
.tp-chip.is-on { background: var(--sun); border-color: var(--sun); color: #16130a; }
.tp-list { list-style: none; padding: 0 !important; margin: 0 0 24px; display: grid; gap: 14px; }
.tp-row { margin: 0 !important; display: grid; grid-template-columns: 250px minmax(0, 1fr) 190px; gap: 22px; align-items: center; background: var(--card); border: 1px solid var(--line); border-radius: var(--r2); padding: 18px 22px; position: relative; }
.tp-row:first-child { border-color: rgba(255, 197, 61, .55); box-shadow: 0 0 0 1px rgba(255, 197, 61, .2) inset; }
.tp-row[hidden] { display: none; }
.tp-row-id { display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; align-items: center; }
.tp-row-n { grid-row: span 2; font: 700 30px/1 var(--fh); color: var(--line2); }
.tp-row:first-child .tp-row-n { color: var(--sun); }
.tp-row-logo img { width: 150px; }
.tp-row-title { display: flex; align-items: center; gap: 10px; }
.tp-row-name { color: var(--tx); font: 700 16px var(--fh); text-decoration: none; }
.tp-row-offer { font-weight: 600; color: #fff; margin-bottom: 10px; line-height: 1.4; }
.tp-row-offer .tp-cap { display: inline; margin-right: 6px; color: var(--sun); }
.tp-row-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 18px; margin: 0; font-size: 14px; line-height: 1.4; }
.tp-row-specs dt { color: var(--tx3); font-size: 12px; }
.tp-row-specs dd { margin: 0; color: var(--tx); }
.tp-row-act { display: grid; gap: 8px; }
.tp-row-act .tp-go, .tp-row-act .tp-ghost { min-height: 44px; }
.tp-row-date { font-size: 12px; color: var(--tx3); text-align: center; }
.tp-chips-none { color: var(--tx3); }

/* ── подборки ── */
.tp-picks { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 0 0 24px; }
.tp-pick { display: flex; flex-direction: column; gap: 8px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; text-decoration: none; color: var(--tx); }
.tp-pick:hover { border-color: var(--sun); color: var(--tx); }
.tp-pick-tag { font-size: 12px; text-transform: uppercase; letter-spacing: .07em; color: var(--sun); font-weight: 700; }
.tp-pick img { width: 120px; }
.tp-pick-why { font-size: 14px; color: var(--tx2); line-height: 1.4; }

/* ── обзор: карточка оператора и оценка ── */
.tp-op { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-top: 22px; }
.tp-op-card, .tp-meter { background: var(--card); border: 1px solid var(--line); border-radius: var(--r2); padding: 18px; }
.tp-hero-txt .tp-op-card { margin-top: 22px; display: grid; grid-template-columns: 190px 1fr; gap: 6px 22px; align-items: center; }
.tp-op-card img { width: 190px; }
.tp-op-card .tp-acts { grid-column: 1 / -1; margin-top: 8px; }
.tp-op-offer { font: 700 17px/1.35 var(--ff); color: #fff; margin: 0; }
.tp-op-offer .tp-cap { margin-bottom: 4px; }
.tp-op .tp-acts { margin-top: 14px; }
.tp-op .tp-acts a { flex: 1 1 140px; }
.tp-meter-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.tp-meter-num { font: 700 40px/1 var(--fh); color: var(--sun); white-space: nowrap; }
.tp-hero .tp-meter { padding: 24px; }
.tp-meter-num small { font-size: 14px; color: var(--tx3); }
.tp-meter-list { list-style: none; margin: 0 0 8px; padding: 0; font-size: 13px; }
.tp-meter-list li { display: grid; grid-template-columns: 120px 1fr 32px; gap: 10px; align-items: center; padding: 4px 0; }
.tp-meter-k { color: var(--tx2); }
.tp-meter-bar { height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; }
.tp-meter-bar i { display: block; height: 100%; width: var(--w); background: linear-gradient(90deg, var(--red), var(--sun)); border-radius: 3px; }
.tp-meter-list b { text-align: right; color: #fff; }

/* ── бонус-бокс, промокод, баннер ── */
.tp-offer { background: linear-gradient(135deg, #2a1d22, var(--card)); border: 1px solid rgba(232, 51, 74, .45); border-radius: var(--r2); padding: 22px; margin: 0 0 24px; }
.tp-offer-top { display: flex; gap: 16px; align-items: center; margin-bottom: 14px; }
.tp-offer-top img { width: 120px; flex: none; }
.tp-offer-sum { display: block; font: 700 20px/1.3 var(--fh); color: #fff; }
.tp-offer-list { list-style: none; padding: 0 !important; margin: 0 0 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
.tp-offer-list li { margin: 0 !important; padding: 9px 0; border-bottom: 1px dashed var(--line2); font-size: 15px; display: flex; flex-direction: column; }
.tp-offer-list li span { color: var(--tx3); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.tp-offer-end { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.tp-code { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: center; background: var(--card); border: 2px dashed var(--sun); border-radius: var(--r2); padding: 18px 22px; margin: 0 0 24px; }
.tp-code strong { display: block; font-size: 18px; color: #fff; }
.tp-code-val { font-family: var(--fh); letter-spacing: .1em; color: var(--sun) !important; }
.tp-band { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; background: var(--card2); border-radius: var(--r2); padding: 18px 22px; margin: 28px 0; border-left: 6px solid var(--red); }
.tp-band img { width: 140px; }
.tp-band-txt { flex: 1 1 240px; display: flex; flex-direction: column; }
.tp-band-txt strong { font-size: 17px; }
.tp-band-txt span { color: var(--tx2); font-size: 15px; }
.tp-brief { list-style: none; padding: 0 !important; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin: 0 0 24px; }
.tp-brief li { margin: 0 !important; background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; font-size: 15px; display: flex; flex-direction: column; }
.tp-brief li span { font-size: 12px; color: var(--tx3); text-transform: uppercase; letter-spacing: .05em; }
.tp-domain { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 18px; background: rgba(60, 207, 145, .1); border: 1px solid rgba(60, 207, 145, .4); color: var(--tx); border-radius: var(--r); padding: 12px 16px; font-size: 15px; }
.tp-domain svg { color: var(--mint); }
.tp-stores { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.tp-store { display: inline-flex; align-items: center; gap: 12px; background: #000; color: #fff; border: 1px solid var(--line2); border-radius: 14px; padding: 10px 18px; text-decoration: none; min-width: 200px; }
.tp-store:hover { border-color: var(--sun); color: #fff; }
.tp-store span { display: flex; flex-direction: column; font-weight: 700; line-height: 1.2; }
.tp-store small { font-weight: 400; font-size: 12px; color: var(--tx3); }
.tp-labtest { background: var(--bg2); border: 1px solid var(--mint); border-radius: var(--r2); padding: 18px; margin-bottom: 24px; }

/* ── плюсы и минусы, шаги ── */
.tp-pc { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 24px; }
.tp-pc > div { background: var(--bg2); border-radius: var(--r2); padding: 18px 20px; border-top: 4px solid; }
.tp-pc-plus { border-color: var(--mint) !important; }
.tp-pc-minus { border-color: var(--red) !important; }
.tp-pc-h { font: 700 16px var(--fh); margin: 0 0 8px !important; }
.tp-pc ul { margin: 0 !important; padding-left: 20px; font-size: 15px; }
.tp-pc-plus li::marker { content: "+  "; color: var(--mint); font-weight: 700; }
.tp-pc-minus li::marker { content: "−  "; color: var(--red2); font-weight: 700; }
.tp-howto { list-style: none; padding: 0 !important; counter-reset: h; margin: 0 0 24px; }
.tp-howto li { counter-increment: h; position: relative; padding: 12px 16px 12px 58px; margin: 0 0 10px !important; background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); }
.tp-howto li::before { content: counter(h); position: absolute; left: 14px; top: 12px; width: 30px; height: 30px; border-radius: 9px; background: var(--red); color: #fff; font: 700 14px/30px var(--fh); text-align: center; }

/* ── плитки-ссылки ── */
.tp-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; margin: 0 0 24px; }
.tp-tiles--2 { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.tp-tile { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: var(--r2); overflow: hidden; text-decoration: none; color: var(--tx); transition: transform .15s, border-color .15s; }
.tp-tile:hover { transform: translateY(-2px); border-color: var(--sun); color: var(--tx); }
.tp-tile img { aspect-ratio: 2 / 1; object-fit: cover; object-position: 80% 50%; width: 100%; }
.tp-tile-txt { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; }
.tp-tile-txt strong { font: 700 16px/1.3 var(--fh); }
.tp-tile-txt span { font-size: 14px; color: var(--tx2); line-height: 1.45; }

.tp-also { margin-top: 44px; }
.tp-also-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.tp-also-list a { display: flex; align-items: center; gap: 10px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 10px 14px; text-decoration: none; color: var(--tx); font-size: 15px; }
.tp-also-list a:hover { border-color: var(--sun); }
.tp-also-list img { width: 56px; flex: none; }
.tp-fig { margin: 0 0 24px; border-radius: var(--r2); overflow: hidden; border: 1px solid var(--line); }

/* ── калькулятор ── */
.tp-calc { background: var(--card); border: 1px solid var(--line); border-radius: var(--r2); padding: 20px; margin: 0 0 24px; }
.tp-calc-in { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.tp-calc label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--tx2); }
.tp-calc input, .tp-calc select { background: var(--bg); color: var(--tx); border: 1px solid var(--line2); border-radius: 10px; padding: 11px 12px; font: 500 16px var(--ff); width: 100%; }
.tp-calc-res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 16px 0 10px; }
.tp-calc-res div { background: var(--bg2); border-radius: var(--r); padding: 12px; display: flex; flex-direction: column; }
.tp-calc-res span { font-size: 12px; color: var(--tx3); }
.tp-calc-res strong { font: 700 19px var(--fh); color: var(--sun); }

/* ── FAQ, предупреждение ── */
.tp-qa { margin-top: 48px; }
.tp-qa-item { border: 1px solid var(--line); border-radius: var(--r); margin-bottom: 10px; background: var(--bg2); }
.tp-qa-item summary { cursor: pointer; padding: 15px 52px 15px 18px; font-weight: 600; color: #fff; position: relative; list-style: none; }
.tp-qa-item summary::-webkit-details-marker { display: none; }
.tp-qa-item summary::after { content: ""; position: absolute; right: 20px; top: 50%; width: 9px; height: 9px; border: solid var(--sun); border-width: 0 2px 2px 0; transform: translateY(-70%) rotate(45deg); transition: transform .15s; }
.tp-qa-item[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.tp-qa-a { padding: 0 18px 14px; color: var(--tx2); }
.tp-qa-a p:last-child { margin-bottom: 0; }
.tp-care { margin-top: 40px; background: #1c1517; border: 1px solid rgba(232, 51, 74, .4); border-radius: var(--r2); padding: 18px 20px 4px; }
.tp-care strong { color: var(--red2); }
.tp-care p { color: var(--tx2); font-size: 15px; margin-top: 6px; }

/* ── 404 ── */
.tp-lost { text-align: center; padding: 60px 0; margin: 0 auto; }
.tp-lost-n { font: 700 110px/1 var(--fh); color: var(--red); margin: 0; }
.tp-lost .tp-acts { justify-content: center; }

/* ── подвал ── */
.tp-foot { background: #0f1115; border-top: 1px solid var(--line); padding: 48px 0 28px; color: var(--tx2); font-size: 15px; }
.tp-foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
.tp-foot-about img { width: 190px; margin-bottom: 14px; }
.tp-foot-age { display: flex; align-items: center; gap: 10px; }
.tp-foot-age span { border: 2px solid var(--red); color: var(--red2); font: 700 13px var(--fh); border-radius: 50%; width: 40px; height: 40px; display: grid; place-items: center; }
.tp-foot-h { font: 700 14px var(--fh); color: #fff; margin: 0 0 12px; }
.tp-foot-col ul { list-style: none; margin: 0; padding: 0; }
.tp-foot-col li { margin: 0 0 8px; }
.tp-foot-col a { color: var(--tx2); text-decoration: none; }
.tp-foot-col a:hover { color: var(--sun); }
.tp-foot-legal { margin-top: 36px; padding-top: 22px; border-top: 1px solid var(--line); font-size: 13px; color: var(--tx3); line-height: 1.6; }
.tp-foot-legal a { color: var(--tx2); }
.tp-foot-copy { margin: 10px 0 0; }

/* ── адаптив ── */
@media (max-width: 1100px) {
  .tp-row { grid-template-columns: 220px minmax(0, 1fr); }
  .tp-row-act { grid-column: 1 / -1; grid-template-columns: 1fr 1fr auto; align-items: center; }
  .tp-layout { grid-template-columns: 230px minmax(0, 1fr); gap: 32px; }
}
@media (max-width: 960px) {
  .tp-menu-btn { display: inline-flex; }
  .tp-head-cta { display: none; }
  .tp-menu { display: none; position: fixed; top: 70px; left: 0; right: 0; bottom: 0; background: var(--bg); overflow-y: auto; padding: 12px 16px 40px; margin: 0; border-top: 1px solid var(--line); }
  .tp-menu.is-open { display: block; }
  .tp-menu > ul { flex-direction: column; gap: 2px; }
  .tp-menu a, .tp-sub-btn { font-size: 17px; padding: 14px 12px; width: 100%; text-align: left; }
  .tp-sub-list { position: static; box-shadow: none; border: 0; background: var(--bg2); margin: 2px 0 8px; }
  .tp-hero--img .tp-hero-in, .tp--brand_review .tp-hero-in { grid-template-columns: 1fr; gap: 24px; }
  .tp-hero-pic { aspect-ratio: 12 / 5; }
  .tp-hero-pic img { object-position: 50% 50%; }
  .tp-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-top: 24px; }
  .tp-side { position: static; }
  .tp-side-top { display: none; }
  .tp-hero-txt .tp-op-card { grid-template-columns: 1fr; }
  .tp-foot-grid { grid-template-columns: 1fr 1fr; }
  .tp-foot-about { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .tp-wrap { padding: 0 16px; }
  .tp-brand img { width: 160px; }
  .tp-head-in { min-height: 62px; }
  .tp-topline { font-size: 12px; }
  .tp-lead { font-size: 17px; }
  .tp-hero-in { padding-top: 18px; padding-bottom: 28px; }
  .tp-hero-pic { aspect-ratio: 16 / 9; }
  .tp-hero-pic img { object-position: 72% 50%; }
  .tp-acts a { flex: 1 1 100%; }
  .tp-row { grid-template-columns: 1fr; padding: 16px; gap: 14px; }
  .tp-row-id { grid-template-columns: auto 1fr; }
  .tp-row-n { font-size: 24px; }
  .tp-row-logo img { width: 130px; }
  .tp-row-act { grid-template-columns: 1fr 1fr; }
  .tp-row-date { grid-column: 1 / -1; }
  .tp-row-specs { grid-template-columns: 1fr 1fr; }
  .tp-pairs li { grid-template-columns: 1fr; gap: 2px; }
  .tp-offer-list { grid-template-columns: 1fr; }
  .tp-pc { grid-template-columns: 1fr; }
  .tp-calc-res { grid-template-columns: 1fr; }
  .tp-meter-list li { grid-template-columns: 105px 1fr 28px; }
  .tp-stats { grid-template-columns: 1fr 1fr; }
  .tp-foot-grid { grid-template-columns: 1fr; }
  .tp-spec th[scope="row"] { width: 46%; }
  .tp-grid th, .tp-grid td { padding: 10px 12px; }
}