/* Portal de desenvolvedor da MINT API.
   Origem: ../261011_Substituicao_Wix/site/css/home.css (site da XCORP, home v2): @font-face da Figtree, tokens
   (--carvao, --cartao, --amarelo, cinzas, --filete, --terra, --topo, --suave, --corte, --pad, --hd), .skip, .sr-only,
   foco, cabeçalho fixo (.site-header, .hd-in, .hd-logo), botão de menu A3 (.hd-menu .mb3), botões C2 (.btn-p, .btn-s),
   olho (.olho), ícone +/− do FAQ (.fq-i), filetes de lista (.way), rodapé (.ft). Sem Merriweather: títulos em Figtree.
   O tema claro é derivado (o site é só escuro); o cabeçalho fica carvão nos dois, como a marca. */

@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 400 600; font-display: swap; src: url(fontes/figtree-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 400 600; font-display: swap; src: url(fontes/figtree-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* JetBrains Mono (OFL 1.1), de @fontsource-variable/jetbrains-mono 5.2.8; licenças em fontes/OFL-*.txt */
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 800; font-display: swap; src: url(fontes/jetbrains-mono-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 800; font-display: swap; src: url(fontes/jetbrains-mono-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* marca (home.css) */
  --carvao: #2A2A2A;
  --cartao: #1F1F1F;
  --faq: #232323;
  --amarelo: #F6BC00;
  --amarelo-claro: #FFD24D;
  --branco: #FFFFFF;
  --cinza-1: #E6E6E6;
  --cinza-2: #CFCFCF;
  --cinza-3: #BDBDBD;
  --cinza-4: #9A9A9A;
  --filete-e: #3A3A3A;
  --terra: #D9775A;
  --topo: rgba(42, 42, 42, .85);
  --sans: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --suave: cubic-bezier(.2, .7, .2, 1);
  --corte: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  --corte-p: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
  --pad: 16px;
  --hd: 64px;
  --lat: 288px;

  /* tema claro (derivado) */
  color-scheme: light;
  --fundo: #FFFFFF;
  --fundo-2: #F6F6F4;
  --fundo-cod: #F3F3F1;
  --texto: #2A2A2A;
  --texto-2: #4D4D4D;
  --texto-3: #6B6B6B;
  --filete: #E3E3E0;
  --link: #8A6400;        /* âmbar escuro: 5,0:1 sobre branco */
  --link-h: #5E4400;
  --erro: #B4492C;
  --ok: #2F7D4F;
  --sombra: 0 8px 24px rgba(0, 0, 0, .08);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --fundo: var(--carvao); --fundo-2: var(--faq); --fundo-cod: var(--cartao);
    --texto: var(--branco); --texto-2: var(--cinza-2); --texto-3: var(--cinza-4);
    --filete: var(--filete-e); --link: var(--amarelo); --link-h: var(--amarelo-claro);
    --erro: var(--terra); --ok: #7BC48F; --sombra: 0 14px 32px rgba(0, 0, 0, .45);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --fundo: var(--carvao); --fundo-2: var(--faq); --fundo-cod: var(--cartao);
  --texto: var(--branco); --texto-2: var(--cinza-2); --texto-3: var(--cinza-4);
  --filete: var(--filete-e); --link: var(--amarelo); --link-h: var(--amarelo-claro);
  --erro: var(--terra); --ok: #7BC48F; --sombra: 0 14px 32px rgba(0, 0, 0, .45);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--hd) + 16px); background: var(--fundo); }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 400 1rem/1.6 var(--sans); -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }
img { max-width: 100%; display: block; }
a { color: var(--link); text-underline-offset: 2px; }
a:hover { color: var(--link-h); }
b, strong { font-weight: 600; }
button, input { font: inherit; color: inherit; }
::selection { background: var(--amarelo); color: var(--carvao); }
:focus-visible { outline: 2px solid var(--amarelo); outline-offset: 3px; }
code, pre { font-family: var(--mono); font-size: .875em; font-variant-ligatures: none; }
:not(pre) > code { padding: .1em .35em; background: var(--fundo-cod); border: 1px solid var(--filete); border-radius: 3px; overflow-wrap: anywhere; }
a code { color: inherit; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 8px; top: -60px; z-index: 100; padding: 10px 14px; background: var(--amarelo); color: var(--carvao); font-weight: 600; text-decoration: none; }
.skip:focus { top: 8px; color: var(--carvao); }

/* ---------- cabeçalho (home.css A0 i), sempre carvão ---------- */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 50; background: var(--topo); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 1px 4px rgba(0, 0, 0, .6); color: var(--branco); }
[data-tema-efetivo="light"] .site-header { background: rgba(42, 42, 42, .96); }
.hd-in { display: flex; align-items: center; gap: 4px; height: var(--hd); padding: 0 6px 0 var(--pad); }
.hd-logo { display: flex; align-items: center; gap: 12px; margin-right: auto; color: var(--branco); text-decoration: none; }
.hd-logo:hover { color: var(--branco); }
.hd-logo img { width: 100px; height: auto; }
.hd-prod { font: 600 .9375rem/1 var(--sans); white-space: nowrap; }
.hd-ver { margin-left: 4px; font: 500 .6875rem/1 var(--mono); color: var(--cinza-4); }
.hd-tema, .hd-menu { flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; border-radius: 4px; cursor: pointer; color: var(--amarelo); }
.hd-tema .i-lua { display: none; }
[data-tema-efetivo="light"] .hd-tema .i-sol { display: none; }
[data-tema-efetivo="light"] .hd-tema .i-lua { display: block; }
.mb3 { position: relative; width: 24px; height: 14px; }
.mb3 i { position: absolute; left: 0; top: 6px; width: 24px; height: 2px; border-radius: 1px; background: var(--amarelo); transition: rotate .18s ease, translate .2s ease .12s, scale .2s ease .12s; }
.mb3 i:nth-child(1) { translate: 0 -5px; }
.mb3 i:nth-child(2) { translate: 5.04px 5px; scale: .58 1; }
.hd-menu:hover .mb3 i:nth-child(2) { translate: 2.4px 5px; scale: .8 1; }
.hd-menu[aria-expanded="true"] .mb3 i { transition: translate .18s ease, scale .18s ease, rotate .26s var(--suave) .16s; }
.hd-menu[aria-expanded="true"] .mb3 i:nth-child(1) { translate: 0 0; rotate: 45deg; }
.hd-menu[aria-expanded="true"] .mb3 i:nth-child(2) { translate: 0 0; scale: 1 1; rotate: -45deg; }

/* ---------- grade: lateral + conteúdo ---------- */
.grade { padding-top: var(--hd); }
.lateral {
  position: fixed; top: var(--hd); left: 0; right: 0; bottom: 0; z-index: 40;
  overflow-y: auto; padding: 16px var(--pad) 32px; background: var(--fundo-2);
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity .2s ease, transform .3s var(--suave), visibility 0s linear .3s;
}
.nav-aberta .lateral { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .3s var(--suave), visibility 0s; }
.nav-aberta { overflow: hidden; }
.nav-t { margin: 22px 0 6px; font: 600 .6875rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); }
.lateral ul { margin: 0; padding: 0; list-style: none; }
.lateral li a { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px 10px; margin: 0 -10px; border-left: 3px solid transparent; color: var(--texto-2); font-size: .9375rem; line-height: 1.3; text-decoration: none; }
.lateral li a:hover { color: var(--texto); background: var(--fundo); }
.lateral li a[aria-current="page"] { color: var(--texto); font-weight: 600; border-left-color: var(--amarelo); background: var(--fundo); }
.nav-cam { font-family: var(--mono); font-size: .8125rem; overflow-wrap: anywhere; }
.nav-lista > ul:last-child { margin-top: 18px; }

.conteudo { min-width: 0; max-width: 880px; padding: 28px var(--pad) 64px; }

@media (min-width: 1024px) {
  .hd-menu { display: none; }
  .grade { display: grid; grid-template-columns: var(--lat) minmax(0, 1fr); }
  .lateral {
    position: sticky; top: var(--hd); bottom: auto; height: calc(100vh - var(--hd)); z-index: auto;
    opacity: 1; visibility: visible; transform: none; transition: none;
    padding: 24px 24px 40px; border-right: 1px solid var(--filete);
  }
  .conteudo { padding: 40px 48px 80px; }
  h2 { margin-top: 48px; }
}

/* ---------- busca ---------- */
.busca { position: relative; }
.busca input {
  width: 100%; min-height: 44px; padding: 0 12px; background: var(--fundo); color: var(--texto);
  border: 1px solid var(--filete); border-radius: 0; font-size: 1rem; /* 16px: o iOS não dá zoom */
}
.busca input:focus { outline: none; border-color: var(--amarelo); box-shadow: inset 0 -2px 0 var(--amarelo); }
.busca-r { margin-top: 10px !important; }
.busca-r a { display: block !important; padding: 8px 10px !important; }
.busca-r b { display: block; color: var(--texto); font-weight: 600; font-size: .875rem; }
.busca-r small { display: block; color: var(--texto-3); font-size: .8125rem; line-height: 1.4; }
.busca-r mark { background: none; color: var(--link); font-weight: 600; }
.busca-r .vazio { padding: 8px 0; color: var(--texto-3); font-size: .875rem; }

/* ---------- texto ---------- */
.olho { margin: 0 0 12px; font: 600 .75rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--link); }
h1, h2, h3, h4 { position: relative; font-family: var(--sans); font-weight: 600; line-height: 1.25; color: var(--texto); }
h1 { margin: 0 0 16px; font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.375rem); letter-spacing: -.01em; }
h2 { margin: 36px 0 14px; padding-top: 20px; border-top: 1px solid var(--filete); font-size: 1.375rem; }
h3 { margin: 32px 0 10px; font-size: 1.125rem; }
p, ul, ol { margin: 0 0 14px; }
ul, ol { padding-left: 1.4em; }
li { margin: 4px 0; }
li::marker { color: var(--texto-3); }
.lead { font-size: 1.125rem; line-height: 1.55; color: var(--texto-2); max-width: 66ch; }
.ancora { position: absolute; left: -1.1em; width: 1em; color: var(--texto-3); text-decoration: none; opacity: 0; }
h2:hover .ancora, h3:hover .ancora, .ancora:focus { opacity: 1; }
h2 .ancora { top: 20px; }
.versao, .aut { color: var(--texto-3); font-size: .875rem; }

/* ---------- botões C2, Lâmina (home.css) ---------- */
.acoes { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 24px 0 8px; }
.seta { flex: none; display: block; }
.btn-p, .btn-s { position: relative; display: inline-block; margin: 0 4px 4px 0; isolation: isolate; text-decoration: none; cursor: pointer; }
.btn-p::before { content: ""; position: absolute; inset: 0; z-index: -1; transform: translate(4px, 4px); background: #101010; clip-path: var(--corte); }
.face { position: relative; display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 48px; padding: 0 24px; clip-path: var(--corte); font: 600 .9375rem/1.2 var(--sans); white-space: nowrap; transition: transform .2s var(--suave); }
.btn-p .face { background: var(--amarelo); color: var(--carvao); }
.btn-p:hover .face { transform: translate(4px, 4px); }
.btn-p .seta { transition: transform .2s var(--suave); }
.btn-p:hover .seta { transform: translateX(3px); }
.btn-s .face { background: #8A8A8A; color: var(--texto); isolation: isolate; }
.btn-s .face::before { content: ""; position: absolute; inset: 1px; z-index: -1; background: var(--fundo); clip-path: polygon(0 0, calc(100% - 9.6px) 0, 100% 9.6px, 100% 100%, 0 100%); }
.btn-s:hover .face { background: var(--amarelo); color: var(--link); }

/* ---------- tabelas (filetes do .way) ---------- */
.tabela { margin: 0 0 18px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; font-size: .9375rem; line-height: 1.5; }
th { padding: 8px 12px 8px 0; text-align: left; vertical-align: bottom; font: 600 .6875rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); border-bottom: 1px solid var(--filete); }
td { padding: 10px 12px 10px 0; vertical-align: top; border-bottom: 1px solid var(--filete); color: var(--texto-2); }
td:first-child { color: var(--texto); }
table.campos td:first-child { white-space: nowrap; }
.tipo { font-family: var(--mono); font-size: .8125rem; color: var(--texto-3); }
.regras { display: block; margin-top: 4px; color: var(--texto-3); font-size: .8125rem; }
.opc, .obr { font: 500 .6875rem/1 var(--sans); letter-spacing: .04em; color: var(--texto-3); }
.obr { color: var(--erro); }
table.rotas td:first-child { width: 52px; }
table.rotas td:nth-child(2) { white-space: nowrap; }
@media (max-width: 640px) {
  /* celular: nome, local e tipo numa linha; descrição embaixo */
  table.campos thead { display: none; }
  table.campos, table.campos tbody { display: block; }
  table.campos tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 10px 0; border-bottom: 1px solid var(--filete); }
  table.campos td { padding: 0; border: 0; }
  table.campos td:last-child { flex-basis: 100%; }
  table.rotas, table.rotas tbody, table.rotas tr, table.rotas td { display: block; }
  table.rotas tr { padding: 10px 0; border-bottom: 1px solid var(--filete); }
  table.rotas td { padding: 0; border: 0; width: auto !important; }
  table.rotas td:first-child { display: inline-block; margin-right: 8px; }
  table.rotas td:nth-child(2) { display: inline-block; }
}

/* ---------- método e rota ---------- */
.met { display: inline-block; padding: 3px 8px 3px 6px; background: var(--amarelo); color: var(--carvao); clip-path: var(--corte-p); font: 700 .6875rem/1.2 var(--mono); letter-spacing: .04em; }
.lateral .met { padding: 2px 6px 2px 4px; font-size: .625rem; }
.rota { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 20px; padding: 12px 14px; background: var(--fundo-cod); border-left: 3px solid var(--amarelo); }
.rota code { padding: 0; background: none; border: 0; font-size: .9375rem; color: var(--texto); overflow-wrap: anywhere; }

/* ---------- blocos de código ---------- */
.cod { margin: 0 0 18px; background: var(--fundo-cod); border: 1px solid var(--filete); }
.cod-t { display: flex; align-items: center; justify-content: space-between; min-height: 36px; padding: 0 4px 0 12px; border-bottom: 1px solid var(--filete); font: 600 .6875rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); }
.copiar { min-height: 32px; min-width: 64px; padding: 0 10px; border: 1px solid transparent; background: none; color: var(--link); font: 600 .75rem/1 var(--sans); cursor: pointer; clip-path: var(--corte-p); }
.copiar:hover { background: var(--amarelo); color: var(--carvao); }
.copiar.ok { color: var(--ok); background: none; }
.cod pre { margin: 0; padding: 14px; overflow-x: auto; font-size: .8125rem; line-height: 1.6; tab-size: 2; color: var(--texto); }

/* ---------- respostas (acordeão do FAQ) ---------- */
.resp { border-top: 1px solid var(--filete); }
.resp:last-of-type { border-bottom: 1px solid var(--filete); }
.resp summary { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; cursor: pointer; list-style: none; }
.resp summary::-webkit-details-marker { display: none; }
.resp summary:hover .resp-d { color: var(--texto); }
.resp-d { flex: 1; color: var(--texto-2); font-size: .9375rem; }
.st { flex: none; min-width: 44px; font: 700 .875rem/1.6 var(--mono); }
.st-2, .st-3 { color: var(--ok); }
.st-4, .st-5 { color: var(--erro); }
.fq-i { position: relative; flex: none; width: 18px; height: 18px; margin-top: 3px; }
.fq-i::before, .fq-i::after { content: ""; position: absolute; left: 2px; top: 8px; width: 14px; height: 2px; border-radius: 1px; background: var(--texto-3); transition: transform .2s ease; }
.fq-i::after { transform: rotate(90deg); }
.resp[open] .fq-i::after { transform: rotate(0); }
.resp[open] .fq-i::before, .resp[open] .fq-i::after { background: var(--amarelo); }
.resp-c { padding: 0 0 12px 56px; }
@media (max-width: 640px) { .resp-c { padding-left: 0; } }
.mt, .ex-t, .esq-ref { margin: 12px 0 8px; font-size: .875rem; color: var(--texto-3); }
.mt { font: 600 .6875rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; }

.chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0; list-style: none; }
.chips li { margin: 0; }

/* ---------- rodapé (home.css .ft) ---------- */
.site-footer { padding: 24px var(--pad); background: var(--carvao); color: var(--cinza-2); }
.ft { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; font-size: .875rem; }
.ft img { width: 80px; height: auto; opacity: .92; margin-right: 6px; }
.ft-sep { color: #8A8A8A; }
.ft code { background: var(--cartao); border-color: var(--filete-e); color: var(--cinza-2); }
@media (max-width: 640px) { .ft-sep { display: none; } .ft { flex-direction: column; align-items: flex-start; } }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }
