/* Paginas institucionais (lojas, ajuda, termos): mesmos tokens da captacao. */
:root{
  --ground:#ffffff; --surface:#f4f7fb; --surface-2:#e6edf5;
  --ink:#0f1c2b; --ink-2:#44546a; --ink-3:#536277;
  --line:#e2e8f0; --line-2:#c9d4e1;
  --brand:#0b5a9c; --brand-ink:#ffffff; --brand-soft:#eaf2fa; --rotulo-ink:#0a5596;
  --gold:#6cbcf5; --acento:#1a6fbd; --link:#0a5596;
  --zap:#0f7a40; --zap-ink:#ffffff;
  --display:"Outfit",system-ui,sans-serif;
  --corpo:"Work Sans","Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --ground:#0b121b; --surface:#111a26; --surface-2:#1a2636;
  --ink:#e9f0f8; --ink-2:#b5c4d6; --ink-3:#98a9bd;
  --line:#213042; --line-2:#2d3f55;
  --brand:#0a3d6b; --brand-ink:#e9f0f8; --brand-soft:#12243a; --rotulo-ink:#6cbcf5;
  --gold:#8fcdf8; --acento:#8fcdf8; --link:#8fcdf8;
  --zap:#3ddc84; --zap-ink:#04240f;
}}
:root[data-theme="dark"]{
  --ground:#0b121b; --surface:#111a26; --surface-2:#1a2636;
  --ink:#e9f0f8; --ink-2:#b5c4d6; --ink-3:#98a9bd;
  --line:#213042; --line-2:#2d3f55;
  --brand:#0a3d6b; --brand-ink:#e9f0f8; --brand-soft:#12243a; --rotulo-ink:#6cbcf5;
  --gold:#8fcdf8; --acento:#8fcdf8; --link:#8fcdf8;
  --zap:#3ddc84; --zap-ink:#04240f;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth; scroll-padding-top:20px}
body{margin:0; background:var(--ground); color:var(--ink-2);
  font-family:var(--corpo); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--display); color:var(--ink); margin:0; text-wrap:balance; letter-spacing:-.02em}
a{color:var(--link)}
:focus-visible{outline:2px solid var(--acento); outline-offset:3px; border-radius:6px}
@media (prefers-reduced-motion:reduce){*{transition:none !important} html{scroll-behavior:auto}}
.wrap{max-width:1000px; margin:0 auto; padding:0 20px}

/* topo */
.topo{background:var(--brand); color:var(--brand-ink); padding:14px 0}
.topo-in{max-width:1000px; margin:0 auto; padding:0 20px; display:flex; align-items:center;
  justify-content:space-between; gap:16px; flex-wrap:wrap}
.marca{text-decoration:none; color:inherit; display:flex; align-items:center; gap:11px; font-family:var(--display);
  font-weight:700; font-size:17px; letter-spacing:-.02em}
.marca svg{width:38px; height:38px; flex:none; color:var(--gold)}
.ver-vitrine{color:var(--brand-ink); font-size:14px; font-weight:600; padding:8px 16px; text-decoration:none;
  border:1px solid rgba(255,255,255,.32); border-radius:99px}
.ver-vitrine:hover{background:rgba(255,255,255,.12)}

/* cabecalho da pagina */
.cab{padding:44px 0 30px; border-bottom:1px solid var(--line); background:var(--surface)}
.trilha{font-size:13.5px; margin:0 0 12px; color:var(--ink-3)}
.trilha a{text-decoration:none}
.trilha a:hover{text-decoration:underline}
.cab h1{font-size:clamp(28px,4.5vw,40px); line-height:1.1}
.cab p{margin:12px 0 0; max-width:62ch; font-size:17px}

/* corpo com indice */
.corpo{display:grid; grid-template-columns:220px minmax(0,1fr); gap:44px; padding:40px 20px 70px}
.indice{position:sticky; top:20px; align-self:start; font-size:14.5px}
.indice p{margin:0 0 8px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.indice ul{list-style:none; margin:0; padding:0; display:grid; gap:2px}
.indice a{display:block; padding:6px 10px; border-radius:6px; text-decoration:none; color:var(--ink-2); min-height:24px}
.indice a:hover{background:var(--surface); color:var(--ink)}
.texto{max-width:68ch}
.texto section{padding:0 0 34px; margin:0 0 34px; border-bottom:1px solid var(--line)}
.texto section:last-child{border-bottom:0; margin-bottom:0}
.texto h2{font-size:24px; margin:0 0 12px}
.texto h3{font-size:17px; margin:22px 0 6px; letter-spacing:-.01em}
.texto p{margin:0 0 12px}
.texto ul,.texto ol{margin:0 0 12px; padding-left:22px}
.texto li{margin:0 0 6px}
.texto b{color:var(--ink)}
.nota{background:var(--brand-soft); border-left:3px solid var(--gold); padding:12px 16px; border-radius:0 8px 8px 0;
  margin:14px 0; font-size:15px}
.nota b{color:var(--ink)}

/* perguntas */
details.pergunta{border:1px solid var(--line-2); border-radius:10px; margin:0 0 10px; background:var(--ground)}
details.pergunta summary{cursor:pointer; list-style:none; padding:14px 44px 14px 16px; font-weight:600;
  color:var(--ink); position:relative; min-height:44px}
details.pergunta summary::-webkit-details-marker{display:none}
details.pergunta summary::after{content:"+"; position:absolute; right:16px; top:12px; font-family:var(--mono);
  font-size:18px; color:var(--ink-3)}
details.pergunta[open] summary::after{content:"−"}
details.pergunta > div{padding:0 16px 14px}
details.pergunta > div p:last-child{margin-bottom:0}

.btn-zap{display:inline-flex; align-items:center; gap:8px; background:var(--zap); color:var(--zap-ink);
  font-weight:700; padding:12px 20px; border-radius:99px; text-decoration:none; min-height:44px}
.btn-zap:hover{filter:brightness(1.08)}

/* lojas */
.lojas{list-style:none; margin:0; padding:40px 0 70px; display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px}
.loja{display:flex; gap:14px; align-items:center; padding:18px; border:1px solid var(--line-2);
  border-radius:12px; background:var(--ground); text-decoration:none; color:inherit}
.loja:hover{border-color:var(--link); background:var(--surface)}
.loja i{width:54px; height:54px; border-radius:10px; color:#fff; display:grid; place-items:center; flex:none;
  font-family:var(--display); font-weight:700; font-size:18px; font-style:normal}
.loja b{display:block; font-family:var(--display); font-size:17px; color:var(--ink)}
.loja span{font-size:14px; color:var(--ink-3)}
.loja.esq{min-height:92px; background:var(--surface-2); border:0; animation:pulsa 1.4s ease-in-out infinite}
@keyframes pulsa{50%{opacity:.55}}
@media (prefers-reduced-motion:reduce){.loja.esq{animation:none}}
.loja i.com-logo{background:#fff; border:1px solid var(--line); overflow:hidden}
.loja i img{width:100%; height:100%; object-fit:contain}
.lojas .falha{grid-column:1/-1}
.convite{padding:26px; border-radius:12px; background:var(--surface); margin:0 0 70px;
  display:flex; justify-content:space-between; align-items:center; gap:14px 24px; flex-wrap:wrap}
.convite h2{font-size:21px}
.convite p{margin:4px 0 0}
.convite a{font-weight:700}

/* acompanhar pedido */
.acomp{max-width:640px; padding:32px 20px 70px}
.acomp h1{font-size:clamp(26px,5vw,34px)}
.acomp .loja-p{margin:6px 0 22px; color:var(--ink-3)}
.esq-ped{min-height:320px; background:var(--surface-2); border-radius:12px; animation:pulsa 1.4s ease-in-out infinite}
.linha{list-style:none; margin:0 0 26px; padding:0}
.linha li{position:relative; padding:0 0 18px 30px; color:var(--ink-3)}
.linha li::before{content:""; position:absolute; left:4px; top:5px; width:12px; height:12px; border-radius:50%;
  border:2px solid var(--line-2); background:var(--ground)}
.linha li::after{content:""; position:absolute; left:10px; top:21px; bottom:0; width:2px; background:var(--line-2)}
.linha li:last-child::after{display:none}
.linha li b{display:block; font-weight:600}
.linha li span{font-size:13.5px}
.linha li.feita, .linha li.agora{color:var(--ink)}
.linha li.feita::before{background:var(--link); border-color:var(--link)}
.linha li.feita::after{background:var(--link)}
.linha li.agora::before{background:var(--gold); border-color:var(--gold); box-shadow:0 0 0 4px var(--brand-soft)}
.linha li.agora b{font-weight:800}
.caixa{border:1px solid var(--line-2); border-radius:12px; padding:18px 20px; margin:0 0 20px}
.caixa h2{font-size:18px; margin:0 0 10px}
.itens{list-style:none; margin:0 0 10px; padding:0}
.itens li, .linha-v{display:flex; justify-content:space-between; gap:12px; margin:0; padding:7px 0; border-bottom:1px solid var(--line)}
.itens li > span:last-child, .linha-v > span:last-child{white-space:nowrap}
.linha-v.total{font-weight:800; color:var(--ink); border-bottom:0; font-size:17px}
.caixa .pag{margin:6px 0 0; font-size:14px; color:var(--ink-3)}
.nota.cancelado{border-left-color:#b3261e}
.nota-rec{font-size:13.5px; color:var(--ink-3)}
.btn-tentar{background:var(--ink); color:var(--ground); border:0; border-radius:99px; padding:11px 22px; font:inherit; font-weight:700; cursor:pointer; min-height:44px}

/* avaliar */
.estrelas{display:flex; gap:2px}
.estrelas button{font-size:34px; line-height:1; background:none; border:0; color:var(--line-2); min-width:44px; min-height:44px; cursor:pointer; padding:0}
.estrelas button.on{color:#d99a00}
.nota-txt{margin:2px 0 14px; font-weight:600; color:var(--ink)}
.marcas{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px}
.marcas button{border:1px solid var(--line-2); border-radius:99px; padding:8px 14px; background:var(--ground); color:var(--ink-2);
  font:inherit; font-size:14px; min-height:40px; cursor:pointer}
.marcas button.on{border-color:var(--link); background:var(--brand-soft); color:var(--ink); font-weight:600}
.campo-av{display:block; font-weight:600; color:var(--ink); margin:0 0 6px}
.campo-av small{font-weight:400; color:var(--ink-3)}
.aval-form textarea{width:100%; border:1px solid var(--line-2); border-radius:10px; padding:10px 12px; font:inherit; background:var(--ground); color:var(--ink)}
.av-erro{color:#b3261e; font-weight:600; margin:8px 0 0; min-height:1px}
.btn-pub{margin:10px 0 0; background:var(--ink); color:var(--ground); border:0; border-radius:99px; padding:12px 24px;
  font:inherit; font-weight:700; cursor:pointer; min-height:44px}
.btn-pub[disabled]{opacity:.6}
.av-aviso{font-size:13.5px; color:var(--ink-3); margin:10px 0 0}
.av-est{font-size:22px; color:#d99a00; margin:0; letter-spacing:2px}
.av-quem{margin:4px 0 8px; font-size:14.5px}
.av-tags span{display:inline-block; font-size:13px; background:var(--surface-2); border-radius:99px; padding:3px 10px; margin:0 6px 6px 0}
.av-resp{margin:10px 0 0; padding:10px 14px; background:var(--surface); border-left:3px solid var(--gold); border-radius:0 8px 8px 0}
.av-resp b{display:block; color:var(--ink); font-size:14px}
.btn-sec{background:none; border:1px solid var(--line-2); border-radius:99px; padding:9px 18px; font:inherit; font-weight:600; cursor:pointer; min-height:40px; color:var(--ink)}

/* rodape */
.rodape{padding:28px 0 34px; margin-top:48px; border-top:1px solid var(--line); font-size:13.5px; color:var(--ink-3)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .rodape::before{opacity:.16} }
:root[data-theme="dark"] .rodape::before{opacity:.16}
.rodape .wrap{display:flex; justify-content:space-between; align-items:center; gap:10px 24px; flex-wrap:wrap}
.rodape nav{display:flex; gap:6px 18px; flex-wrap:wrap}
.rodape nav a{color:var(--ink-2); text-decoration:none; min-height:24px; display:inline-flex; align-items:center}
.rodape nav a:hover{text-decoration:underline}
.rod-cacis{display:inline-flex; align-items:center; gap:10px; font-size:12.5px; color:var(--ink-3)}
.rod-cacis img{width:54px; height:auto}
.rod-cacis .cl-branco{display:none}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .rod-cacis .cl-azul{display:none} :root:not([data-theme="light"]) .rod-cacis .cl-branco{display:block} }
:root[data-theme="dark"] .rod-cacis .cl-azul{display:none}
:root[data-theme="dark"] .rod-cacis .cl-branco{display:block}
.versao-rodape{margin-left:auto; font-family:var(--mono); font-size:12px; color:var(--ink-2); white-space:nowrap}
.versao-rodape b{color:var(--ink); font-weight:600}

@media (max-width:760px){
  .corpo{grid-template-columns:minmax(0,1fr); gap:24px; padding-top:26px}
  .indice{position:static; border:1px solid var(--line); border-radius:10px; padding:12px}
  .indice ul{grid-template-columns:1fr 1fr}
  .rodape .wrap{justify-content:center; text-align:center}
  .versao-rodape{margin-left:0; white-space:normal}
}