/* Maitaca · página inicial. Tokens copiados do Tô de Olho (apps/web/app/globals.css, handoff §5):
   grafite sobre papel, fonte do sistema, quase sem cor. A interface nunca usa cor de partido; cor só nos prints de dado.
   Tema: segue o sistema; [data-theme] no <html> força claro ou escuro (assets/tema.js). */

/* ── tokens · tema claro ── */
:root {
  color-scheme: light;
  --bg:#FBFAF8; --sidebar:#F3F2EF; --surface:#FFFFFF;
  --text:#1D1D1F; --text-2:#3A3A3C; --muted:#6E6E73; --muted-2:#A1A1A6;
  --track:#ECEBE8; --hover-row:#F7F6F3;
  --sep:rgba(0,0,0,.05); --sep-head:rgba(0,0,0,.08); --sep-card:rgba(0,0,0,.06);
  --input-ring:0 0 0 1px rgba(0,0,0,.12); --input-ring-foco:0 0 0 2px var(--accent);
  --accent:#1D1D1F; --on-accent:#FFFFFF; --on-accent-2:rgba(255,255,255,.74);
  --ok:#1E7A3C; --err:#B3261E;                    /* só mensagens de estado do formulário */
  --sombra-cartao:0 0 0 1px var(--sep-card);
  --sombra-cartao-hover:0 0 0 1px rgba(0,0,0,.14), 0 8px 24px rgba(0,0,0,.06);
  --sombra-print:0 0 0 1px rgba(0,0,0,.06), 0 24px 60px -12px rgba(0,0,0,.22);
  --r-janela:14px; --r-cartao:12px; --r-botao:9px; --r-item:8px; --r-pilula:999px;
  --fonte:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
  --mono:ui-monospace, "SF Mono", Menlo, monospace;
  --largura:1160px;
}

/* ── tokens · tema escuro ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg:#0F0F11; --sidebar:#161618; --surface:#1C1C1F;
    --text:#F5F5F7; --text-2:#D1D1D6; --muted:#A1A1A6; --muted-2:#6E6E73;
    --track:#2C2C2E; --hover-row:#232326;
    --sep:rgba(255,255,255,.06); --sep-head:rgba(255,255,255,.08); --sep-card:rgba(255,255,255,.08);
    --input-ring:0 0 0 1px rgba(255,255,255,.16);
    --accent:#F5F5F7; --on-accent:#1C1C1F; --on-accent-2:rgba(28,28,31,.76);
    --ok:#5CC27F; --err:#FF7A70;
    --sombra-cartao-hover:0 0 0 1px rgba(255,255,255,.18), 0 8px 24px rgba(0,0,0,.4);
    --sombra-print:0 0 0 1px rgba(255,255,255,.1), 0 24px 60px -12px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#0F0F11; --sidebar:#161618; --surface:#1C1C1F;
  --text:#F5F5F7; --text-2:#D1D1D6; --muted:#A1A1A6; --muted-2:#6E6E73;
  --track:#2C2C2E; --hover-row:#232326;
  --sep:rgba(255,255,255,.06); --sep-head:rgba(255,255,255,.08); --sep-card:rgba(255,255,255,.08);
  --input-ring:0 0 0 1px rgba(255,255,255,.16);
  --accent:#F5F5F7; --on-accent:#1C1C1F; --on-accent-2:rgba(28,28,31,.76);
  --ok:#5CC27F; --err:#FF7A70;
  --sombra-cartao-hover:0 0 0 1px rgba(255,255,255,.18), 0 8px 24px rgba(0,0,0,.4);
  --sombra-print:0 0 0 1px rgba(255,255,255,.1), 0 24px 60px -12px rgba(0,0,0,.7);
}

/* ── base ── */
* { box-sizing:border-box; }
html { font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; scroll-padding-top:120px; }
@media (min-width:900px) { html { scroll-padding-top:72px; } }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.55 var(--fonte); }
a { color:var(--text); text-decoration-color:var(--muted-2); text-underline-offset:3px; }
a:hover { text-decoration-color:var(--text); }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:4px; }
button, input, select, textarea { font:inherit; color:inherit; }
h1, h2, h3 { margin:0; font-weight:600; }
p { margin:0; }
img { max-width:100%; height:auto; display:block; }
.rotulo { font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); }
.so-leitor { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.pular { position:absolute; left:16px; top:-48px; z-index:20; background:var(--accent); color:var(--on-accent); padding:10px 14px; border-radius:var(--r-botao); text-decoration:none; font-weight:600; }
.pular:focus { top:12px; }
.ext::after { content:"↗"; display:inline-block; margin-left:.25em; font-size:.85em; }

.envelope { max-width:var(--largura); margin:0 auto; padding:0 16px; }
@media (min-width:768px) { .envelope { padding:0 32px; } }

/* ── movimento: só com "reduzir movimento" desligado e com JS (sem JS, tudo aparece) ── */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior:smooth; }
  .cartao, .botao, .idioma { transition:box-shadow .2s ease-out, opacity .2s ease-out, transform .2s ease-out; }
  .js .surge { opacity:0; transform:translateY(18px); transition:opacity .7s ease-out, transform .7s cubic-bezier(.2,.7,.2,1); }
  .js .surge.visivel { opacity:1; transform:none; }
  .flutua { animation:flutua 9s ease-in-out infinite; }
  .flutua.lento { animation-duration:12s; animation-delay:-4s; }
  .print-zoom img { animation:passeia 28s ease-in-out infinite alternate; }
}
@keyframes flutua { 0%, 100% { translate:0 0; } 50% { translate:0 -10px; } }
@keyframes passeia { from { transform:scale(1.04) translate(0, 0); } to { transform:scale(1.14) translate(-3%, -2%); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation:none !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ── topo fixo ── */
.topo { position:sticky; top:0; z-index:10; background:color-mix(in srgb, var(--bg) 86%, transparent);
  backdrop-filter:saturate(1.4) blur(18px); -webkit-backdrop-filter:saturate(1.4) blur(18px); border-bottom:1px solid var(--sep-head); }
.barra { display:flex; flex-wrap:wrap; align-items:center; gap:0 8px; min-height:56px; }
.marca { display:flex; align-items:center; gap:8px; text-decoration:none; margin-right:auto; min-height:48px; }
.marca svg { width:30px; height:30px; flex:none; }
.marca path { stroke:var(--text); } .marca circle { fill:var(--text); }
.marca b { font-size:18px; font-weight:600; letter-spacing:-.02em; }
.menu { order:3; flex:1 0 100%; display:flex; gap:2px; overflow-x:auto; scrollbar-width:none; margin:0 -8px; padding:0 0 6px; }
.menu::-webkit-scrollbar { display:none; }
.menu a { flex:none; font-size:14px; color:var(--text-2); text-decoration:none; padding:8px 10px; min-height:40px; display:inline-flex; align-items:center; border-radius:var(--r-item); }
.menu a:hover { background:var(--hover-row); color:var(--text); }
@media (min-width:900px) { .menu { order:0; flex:none; margin:0 8px 0 0; padding:0; } }
.ferramentas { display:flex; align-items:center; gap:2px; }
.idiomas { display:flex; gap:2px; padding:3px; background:var(--track); border-radius:var(--r-botao); }
.idioma { display:inline-flex; align-items:center; gap:6px; min-height:38px; min-width:44px; padding:0 8px; border-radius:7px;
  font-size:12px; font-weight:600; color:var(--text-2); text-decoration:none; }
.idioma svg { width:20px; height:14px; border-radius:3px; box-shadow:0 0 0 1px rgba(0,0,0,.12); flex:none; }
.idioma[aria-current="true"] { background:var(--surface); color:var(--text); box-shadow:0 1px 3px rgba(0,0,0,.12); }
.idioma:not([aria-current="true"]):hover { color:var(--text); }
.bt-tema { border:0; background:none; cursor:pointer; min-width:44px; min-height:44px; border-radius:var(--r-item); display:inline-grid; place-items:center; color:var(--text-2); }
.bt-tema:hover { background:var(--hover-row); }
.bt-tema svg { width:20px; height:20px; }
.bt-tema .i-claro, .bt-tema .i-escuro { display:none; }
:root[data-theme="light"] .bt-tema .i-auto, :root[data-theme="dark"] .bt-tema .i-auto { display:none; }
:root[data-theme="light"] .bt-tema .i-claro { display:block; }
:root[data-theme="dark"] .bt-tema .i-escuro { display:block; }

/* ── seções ── */
section { padding:64px 0; }
@media (min-width:768px) { section { padding:88px 0; } }
.cab-secao { max-width:720px; margin-bottom:36px; display:flex; flex-direction:column; gap:12px; }
.cab-secao h2, .cab-duplo h2, .titulo { font-size:32px; letter-spacing:-.03em; line-height:1.1; }
@media (min-width:768px) { .cab-secao h2, .cab-duplo h2, .titulo { font-size:42px; } }
.cab-secao p, .cab-duplo > p { color:var(--text-2); font-size:18px; }
/* desktop: título à esquerda, texto à direita, para o cabeçalho não deixar meia tela vazia */
.cab-duplo { display:flex; flex-direction:column; gap:12px; margin-bottom:36px; }
.cab-duplo > div { display:flex; flex-direction:column; gap:12px; }
@media (min-width:1000px) {
  .cab-secao { max-width:none; display:grid; grid-template-columns:1fr 1fr; gap:12px 56px; align-items:end; }
  .cab-secao .rotulo { grid-column:1; grid-row:1; }
  .cab-secao h2 { grid-column:1; grid-row:2; }
  .cab-secao p:not(.rotulo) { grid-column:2; grid-row:1 / span 2; }
  .cab-duplo { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:end; }
}

.botao { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:0 22px; border-radius:var(--r-botao);
  font-weight:600; font-size:15px; text-decoration:none; cursor:pointer; border:0; }
.botao.primario { background:var(--accent); color:var(--on-accent); }
.botao.primario:hover { opacity:.86; }
.botao.secundario { background:var(--surface); color:var(--text); box-shadow:var(--sombra-cartao); }
.botao.secundario:hover { box-shadow:var(--sombra-cartao-hover); }
.acoes { display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; }

/* abertura */
.abertura { padding:48px 0 72px; overflow:hidden; }
@media (min-width:768px) { .abertura { padding:96px 0 112px; } }
.abertura .envelope { display:grid; gap:48px; align-items:center; }
@media (min-width:1000px) { .abertura .envelope { grid-template-columns:1.05fr 1fr; gap:56px; } }
.abertura h1 { font-size:42px; line-height:1.02; letter-spacing:-.04em; margin:16px 0 22px; }
@media (min-width:768px) { .abertura h1 { font-size:64px; } }
.abertura h1 em { font-style:normal; color:var(--muted); }
.lide { font-size:18px; color:var(--text-2); max-width:600px; }
@media (min-width:768px) { .lide { font-size:20px; } }
/* abertura com o satélite do Atlântico: no celular, imagem abaixo do texto; no desktop, fundo de ponta a ponta
   que esmaece para o papel atrás do texto (a América do Sul fica visível à direita do título) */
.abertura { position:relative; isolation:isolate; }
.vitrine { position:relative; display:flex; flex-direction:column; gap:12px; }
.vitrine figure { margin:0; border-radius:var(--r-janela); overflow:hidden; box-shadow:var(--sombra-print); background:var(--surface); }
.vitrine .v-sat img { width:100%; aspect-ratio:900/421; object-fit:cover; }
.credito-sat { font-size:11px; color:var(--muted); }
@media (min-width:1000px) {
  .abertura { padding:120px 0 104px; min-height:min(760px, 88vh); display:flex; align-items:center; }
  .abertura .envelope { width:100%; }
  .abertura::before { content:""; position:absolute; z-index:-2; top:0; bottom:0; right:0; width:64%;
    background:url(/assets/img/atlantico.webp) left center / cover no-repeat; }
  .abertura::after { content:""; position:absolute; z-index:-1; inset:0;
    background:linear-gradient(90deg, var(--bg) 0%, var(--bg) 36%, color-mix(in srgb, var(--bg) 55%, transparent) 46%, transparent 60%),
               linear-gradient(0deg, var(--bg) 0%, transparent 18%); }
  .abertura .envelope > div:first-child { max-width:560px; }
  .vitrine { align-self:end; align-items:flex-end; }
  .vitrine .v-sat { display:none; }
  .credito-sat { position:absolute; right:-16px; bottom:-72px; padding:3px 8px; border-radius:var(--r-pilula);
    background:color-mix(in srgb, var(--bg) 80%, transparent); color:var(--text-2); }
}
.legenda-print { font-size:12px; color:var(--muted); margin-top:12px; }

/* selo de estado: diferença no texto e no traço, nunca só na cor */
.selo { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:4px 10px; border-radius:var(--r-pilula); white-space:nowrap; align-self:flex-start; }
.selo::before { content:""; width:7px; height:7px; border-radius:50%; flex:none; }
.selo.testes { background:var(--accent); color:var(--on-accent); }
.selo.testes::before { background:var(--on-accent); }
.selo.construcao { box-shadow:inset 0 0 0 1px var(--text-2); color:var(--text); }
.selo.construcao::before { background:linear-gradient(90deg, var(--text) 50%, transparent 50%); box-shadow:inset 0 0 0 1px var(--text); }
.selo.breve { box-shadow:inset 0 0 0 1px var(--muted-2); color:var(--text-2); }
.selo.breve::before { box-shadow:inset 0 0 0 1.5px var(--text-2); }

/* suíte */
/* a suíte em destaque: fundo próprio, título grande, quatro cartões numerados; o Tô de Olho na largura toda */
.suite-secao { background:var(--sidebar); border-top:1px solid var(--sep-head); border-bottom:1px solid var(--sep-head); }
.suite-secao .cab-secao h2 { font-size:38px; letter-spacing:-.04em; }
@media (min-width:768px) { .suite-secao .cab-secao h2 { font-size:60px; line-height:1.02; } }
.suite { display:grid; gap:14px; counter-reset:app; }
.suite > article { counter-increment:app; }
.suite > article h3::before { content:counter(app, decimal-leading-zero) " / 04"; display:block; font-family:var(--mono); font-size:12px; font-weight:400; letter-spacing:0; color:var(--muted); margin-bottom:6px; }
@media (min-width:900px) {
  .suite { grid-template-columns:repeat(3, 1fr); }
  .suite .principal { grid-column:1 / -1; display:grid; grid-template-columns:1.45fr 1fr; gap:12px 40px; align-content:start; }
  .suite .principal .print-zoom { grid-column:1; grid-row:1 / span 4; margin:0; aspect-ratio:16/10; }
  .suite .principal > :not(.print-zoom) { grid-column:2; }
  .suite .principal .selo { align-self:end; }
  .suite .principal .mais { align-self:start; }
}
/* marcas da suíte (traço da maitaca); a do Tô de Olho são as três bolinhas em arco do próprio painel */
.marca-app { width:28px; height:28px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.marca-app circle { fill:currentColor; stroke:none; }
.marca-app circle.fraca { opacity:.45; }
.marca-app circle.anel { fill:none; stroke:currentColor; stroke-width:2; }
.marca-app circle.pessoa { stroke:var(--surface); stroke-width:2.2; }
.marca-app.grande { width:56px; height:56px; }
h3.com-marca { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
h3.com-marca::before { flex-basis:100%; }
.icone-app circle { fill:var(--text); stroke:none; }
.icone-app circle.fraca { opacity:.45; }
.icone-app circle.anel { fill:none; stroke:var(--text); stroke-width:2; }
/* situação de cada aplicação na Argentina (só na página em espanhol) */
.ar-estado { display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--text-2); padding-top:10px; border-top:1px solid var(--sep); margin-top:auto; }
.ar-estado svg { width:18px; height:13px; flex:none; margin-top:3px; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.12); }
.ar-estado + .mais { margin-top:0; }
/* capítulos de cada aplicativo: a marca grande abre o cabeçalho */
.capitulo { border-top:1px solid var(--sep-head); }
.cab-capitulo { display:grid; gap:12px 20px; margin-bottom:36px; align-items:end; }
.cab-capitulo > div { display:flex; flex-direction:column; gap:10px; }
.cab-capitulo h2 { font-size:32px; letter-spacing:-.03em; line-height:1.1; }
.cab-capitulo > p { color:var(--text-2); font-size:18px; }
@media (min-width:768px) { .cab-capitulo h2 { font-size:42px; } }
@media (min-width:1000px) { .cab-capitulo { grid-template-columns:auto 1fr 1fr; gap:24px 40px; } }
/* princípios comuns da suíte */
.principios-grade { display:grid; gap:14px; margin-bottom:24px; }
@media (min-width:900px) { .principios-grade { grid-template-columns:repeat(3, 1fr); } }
.principios-grade article { background:var(--surface); box-shadow:var(--sombra-cartao); border-radius:var(--r-janela); padding:24px; display:flex; flex-direction:column; gap:8px; }
.principios-grade h3 { font-size:19px; letter-spacing:-.015em; }
.principios-grade p { font-size:15px; color:var(--text-2); }
/* vitrine da abertura: o cartão com as quatro marcas */
.vitrine .v-marcas { padding:16px 22px; display:flex; gap:28px; justify-content:space-around; align-items:center; color:var(--text); }
.vitrine .v-marcas .marca-app { width:38px; height:38px; }
.formas.tres { }
@media (min-width:1000px) { .formas.tres { grid-template-columns:repeat(3, 1fr); } .compromissos.quatro { grid-template-columns:repeat(4, 1fr); } }
@media (min-width:640px) and (max-width:999px) { .compromissos.quatro { grid-template-columns:repeat(2, 1fr); } }

/* ícones temporários do Lab e da Gestão: o traço da maitaca, num quadro do tamanho dos prints */
.icone-app { border-radius:var(--r-cartao); aspect-ratio:16/9; background:var(--sidebar); display:grid; place-items:center; margin:4px 0 8px; }
.icone-app svg { width:min(96px, 38%); height:auto; fill:none; stroke:var(--text); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.icone-app .olho { fill:var(--text); stroke:none; }
.icone-app .pessoa { fill:var(--text); stroke:var(--sidebar); stroke-width:2.2; }
.mini-print { border-radius:var(--r-cartao); overflow:hidden; aspect-ratio:16/9; box-shadow:0 0 0 1px var(--sep-card); margin:4px 0 8px; }
.mini-print img { width:100%; height:100%; object-fit:cover; object-position:top left; }
.cartao { background:var(--surface); border-radius:var(--r-janela); box-shadow:var(--sombra-cartao); padding:24px; display:flex; flex-direction:column; gap:12px; }
@media (min-width:768px) { .cartao { padding:32px; } }
.cartao h3 { font-size:24px; letter-spacing:-.025em; }
.cartao p { color:var(--text-2); }
.cartao .mais { margin-top:auto; padding-top:8px; font-weight:600; font-size:15px; }
.principal h3 { font-size:34px; letter-spacing:-.035em; }
.principal p { font-size:17px; }
.print-zoom { border-radius:var(--r-cartao); overflow:hidden; aspect-ratio:16/9; box-shadow:0 0 0 1px var(--sep-card); margin:4px 0 8px; }
.print-zoom img { width:100%; height:100%; object-fit:cover; }

/* privacidade: em destaque (pedido da mantenedora) */
.selo-privado { display:inline-flex; align-items:center; gap:8px; margin-top:20px; font-size:14px; font-weight:600; color:var(--text);
  text-decoration:none; padding:8px 14px 8px 10px; border-radius:var(--r-pilula); background:var(--surface); box-shadow:var(--sombra-cartao); min-height:40px; }
.selo-privado:hover { box-shadow:var(--sombra-cartao-hover); }
.selo-privado svg { width:18px; height:18px; flex:none; }
#privacidade { padding-top:0; }
.privacidade { border-radius:var(--r-janela); box-shadow:0 0 0 1.5px var(--text); background:var(--surface); padding:28px 24px; display:grid; gap:28px; }
@media (min-width:768px) { .privacidade { padding:48px; } }
@media (min-width:1000px) { .privacidade { grid-template-columns:1fr 1.15fr; gap:56px; align-items:start; } }
/* chamado à cocriação da versão argentina (só na página em espanhol): mesmo desenho da privacidade */
.convite { border-radius:var(--r-janela); box-shadow:0 0 0 1.5px var(--text); background:var(--surface); padding:28px 24px; display:grid; gap:28px; }
@media (min-width:768px) { .convite { padding:48px; } }
@media (min-width:1000px) { .convite { grid-template-columns:1fr 1.15fr; gap:56px; align-items:start; } }
.convite .acoes { margin-top:12px; }
.priv-cab { display:flex; flex-direction:column; gap:12px; }
.cadeado { width:44px; height:44px; color:var(--text); }
.priv-lide { font-size:18px; color:var(--text-2); }
.priv-itens { display:grid; gap:0; }
@media (min-width:640px) { .priv-itens { grid-template-columns:1fr 1fr; gap:0 28px; } }
.priv-itens div { padding:18px 0; border-top:1px solid var(--sep-head); display:flex; flex-direction:column; gap:6px; }
.priv-itens h3 { font-size:17px; letter-spacing:-.01em; }
.priv-itens p { font-size:15px; color:var(--text-2); }

/* Tô de Olho */
.tdo { display:grid; gap:20px; }
@media (min-width:900px) { .tdo { grid-template-columns:1.25fr 1fr; gap:24px; align-items:start; } }
.lista { list-style:none; margin:8px 0 0; padding:0; }
.lista li { padding:12px 0; border-top:1px solid var(--sep); display:grid; grid-template-columns:20px 1fr; gap:10px; font-size:15px; color:var(--text-2); }
.lista li::before { content:"—"; color:var(--muted); }
.lista li b { color:var(--text); font-weight:600; }
.lateral { background:var(--sidebar); border-radius:var(--r-janela); padding:24px; display:flex; flex-direction:column; gap:14px; }
@media (min-width:768px) { .lateral { padding:32px; } }
.lateral h3 { font-size:16px; }
.lateral p { font-size:15px; color:var(--text-2); }
.lateral .nota { font-size:13px; color:var(--muted); }
.lateral .acoes { margin-top:8px; }
.diferenciais { display:grid; gap:12px; margin-top:20px; }
@media (min-width:640px) { .diferenciais { grid-template-columns:repeat(2, 1fr); } }
@media (min-width:1000px) { .diferenciais { grid-template-columns:repeat(4, 1fr); } }
.diferenciais article { background:var(--surface); box-shadow:var(--sombra-cartao); border-radius:var(--r-cartao); padding:20px; display:flex; flex-direction:column; gap:8px; }
.diferenciais h3 { font-size:16px; }
.diferenciais p { font-size:14px; color:var(--text-2); }
.num { font-family:var(--mono); font-size:12px; color:var(--muted); }

/* faixa invertida (pertencimento, fechamento) */
.invertida { background:var(--accent); color:var(--on-accent); }
.invertida .rotulo { color:var(--on-accent-2); }
.invertida a { color:var(--on-accent); }
.manifesto { display:grid; gap:40px; }
@media (min-width:1000px) { .manifesto { grid-template-columns:1.1fr 1fr; gap:72px; align-items:start; } }
.manifesto blockquote { margin:16px 0 0; font-size:34px; line-height:1.1; letter-spacing:-.035em; font-weight:600; }
@media (min-width:768px) { .manifesto blockquote { font-size:52px; } }
.manifesto .apoio { margin-top:24px; font-size:18px; color:var(--on-accent-2); max-width:560px; }
.argumentos { display:grid; gap:0; }
.argumentos div { padding:20px 0; border-top:1px solid color-mix(in srgb, var(--on-accent) 18%, transparent); display:flex; flex-direction:column; gap:6px; }
.argumentos h3 { font-size:18px; letter-spacing:-.01em; }
.argumentos p { font-size:16px; color:var(--on-accent-2); }

/* por trás do painel */
.print-largo { margin:0 0 40px; display:grid; gap:16px; }
@media (min-width:1000px) { .print-largo { grid-template-columns:260px 1fr; gap:32px; align-items:center; } }
.print-largo figcaption { display:flex; flex-direction:column; gap:8px; }
.print-largo figcaption b { font-size:15px; font-weight:600; }
.print-largo figcaption span { font-size:14px; color:var(--text-2); }
.print-solto { border-radius:var(--r-janela); overflow:hidden; box-shadow:var(--sombra-print); background:#fff; }
.etapas { list-style:none; margin:0; padding:0; counter-reset:etapa; display:grid; gap:0 24px; }
@media (min-width:640px) { .etapas { grid-template-columns:repeat(2, 1fr); } }
@media (min-width:1000px) { .etapas { grid-template-columns:repeat(5, 1fr); } }
.etapas li { counter-increment:etapa; display:flex; flex-direction:column; gap:6px; padding:18px 0; border-top:2px solid var(--text); }
.etapas li::before { content:counter(etapa, decimal-leading-zero); font-family:var(--mono); font-size:12px; color:var(--muted); }
.etapas b { font-size:17px; font-weight:600; }
.etapas span { font-size:14px; color:var(--text-2); }
.principios { margin-top:40px; display:grid; gap:12px; }
@media (min-width:768px) { .principios { grid-template-columns:repeat(3, 1fr); } }
.principios p { font-size:15px; color:var(--text-2); padding-left:14px; border-left:2px solid var(--sep-head); }
.principios b { color:var(--text); }

/* pesquisa aberta */
.pesquisa { background:var(--sidebar); }
.compromissos { display:grid; gap:14px; }
@media (min-width:768px) { .compromissos { grid-template-columns:repeat(3, 1fr); } }
.compromissos article { background:var(--surface); border-radius:var(--r-janela); box-shadow:var(--sombra-cartao); padding:24px; display:flex; flex-direction:column; gap:8px; }
.compromissos h3 { font-size:18px; letter-spacing:-.01em; }
.compromissos p { font-size:15px; color:var(--text-2); }

/* Tyeté: print de verificação ao lado dos argumentos */
.tyete-grade { display:grid; gap:28px; }
@media (min-width:1000px) { .tyete-grade { grid-template-columns:1.15fr 1fr; gap:48px; align-items:center; } }
.tyete-grade figure { margin:0; }
.lista-args { display:grid; gap:0; }
.lista-args div { padding:16px 0; border-top:1px solid var(--sep-head); display:flex; flex-direction:column; gap:6px; }
.lista-args h3 { font-size:17px; letter-spacing:-.01em; }
.lista-args p { font-size:15px; color:var(--text-2); }

/* formas de acompanhar */
.formas { display:grid; gap:24px 20px; }
@media (min-width:640px) { .formas { grid-template-columns:repeat(2, 1fr); } }
@media (min-width:1000px) { .formas { grid-template-columns:repeat(4, 1fr); } }
.formas article { border-top:2px solid var(--text); padding-top:16px; display:flex; flex-direction:column; gap:8px; }
.formas h3 { font-size:18px; }
.formas p { font-size:15px; color:var(--text-2); }
.proximos { margin-top:36px; font-size:15px; color:var(--text-2); }

/* a maitaca em traço, repetida pela página (fecho grande, rodapé pequeno) */
.ave path { stroke:currentColor; } .ave circle { fill:currentColor; }
.fecho-grade { display:grid; gap:24px; align-items:center; }
/* o bando do fecho: maitaca não anda sozinha, anda em bando e faz barulho */
.bando { position:relative; width:220px; height:150px; color:var(--on-accent); }
.bando .ave { position:absolute; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.bando .ave path { stroke:currentColor; } .bando .ave circle { fill:currentColor; stroke:none; }
.bando .a1 { width:92px; left:0; top:44px; }
.bando .a2 { width:84px; left:96px; top:58px; }
.bando .a3 { width:58px; left:52px; top:0; opacity:.8; }
.bando .a4 { width:52px; left:150px; top:6px; opacity:.7; }
.bando .a5 { width:44px; left:178px; top:96px; opacity:.6; }
@media (min-width:900px) {
  .fecho-grade { grid-template-columns:1fr auto; gap:56px; }
  .bando { order:2; width:320px; height:230px; }
  .bando .a1 { width:140px; left:0; top:70px; }
  .bando .a2 { width:126px; left:146px; top:90px; }
  .bando .a3 { width:86px; left:78px; top:0; }
  .bando .a4 { width:76px; left:226px; top:10px; }
  .bando .a5 { width:64px; left:262px; top:160px; }
}
@media (prefers-reduced-motion: no-preference) {
  .bando .ave { animation:balanca 3.2s ease-in-out infinite; transform-origin:50% 90%; }
  .bando .a2 { animation-delay:-.8s; animation-duration:2.7s; }
  .bando .a3 { animation-delay:-1.6s; animation-duration:3.6s; }
  .bando .a4 { animation-delay:-.4s; animation-duration:2.9s; }
  .bando .a5 { animation-delay:-2.1s; animation-duration:2.4s; }
}
@keyframes balanca { 0%, 100% { transform:rotate(0) translateY(0); } 30% { transform:rotate(-5deg) translateY(-3px); } 60% { transform:rotate(3deg) translateY(0); } }
.rodape-marca { flex-basis:100%; display:inline-flex; justify-content:center; align-items:center; gap:8px; margin-bottom:6px;
  font-size:17px; font-weight:600; color:var(--text); letter-spacing:-.02em; }
.rodape-marca svg { width:26px; height:26px; }

/* fechamento */
.fecho { text-align:left; }
.fecho .titulo { max-width:820px; }
.fecho .botao.primario { background:var(--on-accent); color:var(--accent); }

/* contato */
.contato { display:grid; gap:32px; }
@media (min-width:900px) { .contato { grid-template-columns:1fr 1.3fr; gap:56px; } }
.contato-texto { display:flex; flex-direction:column; gap:14px; }
.contato-texto p { color:var(--text-2); }
.email { font-weight:600; font-size:17px; overflow-wrap:anywhere; }
form { display:flex; flex-direction:column; gap:16px; }
.campo { display:flex; flex-direction:column; gap:6px; }
.campo label { font-size:14px; font-weight:600; }
.campo small { font-size:13px; color:var(--muted); font-weight:400; }
.campo input, .campo select, .campo textarea { background:var(--surface); border:0; box-shadow:var(--input-ring); border-radius:var(--r-item);
  min-height:44px; padding:10px 12px; font-size:16px; width:100%; }
.campo textarea { min-height:140px; resize:vertical; line-height:1.5; }
.campo input:focus-visible, .campo select:focus-visible, .campo textarea:focus-visible { outline:none; box-shadow:var(--input-ring-foco); }
.campo input[aria-invalid="true"], .campo textarea[aria-invalid="true"] { box-shadow:0 0 0 2px var(--err); }
.duplo { display:grid; gap:16px; }
@media (min-width:640px) { .duplo { grid-template-columns:1fr 1fr; } }
.armadilha { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.aviso-lgpd { background:var(--sidebar); border-radius:var(--r-item); padding:14px 16px; font-size:14px; color:var(--text-2); }
.aviso-lgpd b { color:var(--text); }
.concordo { display:flex; gap:10px; align-items:flex-start; font-size:14px; color:var(--text-2); cursor:pointer; }
.concordo input { accent-color:var(--accent); width:20px; height:20px; margin:1px 0 0; flex:none; }
.estado { font-size:15px; min-height:1.5em; }
.estado.ok { color:var(--ok); } .estado.err { color:var(--err); }
.estado:empty { display:none; }
form .botao { align-self:flex-start; min-width:180px; }
form .botao:disabled { opacity:.45; cursor:wait; }

/* caixa de imagem (lightbox) */
img[data-ampliar] { cursor:zoom-in; }
img[data-ampliar]:focus-visible { outline:2px solid var(--accent); outline-offset:-4px; }
.caixa { border:0; padding:0; background:transparent; max-width:min(1200px, calc(100vw - 32px)); max-height:calc(100vh - 32px); overflow:visible; color:var(--text); }
.caixa::backdrop { background:rgba(10,10,12,.78); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.caixa figure { margin:0; background:var(--surface); border-radius:var(--r-janela); overflow:hidden; box-shadow:var(--sombra-print); }
.caixa img { width:100%; max-height:calc(100vh - 200px); object-fit:contain; background:#fff; }
.caixa figcaption { padding:16px 20px 20px; font-size:16px; line-height:1.5; color:var(--text-2); max-width:760px; }
.caixa-fechar { position:absolute; top:-14px; right:-10px; z-index:1; width:44px; height:44px; border-radius:50%; border:0; cursor:pointer;
  background:var(--surface); color:var(--text); font-size:18px; box-shadow:var(--sombra-cartao-hover); }
@media (max-width:640px) { .caixa-fechar { top:8px; right:8px; } }
@media (prefers-reduced-motion: no-preference) { .caixa[open] { animation:caixa-abre .25s ease-out; } }
@keyframes caixa-abre { from { opacity:0; transform:scale(.97); } to { opacity:1; transform:none; } }

/* rodapé */
/* assuntos do formulário: caixinhas em forma de pílula, vários de uma vez */
fieldset.assuntos { border:0; padding:0; margin:0; min-width:0; }
fieldset.assuntos legend { font-size:14px; font-weight:600; padding:0; margin-bottom:8px; }
.chips { display:flex; flex-wrap:wrap; gap:8px; }
.chip { position:relative; cursor:pointer; }
.chip input { position:absolute; opacity:0; width:1px; height:1px; }
.chip span { display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:0 14px; border-radius:var(--r-pilula);
  background:var(--surface); box-shadow:var(--input-ring); font-size:14px; color:var(--text-2); }
.chip span::before { content:"+"; font-weight:600; color:var(--muted); }
.chip input:checked + span { background:var(--accent); color:var(--on-accent); box-shadow:none; }
.chip input:checked + span::before { content:"✓"; color:var(--on-accent); }
.chip input:focus-visible + span { outline:2px solid var(--accent); outline-offset:2px; }

/* faixa viva no fim da página: mata, água, céu, sol e terra, correndo devagar (para com "reduzir movimento") */
.faixa-viva { height:6px; background:linear-gradient(90deg, #2E7D5B, #3C8DBC, #7FB8D8, #E0A33A, #B5643C, #2E7D5B) 0 0 / 200% 100%; }
@media (prefers-reduced-motion: no-preference) {
  .faixa-viva { animation:faixa-corre 18s linear infinite; }
  .coracao { display:inline-block; animation:pulsa 2.4s ease-in-out infinite; }
}
@keyframes faixa-corre { to { background-position:-200% 0; } }
@keyframes pulsa { 0%, 100% { transform:scale(1); } 12% { transform:scale(1.22); } 24% { transform:scale(1); } 36% { transform:scale(1.14); } 48% { transform:scale(1); } }

/* rodapé centralizado: uma coisa por linha, todas no eixo do meio */
.rodape { padding:40px 0 48px; font-size:14px; color:var(--muted); border-top:1px solid var(--sep-head); text-align:center; }
.rodape-fim { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px 20px; }
/* créditos discretos, numa linha pequena no fim (pedido da mantenedora) */
/* Direitos da Natureza: discreto, mas claro */
.natureza { margin:16px auto 0; font-size:13px; color:var(--text-2); max-width:620px; }
.natureza b { color:var(--text); font-weight:600; }
.natureza svg { display:inline-block; width:15px; height:15px; vertical-align:-2px; margin-right:6px; fill:none; stroke:var(--text); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
/* assinatura da mantenedora */
.assinatura { margin-top:10px; font-size:12px; color:var(--muted); }
.coracao { color:#B3261E; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .coracao { color:#FF7A70; } }
:root[data-theme="dark"] .coracao { color:#FF7A70; }
.creditos { margin-top:14px; font-size:12px; color:var(--muted); }
.creditos a { color:var(--muted); }