/* ═══════════════ Общие стили для юр. и информационных страниц ═══════════════
 * Подключается в oferta.html, privacy.html, terms.html, escrow.html,
 * safety.html, restricted.html, marking-help.html, about.html, support.html.
 *
 * Переменные и базовые правила совпадают с лендингом на index.html.
 */

*{box-sizing:border-box;margin:0;padding:0}

:root{
  --brand:#2D5BE3;--brand-d:#1A3DB5;--brand-l:#EEF3FF;
  --acc:#FF5C2B;--acc-l:#FFF0EB;
  --ok:#0FAB6E;--ok-l:#E6F9F2;
  --t1:#111318;--t2:#5C6070;--t3:#9EA3B0;
  --bg:#FFFFFF;--bg2:#F5F6FA;--bg3:#EDEEF3;
  --border:rgba(0,0,0,.08);--border2:rgba(0,0,0,.14);
  --r:14px;--rm:8px;
  --ff-head:'Unbounded',sans-serif;
  --ff:'Onest',sans-serif;
}

body{font-family:var(--ff);background:var(--bg);color:var(--t1);overflow-x:hidden;-webkit-font-smoothing:antialiased}

a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}

/* ═══════════════ Шапка ═══════════════ */
.spage-nav{
  position:sticky;top:0;z-index:50;
  padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(12px);
  border-bottom:0.5px solid var(--border);
}
@media(min-width:768px){.spage-nav{padding:14px 40px}}

.logo{display:flex;align-items:center;gap:8px;text-decoration:none;cursor:pointer}
.logo:hover{text-decoration:none}
.logo-mark{width:32px;height:32px;background:var(--brand);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-mark svg{width:20px;height:20px}
.logo-text{font-family:var(--ff-head);font-size:16px;font-weight:700;color:var(--t1);letter-spacing:-0.5px}
.logo-text span{color:var(--brand)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:9px 20px;border-radius:var(--rm);
  font-size:14px;font-weight:500;cursor:pointer;
  border:0.5px solid var(--border2);background:var(--bg);color:var(--t1);
  transition:all .15s;font-family:var(--ff);text-decoration:none;
}
.btn:hover{background:var(--bg2);text-decoration:none}
.btn-primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-d);color:#fff}
.btn-acc{background:var(--acc);border-color:var(--acc);color:#fff}
.btn-acc:hover{background:#e04820;border-color:#e04820;color:#fff}
.btn-sm{padding:6px 14px;font-size:13px}

/* ═══════════════ Контентная область юр.страницы ═══════════════ */
.spage-wrap{max-width:720px;margin:0 auto;padding:40px 24px 80px}
@media(min-width:768px){.spage-wrap{padding:56px 24px 80px}}

.spage-back{font-size:13px;color:var(--brand);cursor:pointer;margin-bottom:28px;display:inline-flex;align-items:center;gap:5px}
.spage-back:hover{text-decoration:underline}

.spage-h1{font-family:var(--ff-head);font-size:clamp(24px,4vw,36px);font-weight:700;letter-spacing:-0.6px;margin-bottom:8px;color:var(--t1)}
.spage-lead{font-size:16px;color:var(--t2);line-height:1.7;margin-bottom:36px}
.spage-h2{font-size:18px;font-weight:500;margin:28px 0 10px;color:var(--t1)}
.spage-p{font-size:14px;color:var(--t2);line-height:1.8;margin-bottom:14px}
.spage-ul{margin:0 0 16px 20px;display:flex;flex-direction:column;gap:6px}
.spage-ul li{font-size:14px;color:var(--t2);line-height:1.6}
.spage-box{background:var(--bg2);border-radius:var(--r);padding:20px 24px;margin:20px 0;border-left:3px solid var(--brand)}

/* ═══════════════ Поддержка ═══════════════ */
.support-tg-card{background:linear-gradient(135deg,#2AABEE,#229ED9);border-radius:16px;padding:28px;text-align:center;margin-top:20px}
.tg-icon{width:56px;height:56px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.support-tg-card h3{font-size:17px;font-weight:500;color:#fff;margin-bottom:6px}
.support-tg-card p{font-size:13px;color:rgba(255,255,255,.8);margin-bottom:16px;line-height:1.5}
.tg-btn{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#229ED9;border-radius:var(--rm);padding:10px 22px;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none;border:none;transition:all .15s}
.tg-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.15);text-decoration:none}

/* ═══════════════ FAQ-аккордеон ═══════════════ */
.faq-item{border-bottom:0.5px solid var(--border);padding:16px 0;cursor:pointer}
.faq-q{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:500;color:var(--t1)}
.faq-a{font-size:13px;color:var(--t2);line-height:1.7;margin-top:10px;display:none}
.faq-item.open .faq-a{display:block}
.faq-item.open .faq-arr{transform:rotate(180deg)}
.faq-arr{transition:transform .2s;font-size:14px;color:var(--t3);flex-shrink:0}

/* ═══════════════ Футер ═══════════════ */
.land-footer{padding:24px;border-top:0.5px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
@media(min-width:768px){.land-footer{padding:24px 40px}}
.land-footer-links{display:flex;gap:20px;flex-wrap:wrap}
.land-footer-links a{font-size:13px;color:var(--t3);text-decoration:none}
.land-footer-links a:hover{color:var(--t1);text-decoration:none}
.land-footer-copy{font-size:12px;color:var(--t3)}