/* VaultPay | refinamentos de interface (2026-10-18)
   Esta folha é carregada POR ÚLTIMO nas páginas públicas para manter os estilos coerentes. */
:root { --footer-bg:#080c12; --footer-ink:#f5f7fb; --footer-muted:#aab6c6; --footer-line:#202a38; }
:root[data-theme="light"] { --footer-bg:#fff; --footer-ink:#111827; --footer-muted:#596579; --footer-line:#e1e6ef; }
*,*::before,*::after { box-sizing:border-box; }
html,body { max-width:100%; }
img,svg,video { max-width:100%; }
:where(a,button,input,select,textarea):focus-visible { outline:2px solid var(--blue,#0080ff); outline-offset:3px; }

/* Compact footer without photographic banner. The wallet icon remains with the wordmark. */
.site-footer, .site-footer:not(.docs-footer),
:root[data-theme="light"] .site-footer, :root[data-theme="light"] .site-footer:not(.docs-footer) {
  position:relative!important; isolation:isolate!important; overflow:hidden!important;
  margin-top:32px!important; padding:30px 22px 22px!important;
  background:var(--footer-bg)!important; background-image:none!important;
  background-position:initial!important; border-top:1px solid var(--footer-line)!important;
  box-shadow:none!important; color:var(--footer-ink)!important;
}
.site-footer::before, .site-footer:not(.docs-footer)::before,
:root[data-theme="light"] .site-footer::before, :root[data-theme="light"] .site-footer:not(.docs-footer)::before {
  display:none!important; content:none!important; background:none!important;
}
.site-footer .site-footer-inner, .site-footer:not(.docs-footer) .site-footer-inner {
  display:grid!important; grid-template-columns:minmax(240px,1.6fr) repeat(2,minmax(115px,1fr))!important;
  gap:24px!important; align-items:start!important; margin:0 auto!important;
  max-width:1100px!important;
}
.site-footer .footer-brand-block { gap:8px; min-width:0; }
.site-footer .footer-brand { display:inline-flex; align-items:center; gap:9px; width:max-content;
  color:var(--footer-ink)!important; font-size:20px; font-weight:800; letter-spacing:-.045em; text-shadow:none!important; }
.site-footer .footer-brand img { width:34px; height:34px; object-fit:contain; }
.site-footer .footer-brand-block p, :root[data-theme="light"] .site-footer .footer-brand-block p {
  max-width:310px; margin:0; color:var(--footer-muted)!important; font-size:12px; line-height:1.6; text-shadow:none!important;
}
.site-footer .footer-col { gap:5px; }
.site-footer .footer-col h3 { margin:0 0 7px; color:var(--footer-ink)!important; font-size:12px; text-shadow:none!important; }
.site-footer .footer-col a,.site-footer:not(.docs-footer) .footer-col a,
:root[data-theme="light"] .site-footer:not(.docs-footer) .footer-col a {
  min-height:26px; font-size:12px; color:var(--footer-muted)!important;
  text-decoration:none; text-shadow:none!important; transform:none;
}
.site-footer .footer-col a:hover, .site-footer:not(.docs-footer) .footer-col a:hover,
:root[data-theme="light"] .site-footer .footer-col a:hover {
  color:var(--footer-ink)!important; text-decoration:underline; text-underline-offset:3px; transform:none;
}
.site-footer .footer-col a img { width:17px; height:17px; }
.site-footer.docs-footer, :root[data-theme="light"] .site-footer.docs-footer { margin-top:25px!important; padding:17px 18px!important; }
.site-footer.docs-footer .site-footer-inner { display:flex!important; justify-content:center!important; gap:8px!important; }
.site-footer.docs-footer .footer-brand { font-size:14px; }
.site-footer.docs-footer .footer-brand img { width:24px; height:24px; }

/* Same understated active/hover style in both desktop and mobile navigation. */
:root[data-theme="light"] .site-nav-links>a:hover,
:root[data-theme="light"] .site-nav-links>a[aria-current="page"] {
  color:#111827!important; background:rgba(15,23,42,.075)!important;
}
:root[data-theme="light"] .pv-menu-link:hover,
:root[data-theme="light"] .pv-menu-link[aria-current="page"] { background:rgba(15,23,42,.075)!important; color:#111827!important; }

/* Home - equal, legible metrics with a clear rhythm on smaller screens. */
.hero .stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; max-width:790px; margin:46px auto 0; }
.hero .stats>div { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0;
  min-height:99px; padding:16px 12px; border:1px solid var(--border); border-radius:16px;
  background:var(--surface); box-shadow:0 5px 20px rgba(0,0,0,.035); text-align:center; }
.hero .stats>div+div { border-left:1px solid var(--border); }
.hero .stats strong { font-size:clamp(20px,2.7vw,27px); line-height:1.15; letter-spacing:-.035em; }
.hero .stats span { margin-top:7px; font-size:12px; line-height:1.4; overflow-wrap:anywhere; }

/* Show the active dashboard preview for the selected site theme. */
.dashboard-preview-frame .dashboard-preview-light { display:none; }
.dashboard-preview-frame .dashboard-preview-dark { display:block; }
:root[data-theme="light"] .dashboard-preview-frame .dashboard-preview-dark { display:none; }
:root[data-theme="light"] .dashboard-preview-frame .dashboard-preview-light { display:block; }

/* White surfaces in light mode (blue text on pale-blue cards had poor contrast). */
:root[data-theme="light"] #como-funciona .feats li,
:root[data-theme="light"] #como-funciona .feats li:hover {
  background:#fff!important; border-color:var(--border,#dce2eb)!important;
  box-shadow:0 6px 18px rgba(20,35,55,.045); transform:none;
}
:root[data-theme="light"] #como-funciona .feats li b { color:#101828!important; }
:root[data-theme="light"] #como-funciona .feats li span { color:#596579!important; }

/* FAQ: use native details/summary, with no competing JS height animations. */
.faq details { overflow:hidden!important; interpolate-size:initial!important; }
.faq details .faq-answer,.faq details[open] .faq-answer,
.faq details:not([open]) .faq-answer {
  display:block!important; height:auto!important; max-height:none!important; block-size:auto!important;
  overflow:visible!important; opacity:1!important; padding:0 0 16px!important;
  visibility:visible!important; content-visibility:visible!important; transition:none!important;
}
.faq details:not([open]) .faq-answer { display:none!important; }
.faq details summary { cursor:pointer; }

/* Docs: contrast restored regardless of the multiple older component overrides. */
:root[data-theme="light"] .copypage,
:root[data-theme="light"] .pg-head .copypage {
  background:#fff!important; color:#172033!important; border-color:#cdd5e1!important;
  box-shadow:0 2px 8px rgba(24,39,65,.035)!important;
}
:root[data-theme="light"] .copypage svg { stroke:#172033!important; }
:root[data-theme="light"] .copypage:hover { background:#f2f4f7!important; color:#101828!important; border-color:#aeb9c8!important; }
:root[data-theme="light"] .copypage.done { color:#187247!important; border-color:#8ecaa8!important; }
:root[data-theme="light"] .sb a:hover,
:root[data-theme="light"] .pal-list li.sel a,
:root[data-theme="light"] .pal-list li a:hover,
:root[data-theme="light"] .tab:hover,
:root[data-theme="light"] .tab.on { background:#edf0f4!important; color:#172033!important; border-color:transparent!important; }
:root[data-theme="light"] .sb a.on { background:#e8ebef!important; color:#172033!important; box-shadow:inset 2px 0 0 #526174!important; }
:root[data-theme="light"] .sb a.on svg { color:#526174!important; }

@media(max-width:900px) {
  .site-footer .site-footer-inner,.site-footer:not(.docs-footer) .site-footer-inner {
    grid-template-columns:minmax(180px,1.3fr) repeat(2,minmax(110px,1fr))!important; gap:18px!important;
  }
  .site-footer .footer-brand-block { grid-column:auto; }
}
@media(max-width:700px) {
  /* Desktop-like navigation always visible in a compact second row; no dropdown. */
  .site-header { padding:8px 10px!important; }
  .site-header-inner { display:grid!important; grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto; gap:6px 10px!important; padding:8px 11px!important;
    min-height:unset!important; border-radius:16px!important; }
  .site-brand { grid-column:1; grid-row:1; min-width:0; font-size:15px; }
  .site-nav-actions { grid-column:2; grid-row:1; min-width:0; }
  .site-header .nav-menu-toggle { display:none!important; }
  .site-header .site-nav-links,.site-header.scrolled .site-nav-links {
    position:static!important; grid-column:1/-1; grid-row:2; display:flex!important;
    flex-direction:row!important; align-items:center!important; justify-content:space-between!important;
    width:100%!important; height:auto!important; min-width:0!important; max-height:none!important;
    gap:1px!important; padding:2px!important; margin:0!important;
    border:1px solid var(--border)!important; border-radius:11px!important;
    background:var(--bg)!important; box-shadow:none!important; backdrop-filter:none!important;
    overflow-x:auto; scrollbar-width:none;
  }
  .site-nav-links::-webkit-scrollbar { display:none; }
  .site-header .site-nav-links>a { display:inline-flex!important; align-items:center; justify-content:center;
    flex:1 0 auto; min-height:33px; padding:7px 7px!important; margin:0!important;
    border-radius:8px!important; font-size:clamp(10px,2.9vw,12px)!important; font-weight:600; white-space:nowrap; }
  .site-header .site-nav-links>a::after { display:none!important; content:none!important; }
  .site-header .site-nav-links>a[aria-current="page"] { background:rgba(255,255,255,.08)!important; }
  :root[data-theme="light"] .site-header .site-nav-links>a[aria-current="page"] { background:rgba(15,23,42,.09)!important; color:#111827!important; }
  :root[data-theme="light"] .site-header .site-nav-links>a:hover { background:rgba(15,23,42,.065)!important; }
  .site-footer,.site-footer:not(.docs-footer),:root[data-theme="light"] .site-footer:not(.docs-footer) {
    margin-top:25px!important; padding:25px 18px 21px!important;
  }
  .site-footer .site-footer-inner,.site-footer:not(.docs-footer) .site-footer-inner {
    grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:17px 18px!important;
  }
  .site-footer .footer-brand-block { grid-column:1/-1; }
  .site-footer .footer-brand { font-size:19px; }
  .site-footer .footer-brand-block p { max-width:370px; }
  .site-footer .footer-col { gap:3px; }
  .site-footer.docs-footer .site-footer-inner { display:flex!important; }
  .hero .stats { gap:9px; margin:30px auto 0; }
  .hero .stats>div { min-height:100px; padding:12px 7px; border-radius:13px; }
  .hero .stats strong { font-size:clamp(18px,5.7vw,24px); }
  .hero .stats span { font-size:11px; line-height:1.35; }
  .hero .wrap,.showcase,.showcase-text,.dashboard-preview-frame { min-width:0; }
  .showcase { gap:14px; }
  .showcase-text h2 { overflow-wrap:anywhere; }
  .feats li { min-width:0; }
  .feats li>div { min-width:0; }
  /* Registration: remove large empty header gap above Discord-connected message. */
  body.onboarding main { padding-top:12px!important; }
  body.onboarding .registration-section { align-items:start!important; gap:15px!important; margin:0 auto 26px!important; }
  body.onboarding .registration-intro .eyebrow,
  body.onboarding .registration-intro #registrationTitle { display:none!important; }
  body.onboarding .registration-intro>p { margin:0!important; max-width:none; font-size:14px; line-height:1.6; }
  body.onboarding .registration-intro .intro-note { margin:13px 0!important; }
  body.onboarding .registration-panel { margin-top:0!important; }
}
@media(max-width:370px) {
  .site-header .site-nav-links>a { padding-inline:4px!important; font-size:10.5px!important; }
  .site-nav-actions { gap:4px!important; }
  .site-login.btn-primary { padding:7px 10px!important; }
  .hero .stats>div { min-height:109px; padding:10px 5px; }
}

/* Mobile docs: full-width labelled search (instead of isolated magnifying glass).
   Keep the whole header within the viewport while its index/FAQ stay below. */
@media(max-width:860px) {
  :root { --top:111px; --tabs:43px; }
  .dh { height:calc(var(--top) + var(--tabs))!important; }
  .dh-top { display:block!important; height:var(--top)!important; padding:8px 10px 0!important; }
  .dh-top-inner,.dh.scrolled .dh-top-inner { display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important; grid-template-rows:40px 39px!important;
    align-items:center!important; gap:5px 8px!important; height:96px!important; min-height:96px!important;
    padding:7px 10px!important; margin:0!important; max-width:none!important;
    border-radius:15px!important; transform:none!important; }
  .dh-brand { grid-row:1; grid-column:1; justify-self:start; white-space:nowrap; }
  .dh-actions { grid-row:1; grid-column:2; justify-self:end; min-width:0; }
  .dh .dh-search,.dh.scrolled .dh-search,.dh-search { grid-column:1/-1!important; grid-row:2!important;
    width:100%!important; max-width:none!important; min-width:0!important; height:36px!important;
    padding:0 12px!important; justify-self:stretch!important; align-items:center!important;
    gap:9px!important; overflow:hidden!important; font-size:12px!important;
    position:static!important; transform:none!important; background:var(--surface2)!important; border-color:var(--border)!important; }
  .dh .dh-search span,.dh-search span { display:inline!important; font-size:12px!important; white-space:nowrap!important;
    overflow:hidden; text-overflow:ellipsis; min-width:0; }
  .dh-search svg { flex:0 0 16px; width:16px!important; height:16px!important; }
  .dh-search kbd { display:none!important; }
  .dh-tabs { position:relative!important; height:var(--tabs)!important; min-height:var(--tabs)!important;
    margin:0!important; padding:4px 10px!important; justify-content:center!important; background:var(--bg)!important; }
  .dh .dh-burger { display:grid!important; }
  .dh-actions .theme-toggle { width:32px!important; height:32px!important; }
  .dh-actions .site-login { padding:7px 10px!important; font-size:11px!important; }
  .shell { padding-top:calc(var(--top) + var(--tabs))!important; }
  .sb-wrap,.sb-wrap.open { top:calc(var(--top) + var(--tabs))!important; height:calc(100dvh - var(--top) - var(--tabs))!important; }
  .content { padding:22px 17px 4px!important; overflow-wrap:anywhere; }
  .pg-grid,.pg.ep .pg-grid { grid-template-columns:minmax(0,1fr)!important; gap:15px!important; }
  .pg-head { flex-wrap:wrap; gap:12px!important; }
  .pg-head h1 { font-size:clamp(26px,7.4vw,34px)!important; }
  .pg-head .copypage { max-width:100%; font-size:12px; }
  .pg-body pre { max-width:100%; }
  .code,.panel,.tbl { max-width:100%; min-width:0; }
  .tbl { overflow-x:auto; }
  .pal { padding:12vh 10px 16px; }
  .pal-box { width:min(620px,100%); }
  .pal-list a { min-width:0; }
  .pal-list small { max-width:40%; text-align:right; }
  .site-footer.docs-footer { margin-inline:-17px!important; }
  :root[data-theme="light"] .dh .dh-search { background:#f5f7fa!important; color:#465366!important; border-color:#dce2eb!important; }
  :root[data-theme="light"] .tab.on { background:#e8ebef!important; color:#172033!important; }
  :root[data-theme="light"] .tab:hover { background:#f0f2f5!important; }
}
@media(max-width:370px) {
  .dh-brand { font-size:13px; }
  .dh-brand b { font-size:13px; }
  .dh-actions { gap:4px!important; }
  .dh-actions .site-login { padding:6px 8px!important; }
  .dh-actions .dh-burger,.dh-actions .theme-toggle { width:30px!important; height:30px!important; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }
/* Small-screen overflow and menu visibility checks (320px through tablet). */
@media(max-width:700px){
  .site-header .site-nav-links,.site-header.scrolled .site-nav-links,
  .site-header .site-nav-links.is-open { visibility:visible!important; opacity:1!important;
    pointer-events:auto!important; transform:none!important; }
  #como-funciona .phone-stage { overflow-x:clip; }
}
@media(max-width:860px){
  .site-footer.docs-footer { margin-left:0!important; margin-right:0!important; }
}