/* DESPERTA — site institucional.
   Visual: noite chuvosa vista por um vidro (assets/fundo-chuva*.webp, a
   imagem escolhida pela dona do projeto; tools/site/gerar_fundo.py gera
   uma alternativa própria), cartões de vidro escuro, detalhes em
   verde-água e rótulos espaçados, como no app.
   Sem fontes, scripts ou imagens de terceiros: nada é carregado de fora. */

@font-face { font-family: "Manrope"; font-weight: 200; font-display: swap; src: url("fonts/Manrope-200.ttf") format("truetype"); }
@font-face { font-family: "Manrope"; font-weight: 300; font-display: swap; src: url("fonts/Manrope-300.ttf") format("truetype"); }
@font-face { font-family: "Manrope"; font-weight: 400; font-display: swap; src: url("fonts/Manrope-400.ttf") format("truetype"); }
@font-face { font-family: "Manrope"; font-weight: 600; font-display: swap; src: url("fonts/Manrope-600.ttf") format("truetype"); }
@font-face { font-family: "Oswald"; font-weight: 300; font-display: swap; src: url("fonts/Oswald-300.ttf") format("truetype"); }
@font-face { font-family: "Oswald"; font-weight: 400; font-display: swap; src: url("fonts/Oswald-400.ttf") format("truetype"); }

:root {
  --bg: #060b0e;
  --text: #eef3f4;
  --text-2: #b9c4c8;
  --text-3: #85939a;
  --accent: #5fd6d8;
  --accent-bright: #8fe9ea;
  --accent-soft: rgba(95, 214, 216, 0.14);
  --accent-line: rgba(95, 214, 216, 0.38);
  --warning: #e8b45a;
  --success: #6fd09a;
  --glass: rgba(13, 21, 25, 0.62);
  --glass-strong: rgba(9, 15, 18, 0.80);
  --glass-hi: rgba(255, 255, 255, 0.06);
  --line: rgba(255, 255, 255, 0.09);
  --line-2: rgba(255, 255, 255, 0.16);
  --radius: 22px;
  --radius-sm: 16px;
  --shadow: 0 30px 70px rgba(0, 0, 0, 0.45);
  --gutter: clamp(16px, 4vw, 48px);
  --max: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: dark; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; background: var(--bg); scroll-padding-top: 92px; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 400;
  line-height: 1.6;
  overflow-x: hidden;
}
/* fundo fixo: vidro com chuva + véu escuro para dar leitura ao texto */
body::before, body::after { content: ""; position: fixed; inset: 0; pointer-events: none; }
body::before {
  z-index: -2;
  background: var(--bg) url("fundo-chuva-1280.webp") center / cover no-repeat;
}
body::after {
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(5, 9, 11, 0.80) 0%, rgba(5, 9, 11, 0.42) 52%, rgba(5, 9, 11, 0.22) 100%),
    linear-gradient(180deg, rgba(5, 9, 11, 0.05) 0%, rgba(5, 9, 11, 0.55) 62%, rgba(5, 9, 11, 0.88) 100%);
}
@media (min-width: 1300px) { body::before { background-image: url("fundo-chuva.webp"); } }
body.texto::after { background: linear-gradient(180deg, rgba(5, 9, 11, 0.70), rgba(5, 9, 11, 0.86)); }

img { max-width: 100%; height: auto; display: block; }
a { color: var(--accent-bright); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: #fff; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 8px; }
svg { flex: none; }
/* ícones do arquivo assets/icones.svg */
.i { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.i.cheio { fill: currentColor; stroke: none; }
.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── Cabeçalho ── */
.topo {
  position: sticky; top: 0; z-index: 20;
  background: linear-gradient(180deg, rgba(6, 11, 14, 0.82), rgba(6, 11, 14, 0.55));
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid var(--line);
}
.topo .wrap { display: flex; align-items: center; justify-content: space-between; gap: 14px 24px; min-height: 76px; }
.marca { display: inline-flex; align-items: center; gap: 16px; color: var(--text); text-decoration: none; }
.marca img { width: 44px; height: 44px; border-radius: 12px; box-shadow: 0 0 0 1px var(--line-2), 0 8px 24px rgba(95, 214, 216, 0.22); }
.marca span { letter-spacing: 0.55em; font-size: 15px; font-weight: 600; }
.nav { display: flex; gap: 4px; }
.nav a {
  color: var(--text-2); text-decoration: none; font-size: 15px; white-space: nowrap;
  padding: 9px 18px; border-radius: 999px; border: 1px solid transparent;
}
.nav a:hover { color: var(--text); background: var(--glass-hi); }
.nav a[aria-current="page"] { color: #e7fbfb; border-color: var(--accent-line); background: var(--accent-soft); box-shadow: 0 0 22px rgba(95, 214, 216, 0.12) inset; }
.status-app {
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none; white-space: nowrap;
  color: var(--text); font-size: 15px; padding: 10px 18px; border-radius: 14px;
  border: 1px solid var(--accent-line); background: linear-gradient(135deg, rgba(95, 214, 216, 0.16), rgba(95, 214, 216, 0.04));
}
.status-app svg { width: 18px; height: 18px; color: var(--accent-bright); }
.status-app:hover { color: #fff; border-color: var(--accent); }

/* ── Tipografia ── */
.rotulo { display: inline-block; letter-spacing: 0.42em; text-transform: uppercase; font-size: 12px; color: var(--text-2); font-weight: 600; }
.rotulo.acento { color: var(--accent); }
h1, h2, h3 { margin: 0; line-height: 1.12; letter-spacing: -0.01em; }
h1 { font-weight: 300; font-size: clamp(38px, 4.3vw, 62px); }
h2 { font-weight: 400; font-size: clamp(26px, 3vw, 34px); }
h3 { font-weight: 600; font-size: 17px; letter-spacing: 0; }
p { margin: 0 0 1em; color: var(--text-2); }
.realce { color: var(--accent); }
.linha { height: 2px; width: 140px; margin: 18px 0; background: linear-gradient(90deg, transparent, var(--accent), transparent); }
.meta { color: var(--text-3); font-size: 14px; }

/* ── Botões ── */
.botoes { display: flex; flex-wrap: wrap; gap: 14px; margin: 30px 0 22px; }
.botao {
  display: inline-flex; align-items: center; gap: 12px; text-decoration: none;
  font-size: 16px; padding: 15px 22px; border-radius: 16px; color: var(--text);
  border: 1px solid var(--line-2); background: rgba(14, 22, 26, 0.55);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.botao svg { width: 20px; height: 20px; }
.botao:hover { color: #fff; border-color: rgba(255, 255, 255, 0.32); }
.botao.cheio {
  color: #04191b; font-weight: 600; border-color: rgba(143, 233, 234, 0.6);
  background: linear-gradient(180deg, #7ee3e3, #3fb8bf);
  box-shadow: 0 10px 30px rgba(63, 184, 191, 0.35), 0 1px 0 rgba(255, 255, 255, 0.45) inset;
}
.botao.cheio:hover { color: #000; background: linear-gradient(180deg, #96ecec, #4cc5cb); }
.checks { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; padding: 0; list-style: none; color: var(--text-2); font-size: 15px; }
.checks li { display: inline-flex; align-items: center; gap: 9px; }
.checks svg { width: 18px; height: 18px; color: var(--accent); }

/* ── Herói ── */
.heroi { padding: clamp(40px, 7vw, 90px) 0 clamp(30px, 5vw, 60px); }
.heroi .grade { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.heroi h1 { margin: 18px 0 22px; }
.heroi .intro { font-size: clamp(17px, 1.5vw, 20px); color: var(--text-2); max-width: 600px; }
.heroi.recursos h1 { font-weight: 600; font-size: clamp(36px, 4vw, 58px); }

/* ── Ilustração das telas (HTML e CSS, dados de exemplo) ──
   Tudo em "em": o tamanho da letra do contêiner escala a ilustração. */
.vitrine { position: relative; width: 72em; font-size: clamp(6.5px, 0.62vw, 10.5px); min-height: 44em; }
.vitrine figcaption { position: absolute; left: 0; bottom: -2.6em; font-size: 12px; color: var(--text-3); }
.pc {
  position: absolute; left: 0; top: 3em; width: 56em; height: 40em;
  border-radius: 1.8em; overflow: hidden; display: grid; grid-template-columns: 12em 1fr;
  background: linear-gradient(160deg, rgba(20, 30, 35, 0.94), rgba(8, 13, 16, 0.96));
  border: 1px solid var(--line-2);
  box-shadow: 0 40px 90px rgba(0, 0, 0, 0.6), 0 0 0 0.5em rgba(10, 14, 16, 0.85);
  transform: perspective(160em) rotateY(-9deg) rotateX(3deg);
  transform-origin: left center;
}
.vitrine.so-pc .pc { position: relative; top: 0; transform: perspective(160em) rotateY(-6deg); }
.vitrine.so-pc { min-height: 0; width: 60em; font-size: clamp(7px, 0.8vw, 11px); }
.pc-lado { padding: 1.8em 1em; border-right: 1px solid var(--line); background: rgba(0, 0, 0, 0.18); }
.pc-avatar { width: 5.6em; height: 5.6em; margin: 0 auto 1em; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line-2); background: radial-gradient(circle at 50% 70%, rgba(95, 214, 216, 0.35), rgba(13, 21, 25, 0.9) 70%); }
.pc-avatar img { width: 3.6em; height: 3.6em; border-radius: 0.8em; }
.pc-nome { text-align: center; letter-spacing: 0.4em; font-size: 0.95em; font-weight: 600; }
.pc-lema { text-align: center; font-size: 0.8em; color: var(--text-3); margin-bottom: 1.4em; }
.pc-menu { list-style: none; margin: 0; padding: 0; font-size: 1.02em; }
.pc-menu li { display: flex; align-items: center; gap: 0.7em; white-space: nowrap; padding: 0.5em 0.7em; border-radius: 0.8em; color: var(--text-2); }
.pc-menu li.ativo { color: var(--text); background: var(--accent-soft); border: 1px solid var(--accent-line); }
.pc-menu svg { width: 1.2em; height: 1.2em; }
.pc-menu.baixo { margin-top: 1.6em; }
.pc-main { padding: 2em 2.2em; min-width: 0; }
.pc-rot { letter-spacing: 0.35em; font-size: 0.85em; color: var(--text-2); font-weight: 600; }
.pc-titulo { font-size: 2.6em; font-weight: 400; line-height: 1.15; }
.pc-data { letter-spacing: 0.3em; font-size: 0.85em; color: var(--text-2); margin-bottom: 1.2em; }
.pc-acoes { display: flex; flex-wrap: wrap; gap: 0.6em; margin-bottom: 1.4em; }
.pc-acoes span { display: inline-flex; align-items: center; gap: 0.5em; font-size: 1em; padding: 0.45em 0.9em; border-radius: 0.7em; border: 1px solid var(--line-2); background: rgba(255, 255, 255, 0.04); color: var(--text-2); }
.pc-acoes svg { width: 1.1em; height: 1.1em; }
.pc-grade { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1em; }
.pc-card { border: 1px solid var(--line); border-radius: 1.1em; background: rgba(255, 255, 255, 0.035); padding: 1.1em 1.2em; }
.pc-card .pc-rot { font-size: 0.78em; display: flex; justify-content: space-between; }
.pc-agenda { grid-row: span 2; }
.pc-agenda ol { list-style: none; margin: 0.8em 0 0; padding: 0; font-size: 1em; }
.pc-agenda li { display: grid; grid-template-columns: 3.4em 0.8em 1fr; gap: 0.6em; align-items: start; padding: 0.5em 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04); color: var(--text-2); }
.pc-agenda time { color: var(--text-3); }
.pc-agenda i { width: 0.7em; height: 0.7em; border-radius: 50%; margin-top: 0.45em; }
.pc-agenda strong { color: var(--text); font-weight: 400; }
.c1 { background: #5fd6d8; } .c2 { background: #e8b45a; } .c3 { background: #9b8cf0; } .c4 { background: #6fd09a; } .c5 { background: #ef7b6b; }
.pc-hora { font-size: 3em; font-weight: 300; line-height: 1.1; margin-top: 0.15em; }
.pc-sub { font-size: 0.95em; color: var(--text-3); }
.pc-foco { display: flex; align-items: center; gap: 1em; margin-top: 0.4em; }
.pc-foco .pc-hora { font-size: 2.8em; }
.pc-anel { width: 3.6em; height: 3.6em; border-radius: 50%; border: 0.25em solid var(--accent-line); border-top-color: var(--accent); display: grid; place-items: center; color: var(--accent-bright); }
.pc-anel svg { width: 1.5em; height: 1.5em; }
.pc-botao { display: inline-block; margin-top: 0.6em; font-size: 0.95em; padding: 0.4em 1.1em; border-radius: 0.6em; color: #04191b; background: linear-gradient(180deg, #7ee3e3, #3fb8bf); }

.cel {
  position: absolute; right: 0; top: 0; width: 18.5em; height: 37em; border-radius: 3em; padding: 0.9em;
  background: linear-gradient(160deg, #1b252a, #0b1012); border: 1px solid var(--line-2);
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.6);
  transform: perspective(140em) rotateY(-14deg) rotateZ(4deg);
}
.cel-tela { height: 100%; border-radius: 2.3em; overflow: hidden; display: flex; flex-direction: column; background: linear-gradient(180deg, rgba(16, 26, 31, 0.98), rgba(7, 11, 13, 0.98)); border: 1px solid var(--line); }
.cel-barra { display: flex; justify-content: space-between; padding: 0.9em 1.6em 0.2em; font-size: 1em; color: var(--text-2); }
.cel-topo { display: flex; align-items: center; gap: 0.8em; padding: 0.4em 1.4em; letter-spacing: 0.35em; font-size: 1em; font-weight: 600; }
.cel-topo img { width: 2.2em; height: 2.2em; border-radius: 0.6em; }
.cel-corpo { padding: 0.4em 1.2em; flex: 1; overflow: hidden; }
.cel-corpo .pc-titulo { font-size: 1.9em; }
.cel-corpo .pc-data { letter-spacing: 0.1em; margin-bottom: 1em; }
.cel-item { display: flex; align-items: center; gap: 0.9em; padding: 0.65em 0.9em; margin-bottom: 0.5em; border-radius: 1.1em; border: 1px solid var(--line); background: rgba(255, 255, 255, 0.04); }
.cel-item svg { width: 1.6em; height: 1.6em; color: var(--accent-bright); }
.cel-item b { display: block; font-weight: 600; font-size: 1.05em; line-height: 1.3; }
.cel-item small { display: block; color: var(--text-3); font-size: 0.88em; line-height: 1.3; }
.cel-nav { display: flex; justify-content: space-around; padding: 0.7em 0.4em 1em; border-top: 1px solid var(--line); font-size: 0.85em; color: var(--text-3); }
.cel-nav span { display: grid; justify-items: center; gap: 0.3em; }
.cel-nav span.ativo { color: var(--accent-bright); }
.cel-nav svg { width: 1.7em; height: 1.7em; }

/* ── Painéis e cartões ── */
section { padding: clamp(18px, 3vw, 34px) 0; }
.painel {
  background: var(--glass); border: 1px solid var(--line); border-radius: var(--radius);
  padding: clamp(22px, 3vw, 36px); box-shadow: var(--shadow);
  backdrop-filter: blur(16px) saturate(130%); -webkit-backdrop-filter: blur(16px) saturate(130%);
}
.cab { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 30px; margin-bottom: 24px; }
.cab h2 { margin-top: 8px; }
.cab p { margin: 8px 0 0; }
.cab .mais { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; font-size: 16px; color: var(--accent-bright); }
.cab .mais svg { width: 18px; height: 18px; }
.legenda { max-width: 560px; font-size: 15px; margin: 0; }
.subgrupo { margin: 26px 0 12px; }

.cartoes { display: grid; gap: 14px; }
.cartoes.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cartoes.seis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cartao {
  display: flex; gap: 16px; align-items: flex-start; padding: 20px;
  border-radius: var(--radius-sm); border: 1px solid var(--line);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015));
}
.cartao h3 { margin: 2px 0 6px; }
.cartao p { font-size: 15px; margin: 0; line-height: 1.5; }
.icone {
  flex: none; width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center;
  border: 1px solid var(--accent-line); color: var(--accent-bright);
  background: linear-gradient(145deg, rgba(95, 214, 216, 0.22), rgba(95, 214, 216, 0.05));
  box-shadow: 0 0 24px rgba(95, 214, 216, 0.12);
}
.icone svg { width: 24px; height: 24px; }
.selos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.selo { display: inline-block; font-size: 12px; line-height: 1.3; letter-spacing: 0.04em; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line-2); color: var(--text-2); }
.selo.ok { color: var(--success); border-color: rgba(111, 208, 154, 0.5); background: rgba(111, 208, 154, 0.07); }
.selo.teste { color: var(--warning); border-color: rgba(232, 180, 90, 0.5); background: rgba(232, 180, 90, 0.07); }
.selo.breve { color: var(--text-3); }

/* cartões de destaque com seta (início) */
.destaques { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.destaques a { text-decoration: none; color: inherit; }
.destaques .cartao { height: 100%; align-items: center; background: var(--glass); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.destaques .cartao:hover { border-color: var(--accent-line); }
.destaques .seta { margin-left: auto; width: 20px; height: 20px; color: var(--text-2); }

/* cartões com botão à direita (privacidade clara) */
.cartao .acao { margin-left: auto; align-self: center; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; text-decoration: none; color: var(--text); font-size: 14px; padding: 9px 14px; border-radius: 12px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, 0.04); }
.cartao .acao svg { width: 16px; height: 16px; }
.cartao .acao:hover { border-color: var(--accent-line); }
.cartao.com-acao { flex-wrap: wrap; }
.cartao.com-acao > div { flex: 1 1 210px; }
.cartao.com-acao .acao { margin-left: 66px; }

/* plataformas */
.plataformas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.plataforma { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: var(--radius-sm); border: 1px solid var(--line); background: rgba(255, 255, 255, 0.035); }
.plataforma b { display: block; font-weight: 600; font-size: 17px; }
.plataforma small { display: block; color: var(--text-3); font-size: 13px; line-height: 1.4; }
.plataforma .estado-p { margin-left: auto; display: grid; justify-items: center; gap: 4px; color: var(--warning); font-size: 12px; text-align: center; white-space: nowrap; }
.plataforma .estado-p span { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; border: 1px solid rgba(232, 180, 90, 0.45); background: rgba(232, 180, 90, 0.08); }
.plataforma .estado-p svg { width: 20px; height: 20px; }

.duas { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lista { margin: 0; padding: 0; list-style: none; }
.lista li { position: relative; padding-left: 22px; margin: 10px 0; color: var(--text-2); }
.lista li::before { content: ""; position: absolute; left: 0; top: 0.65em; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px rgba(95, 214, 216, 0.6); }
.aviso { padding: 16px 20px; border-radius: var(--radius-sm); border: 1px solid rgba(232, 180, 90, 0.45); background: rgba(232, 180, 90, 0.08); color: var(--text); margin: 20px 0 0; }
.destaque { padding: 18px 22px; border-radius: var(--radius-sm); border: 1px solid var(--accent-line); background: rgba(95, 214, 216, 0.07); margin: 20px 0; }

/* ── Páginas de texto (política, dados, termos, suporte) ── */
.documento { padding: clamp(30px, 6vw, 70px) 0; }
.vidro {
  position: relative; background: var(--glass-strong); border: 1px solid var(--line-2); border-radius: var(--radius);
  box-shadow: var(--shadow); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
.documento .folha { padding: clamp(24px, 5vw, 56px); max-width: 900px; margin: 0 auto; }
.documento h1 { font-size: clamp(32px, 5vw, 50px); margin-top: 10px; }
.documento h2 { font-size: clamp(22px, 3vw, 28px); margin: 40px 0 12px; }
.documento h3 { margin: 24px 0 8px; font-size: 18px; }
.documento p, .documento li { color: var(--text-2); }
.documento ul, .documento ol { padding-left: 22px; }
.documento li { margin: 6px 0; }
.documento strong { color: var(--text); font-weight: 600; }
.sumario { padding: 18px 22px; margin: 26px 0; background: rgba(255, 255, 255, 0.03); box-shadow: none; }
.sumario ol { margin: 8px 0 0; }
table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 15px; }
th, td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--line); color: var(--text-2); }
th { color: var(--text); font-weight: 600; }
.tabela { overflow-x: auto; }

/* ── Rodapé ── */
.rodape { margin-top: clamp(30px, 5vw, 60px); border-top: 1px solid var(--line); background: rgba(5, 9, 11, 0.72); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.rodape .wrap { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px 40px; padding-top: 26px; padding-bottom: 26px; }
.rodape .marca img { width: 40px; height: 40px; }
.rodape .marca span { font-size: 14px; }
.rodape .lema-r { color: var(--text-2); font-size: 14px; margin: 2px 0 0; }
.rodape nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 22px; }
.rodape nav a { color: var(--text-2); text-decoration: none; font-size: 14px; }
.rodape nav a:hover { color: var(--text); }
.contato { display: flex; align-items: center; gap: 14px; font-size: 14px; }
.contato svg { width: 22px; height: 22px; color: var(--text-2); }
.contato p { margin: 0; color: var(--text-2); line-height: 1.5; }
.contato a { color: var(--text); text-decoration: none; }
.contato a:hover { color: var(--accent-bright); }
.rodape .fim { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--text-3); font-size: 13px; }
.rodape .fim p { margin: 0; color: var(--text-3); }

/* ── Telas menores ── */
@media (max-width: 1020px) {
  .heroi .grade { grid-template-columns: 1fr; }
  .vitrine { font-size: calc((100vw - 2 * var(--gutter)) / 72); }
  .vitrine.so-pc { font-size: calc((100vw - 2 * var(--gutter)) / 61); }
  .cartoes.tres, .cartoes.seis, .destaques, .plataformas { grid-template-columns: 1fr 1fr; }
  .rodape .wrap { grid-template-columns: 1fr; justify-items: start; }
  .rodape nav { justify-content: flex-start; }
}
@media (max-width: 860px) {
  html { scroll-padding-top: 16px; }
  .topo { position: static; }
  .topo .wrap { flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
  .nav { order: 3; width: 100%; overflow-x: auto; padding-bottom: 4px; }
  .duas { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .marca span { letter-spacing: 0.4em; font-size: 14px; }
  .status-app { padding: 8px 12px; font-size: 14px; }
  .cartoes.tres, .cartoes.seis, .destaques, .plataformas { grid-template-columns: 1fr; }
  .botao { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print {
  body::before, body::after, .topo, .rodape nav, .vitrine { display: none; }
  body { background: #fff; color: #000; }
  .vidro, .painel { box-shadow: none; border: 1px solid #ccc; background: #fff; }
  p, li, td, th { color: #000 !important; }
}

/* utilitários (sem estilos inline: a política de segurança do site bloqueia) */
.mt-s { margin-top: 10px; }
.mt-m { margin-top: 16px; }
.m0 { margin: 0; }