/* =====================================================================
   ui2 f-uau: o Auto Updater (landing, documentacao, como atualizar).
   O grosso da landing ja vem do components.css (uhero, ustart, ufeat,
   umore, ulimits, shot); aqui fica so o que o mockup tinha em linha ou o
   que as duas paginas novas pedem. So tokens: nenhum hex novo.
   Movimento: transicao .2s ease e nada anima com movimento reduzido.
   ===================================================================== */

/* --------------------------------------------------------- pecas comuns */
.fu-logo { display: block; width: 100%; height: auto; }
.fu-logo-bg { fill: var(--btn-bg); }
.fu-logo-fg { stroke: var(--btn-fg); }
.fu-ok { width: 18px; height: 18px; color: var(--green); }
.fu-float--46 { width: 46%; }
.fu-float--28 { width: 28%; }
.fu-cta-wrap { padding-block: calc(var(--sec-y) * .7); }
.fu-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ladrilho de icone duotom (como os atalhos do topo), por cor de token */
.fu-tile { width: 46px; height: 46px; flex: none; display: grid; place-items: center; border-radius: var(--r-sm); background: var(--accent-soft); color: var(--accent); }
.fu-tile .i { width: 22px; height: 22px; }
.fu-tile--ok { background: var(--green-soft); color: var(--green); }
.fu-tile--warn { background: var(--amber-soft); color: var(--amber); }
.fu-tile--slate { background: var(--surface-3); color: var(--brand-slate); }

/* ================================================================ LANDING */
.uhero .crumbs { justify-content: center; }
.uhero .hero-cta .btn--ghost .i { width: 18px; height: 18px; }
.uhero .fu-hero-gratis { margin-top: 14px; }
.shot-mode { transition: background .2s ease, border-color .2s ease; }
.shot-mode:hover, .shot-mode[aria-pressed="true"] { border-color: var(--ink); }

/* cartao de download, logo abaixo dos tres passos */
.fu-dl { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 26px; align-items: center; margin-top: 22px; padding: 26px 28px; }
.fu-dl-logo { width: 76px; }
.fu-dl-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.fu-dl-top h3 { font-size: 1.15rem; margin-right: 4px; }
.fu-dl-meta { margin-top: 6px; font-size: var(--fs-xs); color: var(--muted); }
.fu-dl-meta a { color: var(--accent); font-weight: 600; }
.fu-dl-meta a:hover { text-decoration: underline; }
.fu-dl-txt { margin-top: 10px; font-size: var(--fs-sm); color: var(--text); max-width: 70ch; }
.fu-req { display: flex; flex-wrap: wrap; gap: 6px 8px; margin-top: 14px; }
.fu-req li { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--r-pill); background: var(--surface-2); border: 1px solid var(--line-soft); font-size: var(--fs-xs); color: var(--ink); }
.fu-req li .i { width: 13px; height: 13px; color: var(--green); }
.fu-sha { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 12px; font-size: var(--fs-xs); color: var(--muted); }
.fu-sha code { font: 600 11.5px/1.4 var(--font-mono); color: var(--ink); background: var(--surface-3); padding: 2px 8px; border-radius: 6px; overflow-wrap: anywhere; }
.fu-dl-acts { display: grid; justify-items: center; gap: 12px; }
.fu-dl-alt { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); font-weight: 600; color: var(--accent); }
.fu-dl-alt .i { width: 15px; height: 15px; }
.fu-dl-alt:hover { color: var(--accent-ink); }

/* limites + compatibilidade (o position segura dentro da rolagem o texto so para leitor de tela) */
.ulimits { position: relative; }
.ulimits td.mut { color: var(--muted); }
.ulimits td .fu-ok { display: inline-block; vertical-align: middle; }
.cmp-note a { color: var(--accent); font-weight: 600; }
.cmp-note a:hover { text-decoration: underline; }
.ucompat { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ucompat .chip { padding: 6px 13px; font-size: var(--fs-xs); }
.ucompat .chip .i { width: 14px; height: 14px; }
.ucompat .chip b { font-weight: 700; }

/* perguntas: o componente "FAQ por temas" (components.css + ui2/components/faq.php) */

/* ======================================================== DOCUMENTACAO */
.fu-band .hero-cta { margin-top: 22px; }
.fu-band .chip b { font-weight: 700; }
.fu-doc { padding-top: 40px; }
/* o corpo vem pronto de includes/uau-docs-v2.php (up_uaudoc_v2_corpo):
   aqui as classes dele ganham a pele nova */
.fu-doc .up-section { padding: 0 !important; }
.fu-doc .up-container { max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.fu-doc .up-doc { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 36px; align-items: start; }

/* indice lateral */
.fu-doc .up-doc__nav {
  position: sticky; top: 20px; max-height: calc(100vh - 40px); overflow-y: auto; overscroll-behavior: contain;
  padding: 14px 12px 16px; background: var(--surface); border: var(--bd); border-radius: var(--r-card); box-shadow: var(--sh-card);
}
.fu-doc .up-doc__nav h4 { margin: 16px 10px 6px; font: 700 10.5px/1.3 var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.fu-doc .up-doc__nav h4:first-child { margin-top: 4px; }
.fu-doc .up-doc__nav a {
  position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; padding: 7px 10px 7px 12px;
  border-radius: var(--r-sm); font-size: var(--fs-sm); line-height: 1.35; color: var(--text); transition: background .2s ease, color .2s ease;
}
.fu-doc .up-doc__nav a:hover { background: var(--surface-2); color: var(--ink); }
.fu-doc .up-doc__nav a.is-active { background: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
.fu-doc .up-doc__nav a.is-active::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: var(--coral); }
.fu-doc .doc-novo { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: var(--r-pill); background: var(--accent-soft); color: var(--accent-ink); font: 700 9.5px/1.6 var(--font-body); letter-spacing: .08em; text-transform: uppercase; vertical-align: middle; }
.fu-doc .up-doc__nav a.is-active .doc-novo { background: var(--surface); }
.fu-doc h2 .doc-novo { margin-left: 10px; font-size: 10.5px; padding: 2px 9px; }
.fu-nav-tg { display: none; }
.fu-busca { margin: 0 0 6px; }
.fu-busca-campo { position: relative; display: block; }
.fu-busca-campo > .i { position: absolute; left: 12px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; color: var(--muted); pointer-events: none; }
.fu-busca-campo input {
  width: 100%; height: 40px; padding: 0 36px 0 36px; font: inherit; font-size: var(--fs-sm); color: var(--ink);
  background: var(--surface-2); border: 1px solid var(--line-soft); border-radius: var(--r-sm); transition: border-color .2s ease, background .2s ease;
  -webkit-appearance: none; appearance: none;
}
.fu-busca-campo input::-webkit-search-cancel-button { display: none; }
.fu-busca-campo input::placeholder { color: var(--muted); }
.fu-busca-campo input:focus { outline: none; border-color: var(--accent); background: var(--surface); }
.fu-busca-x { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: var(--r-sm); background: none; color: var(--muted); cursor: pointer; }
.fu-busca-x:hover { background: var(--surface-3); color: var(--ink); }
.fu-busca-x .i { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.fu-busca-st:empty { display: none; }
.fu-busca-st { margin: 10px 10px 4px; font: 600 var(--fs-xs)/1.4 var(--font-body); color: var(--muted); }
.fu-busca-res { list-style: none; margin: 0; padding: 0; }
.fu-busca-res a { display: block; padding: 8px 10px; border-radius: var(--r-sm); color: var(--text); transition: background .2s ease; }
.fu-busca-res a:hover, .fu-busca-res a.is-sel { background: var(--surface-2); }
.fu-busca-res a.is-sel { box-shadow: inset 3px 0 0 var(--coral); }
.fu-busca-sec { display: block; font: 600 var(--fs-xs)/1.35 var(--font-body); color: var(--ink); }
.fu-busca-tx { display: block; margin-top: 2px; font-size: var(--fs-xs); line-height: 1.45; color: var(--text); }
.fu-busca-res mark, .fu-doc mark.fu-busca-mk { padding: 0 1px; border-radius: 3px; background: var(--amber-soft); color: var(--ink); }
.fu-doc .up-doc__nav.is-buscando > :not(.fu-busca):not(.fu-nav-tg) { display: none; }
.fu-doc .fu-busca-alvo { animation: fu-busca-pisca 1.6s ease; scroll-margin: 90px; }
/* a busca na faixa do alto (no lugar dos botoes): campo grande e a lista abrindo embaixo */
.fu-busca-slot { margin-top: 26px; max-width: 700px; }
/* a lista passa por cima do indice lateral (sticky) e do corpo, que vem depois */
.fu-band:has(.fu-busca--hero) { position: relative; z-index: 6; }
.fu-busca--hero { position: relative; margin: 0; }
.fu-busca--hero .fu-busca-campo > .i { left: 20px; width: 22px; height: 22px; color: var(--accent); }
.fu-busca--hero .fu-busca-campo input {
  height: 62px; padding: 0 56px 0 56px; font-size: 1.06rem; background: var(--surface); border: var(--bd); border-radius: var(--r-pill); box-shadow: var(--sh-card);
}
.fu-busca--hero .fu-busca-campo input:focus { border-color: var(--accent); box-shadow: var(--sh-pop); }
.fu-busca--hero .fu-busca-x { right: 12px; width: 36px; height: 36px; border-radius: var(--r-pill); }
.fu-busca--hero .fu-busca-x .i { width: 16px; height: 16px; }
.fu-busca--hero .fu-busca-pnl {
  display: none; position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 8px); padding: 8px;
  background: var(--surface); border: var(--bd); border-radius: var(--r-card); box-shadow: var(--sh-pop);
  max-height: min(62vh, 540px); overflow-y: auto; overscroll-behavior: contain;
}
.fu-busca--hero.is-buscando:not(.is-fechada) .fu-busca-pnl { display: block; }
.fu-busca--hero .fu-busca-st { margin: 6px 10px 6px; }
.fu-busca--hero .fu-busca-res a { padding: 10px 12px; }
.fu-busca--hero .fu-busca-sec { font-size: var(--fs-sm); }
.fu-busca--hero .fu-busca-tx { font-size: var(--fs-sm); }
@keyframes fu-busca-pisca { 0%, 35% { background-color: var(--amber-soft); } 100% { background-color: transparent; } }

/* o texto */
.fu-doc .up-doc__body {
  min-width: 0; padding: 40px 46px 46px; background: var(--surface); border: var(--bd); border-radius: var(--r-card); box-shadow: var(--sh-card);
  font-size: var(--fs-body); line-height: 1.72; color: var(--text);
}
.fu-doc .up-doc__body > h2 { scroll-margin-top: 20px; margin-top: 54px; padding-top: 38px; border-top: 1px solid var(--line-soft); font-size: clamp(1.45rem, 1.2rem + .8vw, 1.85rem); }
.fu-doc .up-doc__body > h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.fu-doc .up-doc__body h3 { font-size: 1.12rem; }
.fu-doc .up-doc__body > h3, .fu-doc .up-doc__sub { scroll-margin-top: 20px; margin-top: 32px !important; }
.fu-doc .up-doc__body p { margin-top: 14px; }
.fu-doc .up-doc__body strong { color: var(--ink); font-weight: 600; }
.fu-doc .up-doc__body a { color: var(--accent); font-weight: 600; text-decoration: underline; text-decoration-color: var(--accent-soft); text-decoration-thickness: 2px; text-underline-offset: 3px; transition: text-decoration-color .2s ease; }
.fu-doc .up-doc__body a:hover { text-decoration-color: currentColor; }
.fu-doc .up-code { display: inline; padding: 1px 7px; border-radius: 6px; background: var(--surface-3); color: var(--ink); font: 600 .84em/1.5 var(--font-mono); overflow-wrap: anywhere; box-decoration-break: clone; -webkit-box-decoration-break: clone; }

/* avisos */
.fu-doc .up-callout { position: relative; margin: 22px 0; padding: 16px 18px 16px 54px; border-radius: var(--r-thumb); background: var(--surface-2); border: 1px solid var(--line-soft); font-size: var(--fs-sm); line-height: 1.65; }
.fu-doc .up-callout::before {
  content: "i"; position: absolute; left: 16px; top: 15px; width: 24px; height: 24px; display: grid; place-items: center;
  border-radius: 50%; background: var(--brand-slate); color: var(--surface); font: 700 13px/1 var(--font-display);
}
.fu-doc .up-callout--ok { background: var(--green-soft); border-color: transparent; }
.fu-doc .up-callout--ok::before { content: "\2713"; background: var(--green); }
.fu-doc .up-callout--warn { background: var(--amber-soft); border-color: transparent; }
.fu-doc .up-callout--warn::before { content: "!"; background: var(--amber); }
.fu-doc .up-callout--info { background: var(--accent-soft); border-color: transparent; }
.fu-doc .up-callout--info::before { background: var(--accent); }

/* tabelas */
.fu-doc .up-compare {
  width: 100%; margin: 22px 0; border: var(--bd); border-radius: var(--r-thumb);
  border-collapse: separate; border-spacing: 0; font-size: var(--fs-sm); line-height: 1.55;
}
.fu-doc .up-compare thead th { padding: 11px 16px; background: var(--surface-2); border-bottom: 1px solid var(--line); text-align: left; font: 700 10.5px/1.3 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.fu-doc .up-compare tbody th { padding: 13px 16px; text-align: left; vertical-align: top; color: var(--ink); font-weight: 600; min-width: 150px; }
.fu-doc .up-compare td { padding: 13px 16px; vertical-align: top; color: var(--text); }
.fu-doc .up-compare tbody tr + tr > * { border-top: 1px solid var(--line-soft); }
.fu-doc .up-compare tbody tr:nth-child(even) > * { background: var(--bg); }

/* passos numerados */
.fu-doc .up-steps { list-style: none; margin: 18px 0 0; padding: 0; counter-reset: fu-st; display: grid; gap: 10px; }
.fu-doc .up-steps > li { position: relative; counter-increment: fu-st; padding: 15px 18px 15px 62px; border-radius: var(--r-thumb); background: var(--surface-2); border: 1px solid var(--line-soft); }
.fu-doc .up-steps > li::before {
  content: counter(fu-st); position: absolute; left: 18px; top: 14px; width: 28px; height: 28px; display: grid; place-items: center;
  border-radius: 50%; background: var(--btn-bg); color: var(--btn-fg); font: 700 13px/1 var(--font-display);
}
.fu-doc .up-steps > li h3 { margin: 0; font-size: 1rem; }
.fu-doc .up-steps > li p { margin-top: 4px; font-size: var(--fs-sm); }

/* listas */
.fu-doc .up-list { margin-top: 14px; display: grid; gap: 8px; }
.fu-doc .up-list li { position: relative; padding-left: 22px; }
.fu-doc .up-list li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--coral); }

/* abas (Automatica / Manual) */
.fu-doc .up-tabs { display: inline-flex; gap: 4px; margin: 22px 0 4px; padding: 4px; border-radius: var(--r-pill); background: var(--surface-3); }
.fu-doc .up-tabs button { border: 0; background: none; cursor: pointer; padding: 8px 18px; border-radius: var(--r-pill); font-weight: 600; font-size: var(--fs-sm); color: var(--text); transition: background .2s ease, color .2s ease, box-shadow .2s ease; }
.fu-doc .up-tabs button:hover { color: var(--ink); }
.fu-doc .up-tabs button.is-active { background: var(--surface); color: var(--ink); box-shadow: var(--sh-card); }

/* perguntas (solucao de problemas). .up-acc tambem e a classe da conta no
   cabecalho (inline-flex, grid-area): aqui ela volta a ser bloco */
.fu-doc .up-acc { display: block; gap: 0; font-size: inherit; grid-area: auto; justify-self: auto; align-items: stretch; }
.fu-doc .up-acc { margin-top: 10px; border: var(--bd); border-radius: var(--r-thumb); background: var(--surface); transition: box-shadow .2s ease; }
.fu-doc .up-acc[open] { box-shadow: var(--sh-card); }
.fu-doc .up-acc summary { list-style: none; position: relative; cursor: pointer; padding: 14px 48px 14px 18px; font-weight: 600; color: var(--ink); font-size: var(--fs-sm); }
.fu-doc .up-acc summary::-webkit-details-marker { display: none; }
.fu-doc .up-acc summary::after { content: "+"; position: absolute; right: 16px; top: 50%; width: 24px; height: 24px; margin-top: -12px; display: grid; place-items: center; border-radius: 50%; background: var(--surface-3); color: var(--accent); font: 700 16px/1 var(--font-display); transition: transform .2s ease; }
.fu-doc .up-acc[open] summary::after { transform: rotate(45deg); }
.fu-doc .up-acc__body { padding: 0 18px 16px; font-size: var(--fs-sm); color: var(--text); }

/* prints: moldura de janela, como o .shot da landing */
.fu-doc .doc-shot { margin: 26px 0 30px; }
.fu-doc .doc-shot__link { display: block; border-radius: var(--r-thumb); overflow: hidden; border: var(--bd); background: var(--surface-2); box-shadow: var(--sh-card); transition: box-shadow .2s ease, transform .2s ease; text-decoration: none; }
.fu-doc .doc-shot__link::before {
  content: ""; display: block; height: 26px; border-bottom: 1px solid var(--line-soft); background-color: var(--surface-2);
  background-image: radial-gradient(circle, var(--line) 4px, transparent 4.5px), radial-gradient(circle, var(--line) 4px, transparent 4.5px), radial-gradient(circle, var(--line) 4px, transparent 4.5px);
  background-size: 14px 26px; background-repeat: no-repeat; background-position: 10px 0, 26px 0, 42px 0;
}
.fu-doc .doc-shot__link:hover { box-shadow: var(--sh-hover); }
.fu-doc .doc-shot img { display: block; width: 100%; height: auto; }
.fu-doc .doc-shot figcaption { margin-top: 10px; font-size: var(--fs-xs); line-height: 1.55; color: var(--muted); }
.fu-doc .doc-shot--estreito { max-width: 460px; }
.fu-doc .doc-shots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: start; margin: 24px 0 30px; }
.fu-doc .doc-shots .doc-shot { margin: 0; max-width: none; }

/* ====================================================== COMO ATUALIZAR */
.fu-ways { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 32px; }
.fu-way { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 26px 24px 24px; }
.fu-way h3 { font-size: 1.12rem; }
.fu-way > p { font-size: var(--fs-sm); color: var(--text); }
.fu-way-list { display: grid; gap: 8px; margin-top: 2px; }
.fu-way-list li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; font-size: var(--fs-sm); color: var(--ink); }
.fu-way-list .i { width: 16px; height: 16px; margin-top: 3px; color: var(--green); }
.fu-way-list .is-nota .i { color: var(--muted); }
.fu-way-list .is-nota { color: var(--text); }
.fu-way .btn { margin-top: auto; align-self: flex-start; }
.fu-way-flag { position: absolute; top: 22px; right: 22px; }
.fu-way--feat { background: var(--grad-brand); border-color: transparent; color: var(--on-dark-mut); }
.fu-way--feat h3, .fu-way--feat .fu-way-list li { color: var(--on-dark); }
.fu-way--feat > p { color: rgba(255,255,255,.82); }
.fu-way--feat .fu-way-list .i { color: var(--on-dark); }
.fu-way--feat .fu-tile { background: rgba(255,255,255,.16); color: var(--on-dark); }
.fu-way--feat .btn--primary { background: var(--surface); color: var(--accent); box-shadow: none; }
.fu-way--feat .btn--primary:hover { background: var(--accent-soft); }
.fu-way--feat .fu-way-flag .pill { background: var(--btn-bg); color: var(--on-dark); } /* o degrade ia ao coral claro: branco a 2,84:1 */

/* passos das secoes manuais */
.fu-steps { list-style: none; margin: 18px 0 0; padding: 0; counter-reset: fu-st; display: grid; gap: 10px; }
.fu-steps > li { position: relative; counter-increment: fu-st; padding: 13px 16px 13px 56px; border-radius: var(--r-thumb); background: var(--surface-2); border: 1px solid var(--line-soft); font-size: var(--fs-sm); color: var(--text); }
.fu-steps > li::before {
  content: counter(fu-st); position: absolute; left: 16px; top: 12px; width: 26px; height: 26px; display: grid; place-items: center;
  border-radius: 50%; background: var(--btn-bg); color: var(--btn-fg); font: 700 12.5px/1 var(--font-display);
}
.sec--alt .fu-steps > li { background: var(--surface); }
.fu-steps b { color: var(--ink); font-weight: 600; }
.fu-steps code, .fu-note code, .ustep code { font: 600 .84em/1.5 var(--font-mono); color: var(--ink); background: var(--surface-3); padding: 1px 6px; border-radius: 5px; overflow-wrap: anywhere; }
.ustep a, .fu-steps a { color: var(--accent); font-weight: 600; }
.ustep a:hover, .fu-steps a:hover { text-decoration: underline; }

.fu-man { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 30px; }
.fu-man .card-hd h3 .fu-tile { width: 36px; height: 36px; }
.fu-man .card-hd h3 .fu-tile .i { width: 18px; height: 18px; }
.fu-man .fu-steps { margin: 0; padding: 18px 20px 22px; }
.fu-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 20px; }
.fu-note { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start; padding: 16px 18px; border-radius: var(--r-thumb); font-size: var(--fs-sm); color: var(--text); background: var(--amber-soft); }
.fu-note b { color: var(--ink); }
.fu-note .fu-tile { width: 40px; height: 40px; background: var(--surface); color: var(--amber); }
.fu-note--info { background: var(--accent-soft); }
.fu-note--info .fu-tile { color: var(--accent); }

.fu-ftp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.fu-path { padding: 22px 24px; background: var(--plum); color: var(--on-dark-mut); border-radius: var(--r-card); box-shadow: var(--sh-pop); font: 500 13px/1.6 var(--font-mono); overflow-wrap: anywhere; }
.fu-path h3 { font: 700 11px/1.3 var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--on-dark-mut); }
.fu-path-row { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--plum-line); }
.fu-path-row:first-of-type { border-top: 0; padding-top: 0; }
.fu-path-row code { display: block; color: var(--on-dark); font: inherit; }
.fu-path-row code i { font-style: normal; color: var(--coral); }
.fu-path-row small { display: block; margin-top: 4px; font: 400 12px/1.5 var(--font-body); color: var(--on-dark-mut); }

.fu-back { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 30px; }
.fu-back .card-pad { display: flex; flex-direction: column; gap: 12px; }
.fu-back .card-pad > .flex { align-items: center; gap: 14px; }
.fu-back h3 { font-size: 1.08rem; }
.fu-back p { font-size: var(--fs-sm); color: var(--text); }
.fu-back p b { color: var(--ink); }
.fu-back .bars { margin: 4px 0 0; }
.fu-back .bar { grid-template-columns: 120px 1fr 92px; font-size: 12.5px; }
.fu-link { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; font-size: var(--fs-sm); font-weight: 600; color: var(--accent); }
.fu-link .i { width: 15px; height: 15px; }
.fu-link:hover { color: var(--accent-ink); }

/* ============================================================ RESPONSIVO */
@media (max-width: 1100px) {
  .fu-doc .up-doc { grid-template-columns: 230px minmax(0, 1fr); gap: 24px; }
  .fu-doc .up-doc__body { padding: 34px 32px 38px; }
}
@media (max-width: 980px) {
  .fu-dl { grid-template-columns: 64px minmax(0, 1fr); }
  .fu-dl-logo { width: 64px; align-self: start; }
  .fu-dl-acts { grid-column: 1 / -1; justify-items: start; grid-auto-flow: column; align-items: center; justify-content: start; gap: 18px; }
  .fu-ways, .fu-man, .fu-back, .fu-ftp { grid-template-columns: minmax(0, 1fr); }
  .fu-ways { max-width: 620px; margin-inline: auto; }
  .fu-ftp { gap: 28px; }

  /* indice vira um bloco recolhivel no alto */
  .fu-doc .up-doc { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .fu-doc .up-doc__nav { position: static; max-height: none; overflow: visible; }
  .fu-nav-tg {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 6px 8px 6px 10px;
    border: 0; background: none; cursor: pointer; font: 700 var(--fs-sm)/1.3 var(--font-display); color: var(--ink);
  }
  .fu-nav-tg .i { width: 18px; height: 18px; color: var(--accent); transition: transform .2s ease; }
  .fu-doc .up-doc__nav.is-open .fu-nav-tg .i { transform: rotate(180deg); }
  .fu-doc .up-doc__nav.is-closed > :not(.fu-nav-tg):not(.fu-busca) { display: none; }
  .fu-doc .up-doc__nav.is-buscando .fu-nav-tg { display: none; }
  .fu-doc .up-doc__nav.is-open .fu-nav-tg { margin-bottom: 6px; }
}
@media (max-width: 640px) {
  .fu-dl { grid-template-columns: minmax(0, 1fr); padding: 22px 20px; gap: 16px; }
  .fu-dl-logo { width: 54px; }
  .fu-dl-acts { grid-auto-flow: row; justify-items: stretch; }
  .fu-dl-acts .btn { width: 100%; }
  .fu-notes { grid-template-columns: minmax(0, 1fr); }
  /* limites: no celular cada recurso vira um bloco, com uma linha por plano */
  .ulimits table { min-width: 0; }
  .ulimits thead { display: none; }
  .ulimits tbody tr { display: block; padding-bottom: 8px; border-bottom: 1px solid var(--line-soft); }
  .ulimits tbody tr:last-child { border-bottom: 0; }
  .ulimits tbody th { display: block; border: 0; padding: 14px 16px 6px; }
  .ulimits td { display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 0; padding: 6px 16px; text-align: right; }
  .ulimits td[colspan] { display: block; padding-top: 0; text-align: left; color: var(--text); }
  .ulimits td::before { content: attr(data-label); font: 600 var(--fs-xs)/1.3 var(--font-body); color: var(--muted); text-align: left; }
  .ulimits td[colspan]::before { content: none; }
  .uhero h1 { font-size: clamp(2.05rem, 1.2rem + 4.6vw, 2.5rem); }
  .uhero-chips { gap: 8px 16px; }

  .fu-doc { padding-top: 24px; }
  .fu-doc .up-doc__body { padding: 24px 18px 28px; border-radius: var(--r-thumb); }
  .fu-doc .up-doc__body > h2 { margin-top: 40px; padding-top: 30px; }
  .fu-doc .up-callout { padding: 14px 14px 14px 46px; }
  .fu-doc .up-callout::before { left: 12px; top: 13px; width: 22px; height: 22px; font-size: 12px; }
  .fu-doc .up-steps > li { padding: 13px 14px 13px 52px; }
  .fu-doc .up-steps > li::before { left: 14px; }
  .fu-doc .up-compare { display: block; overflow-x: auto; }
  .fu-doc .up-compare thead th, .fu-doc .up-compare tbody th, .fu-doc .up-compare td { padding: 10px 12px; }
  .fu-doc .up-compare tbody th { min-width: 110px; }
  .fu-doc .doc-shots { grid-template-columns: minmax(0, 1fr); }
  .fu-doc .up-tabs { display: flex; }
  .fu-doc .up-tabs button { flex: 1; padding-inline: 10px; }

  .fu-steps > li { padding: 12px 14px 12px 50px; }
  .fu-steps > li::before { left: 13px; }
  .fu-back .bar { grid-template-columns: 96px 1fr 80px; }
  .fu-path { padding: 18px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .fu-doc .doc-shot__link, .fu-doc .up-acc summary::after, .fu-nav-tg .i, .shot-mode { transition: none; }
  .fu-doc .fu-busca-alvo { animation: none; }
}
