/* VertixaTrade — Help Center layout. Pairs with /legal/legal.css (tokens, header, footer, .legal-content typography). */
.help-shell { max-width: 1080px; margin: 0 auto; padding: 34px 22px 90px; display: grid; grid-template-columns: 246px 1fr; gap: 42px; align-items: start; }
.help-side { position: sticky; top: 74px; }
.help-side h4 { margin: 0 0 10px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted2); font-weight: 800; }
.help-nav { display: flex; flex-direction: column; gap: 2px; }
.help-nav a { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; color: var(--body); font-weight: 600; font-size: 14px; }
.help-nav a:hover { background: rgba(255,255,255,.05); text-decoration: none; color: #fff; }
.help-nav a.is-active { background: rgba(42,148,243,.14); color: #fff; box-shadow: inset 0 0 0 1px rgba(42,148,243,.28); }
.help-nav a .ic { width: 18px; text-align: center; flex: none; opacity: .95; }

.help-main { min-width: 0; }
.help-main .legal-head h1 { font-size: 28px; }
.help-main .legal-content section:first-child { border-top: 0; padding-top: 6px; }

/* trust chips */
.trust-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(212px, 1fr)); gap: 12px; margin: 20px 0 8px; }
.trust-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px; }
.trust-card .tc-ic { font-size: 20px; line-height: 1; }
.trust-card h3 { margin: 9px 0 5px; font-size: 15px; color: #fff; font-weight: 800; }
.trust-card p { margin: 0; font-size: 13.5px; color: var(--muted); line-height: 1.6; }

/* topic cards (hub) */
.help-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); gap: 14px; margin-top: 22px; }
a.hcard { display:block; background: var(--card); border:1px solid var(--line); border-radius:14px; padding:18px; color:var(--body); transition:.15s; }
a.hcard:hover { border-color: rgba(42,148,243,.42); text-decoration:none; transform: translateY(-2px); }
a.hcard .hc-ic { font-size:22px; }
a.hcard h3 { margin:8px 0 6px; color:#fff; font-size:16px; font-weight:800; }
a.hcard p { margin:0; color:var(--muted); font-size:13.5px; line-height:1.55; }

/* FAQ accordions */
.faq-q { border:1px solid var(--line); border-radius:12px; margin:0 0 10px; background: var(--card); overflow:hidden; }
.faq-q summary { cursor:pointer; padding:15px 18px; font-weight:700; color:#fff; list-style:none; font-size:15px; position:relative; }
.faq-q summary::-webkit-details-marker { display:none; }
.faq-q summary::after { content:'+'; position:absolute; right:18px; top:13px; color:var(--muted); font-weight:700; font-size:19px; }
.faq-q[open] summary::after { content:'\2013'; }
.faq-q[open] summary { border-bottom:1px solid var(--line2); }
.faq-q .faq-a { padding:14px 18px; color:var(--body); font-size:14.5px; line-height:1.7; }
.faq-q .faq-a p:last-child { margin-bottom:0; }

.pill18 { display:inline-block; border:1.5px solid #ff6b6b; color:#ff6b6b; font-weight:800; border-radius:999px; padding:1px 9px; font-size:13px; vertical-align:middle; }
.help-help { margin-top:28px; padding:16px 18px; border:1px dashed var(--line); border-radius:12px; color:var(--muted); font-size:13.5px; }
.help-help a { font-weight:700; }
.rg-logos { display:flex; flex-wrap:wrap; gap:12px 20px; align-items:center; margin:14px 0 4px; }
.rg-logos a { color:var(--body); font-weight:700; font-size:13.5px; border:1px solid var(--line); border-radius:10px; padding:8px 13px; }
.rg-logos a:hover { border-color: rgba(42,148,243,.4); text-decoration:none; }

@media (max-width: 820px) {
  .help-shell { grid-template-columns: 1fr; gap: 18px; padding-top: 20px; }
  .help-side { position: static; }
  .help-side h4 { display:none; }
  .help-nav { flex-direction: row; overflow-x: auto; gap: 8px; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
  .help-nav a { white-space: nowrap; padding: 8px 13px; }
}