/* =========================================================
   MACGOV, folha de estilo única
   Marca: brand-guide.pdf (#191935, #fcc01c, #a7b4c7, Ubuntu)
   Tema escuro por padrão, claro por preferência ou botão.
   ========================================================= */

/* ---------- 1. Tokens ---------- */
:root {
  /* cores da marca, valores oficiais */
  --marinho: #191935;
  --ambar:   #fcc01c;
  --nevoa:   #a7b4c7;
  --areia:   #c7bba7;

  /* tema escuro, padrão */
  --bg:      #141430;
  --sup:     #1e1e3f;
  --sup-2:   #262650;
  --linha:   #30305c;
  --txt:     #ffffff;
  --txt-2:   #a7b4c7;
  --ac:      var(--ambar);
  --ac-txt:  var(--ambar);        /* âmbar legível como texto */
  --ac-sob:  var(--marinho);      /* texto sobre o âmbar */
  --sombra:  0 18px 48px rgb(8 8 24 / .45);
  --chip:    #ffffff;             /* fundo das logos de clientes */

  /* geometria, um só sistema */
  --r:       14px;
  --r-p:     999px;
  --cab-h:   68px;

  /* ritmo */
  --secao:   clamp(4.5rem, 9vw, 7.5rem);
  --gap:     clamp(1.5rem, 3vw, 2.75rem);

  --ease:    cubic-bezier(.16,1,.3,1);
}

@media (prefers-color-scheme: light) {
  :root:not([data-tema="escuro"]) {
    --bg:     #f6f7fb;
    --sup:    #ffffff;
    --sup-2:  #eef1f7;
    --linha:  #dfe4ee;
    --txt:    #191935;
    --txt-2:  #4b5570;
    --ac-txt: #7a5600;            /* âmbar escurecido, AA sobre claro */
    --sombra: 0 16px 40px rgb(25 25 53 / .10);
    --chip:   #ffffff;
  }
}
:root[data-tema="claro"] {
  --bg:     #f6f7fb;
  --sup:    #ffffff;
  --sup-2:  #eef1f7;
  --linha:  #dfe4ee;
  --txt:    #191935;
  --txt-2:  #4b5570;
  --ac-txt: #7a5600;
  --sombra: 0 16px 40px rgb(25 25 53 / .10);
  --chip:   #ffffff;
}

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--cab-h) + 16px); -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  background: var(--bg);
  color: var(--txt);
  font: 400 clamp(1rem, .97rem + .18vw, 1.0625rem)/1.65 Ubuntu, system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, svg, picture { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
ul { list-style: none; padding: 0; }
button, input, select, textarea { font: inherit; color: inherit; }

h1, h2, h3 { line-height: 1.15; letter-spacing: -.02em; font-weight: 700; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--ac);
  outline-offset: 3px;
  border-radius: 4px;
}

.skip {
  position: absolute; left: 12px; top: -100px; z-index: 100;
  background: var(--ac); color: var(--ac-sob);
  padding: .75rem 1.25rem; border-radius: var(--r-p); font-weight: 700;
  transition: top .2s var(--ease);
}
.skip:focus { top: 12px; }

.wrap { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2rem); }
.wrap--estreito { max-width: 820px; }

.ico { width: 1.25em; height: 1.25em; flex: none; }

/* ---------- 3. Tipografia de seção ---------- */
.olho {
  display: inline-block;
  font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ac-txt);
  border: 1px solid color-mix(in srgb, var(--ac) 40%, transparent);
  border-radius: var(--r-p);
  padding: .4rem 1rem;
  margin-bottom: 1.25rem;
}
.tit { font-size: clamp(1.6rem, 1.1rem + 2.1vw, 2.4rem); max-width: 26ch; text-wrap: balance; }
.tit__sub { color: var(--txt-2); max-width: 62ch; margin-top: 1rem; }

/* ---------- 4. Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  white-space: nowrap;
  padding: .85rem 1.6rem;
  border: 1px solid transparent; border-radius: var(--r-p);
  font-weight: 700; text-decoration: none; cursor: pointer;
  transition: transform .18s var(--ease), background-color .18s var(--ease), border-color .18s var(--ease);
}
.btn--pri { background: var(--ac); color: var(--ac-sob); }
.btn--pri:hover { background: color-mix(in srgb, var(--ac) 88%, #fff); }
.btn--sec { background: transparent; color: var(--txt); border-color: var(--linha); }
.btn--sec:hover { border-color: var(--ac); background: color-mix(in srgb, var(--ac) 10%, transparent); }
.btn:active { transform: translateY(1px); }
.btn--bloco { width: 100%; padding-block: 1rem; }

.icobtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; flex: none;
  background: transparent; border: 1px solid var(--linha); border-radius: var(--r-p);
  cursor: pointer; transition: border-color .18s var(--ease);
}
.icobtn:hover { border-color: var(--ac); }
.icobtn .ico { width: 20px; height: 20px; }

/* ---------- 5. Cabeçalho ---------- */
.cab {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid transparent;
  transition: border-color .2s var(--ease);
}
.cab.rolou { border-bottom-color: var(--linha); }
@media (prefers-reduced-transparency: reduce) { .cab { background: var(--bg); backdrop-filter: none; } }

.cab__in { height: var(--cab-h); display: flex; align-items: center; gap: 1rem; }
.cab__marca { flex: none; display: block; }
.cab__logo { width: 154px; height: auto; }
:root[data-tema="claro"] .cab__logo--dark, :root[data-tema="escuro"] .cab__logo--light { display: none; }
:root:not([data-tema]) .cab__logo--light { display: none; }
@media (prefers-color-scheme: light) {
  :root:not([data-tema]) .cab__logo--light { display: block; }
  :root:not([data-tema]) .cab__logo--dark  { display: none; }
}

.cab__nav { margin-left: auto; display: flex; align-items: center; gap: clamp(.75rem, 1.8vw, 1.75rem); }
.cab__nav a { text-decoration: none; font-size: .95rem; font-weight: 500; color: var(--txt-2); transition: color .18s var(--ease); }
.cab__nav a:hover { color: var(--txt); }
.cab__entrar { color: var(--txt); padding: .6rem 1.1rem; font-size: .9rem; }
.cab__acoes { display: flex; align-items: center; gap: .5rem; }
.cab__hamb { display: none; }
.icobtn .ico--lua, .icobtn .ico--fechar { display: none; }
:root[data-tema="claro"] .ico--sol { display: none; }
:root[data-tema="claro"] .ico--lua { display: block; }
@media (prefers-color-scheme: light) {
  :root:not([data-tema]) .ico--sol { display: none; }
  :root:not([data-tema]) .ico--lua { display: block; }
}

@media (max-width: 920px) {
  .cab__hamb { display: inline-flex; }
  .cab__nav {
    position: fixed; inset: var(--cab-h) 0 auto 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--sup); border-bottom: 1px solid var(--linha);
    padding: .5rem clamp(1rem, 4vw, 2rem) 1.5rem;
    box-shadow: var(--sombra);
    display: none;
  }
  .cab__nav.aberto { display: flex; }
  .cab__nav a { padding: .9rem 0; border-bottom: 1px solid var(--linha); font-size: 1.05rem; }
  .cab__entrar { margin-top: 1rem; border: 1px solid var(--linha); text-align: center; justify-content: center; }
  .cab__hamb[aria-expanded="true"] .ico--abrir { display: none; }
  .cab__hamb[aria-expanded="true"] .ico--fechar { display: block; }
}

/* ---------- 6. Herói ----------
   A figura é recortada e integrada ao fundo, sem moldura, apoiada na base da
   seção. Os selos flutuam sobre a composição, como no panfleto. */
.heroi { position: relative; padding-top: clamp(1.5rem, 3vw, 2.5rem); overflow: hidden; }

.heroi__in {
  display: grid; gap: clamp(1.5rem, 3vw, 2.5rem);
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 900px) {
  .heroi__in { grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); align-items: end; }
  .heroi__txt { padding-bottom: clamp(3.5rem, 8vw, 6.5rem); align-self: center; }
}

.heroi__h1 { font-size: clamp(1.85rem, .95rem + 2.35vw, 2.6rem); text-wrap: balance; }
/* a quebra manual só ajuda quando há largura para duas linhas */
.heroi__h1 br { display: none; }
@media (min-width: 900px) { .heroi__h1 br { display: inline; } }
.heroi__h1 em { font-style: italic; color: var(--ac-txt); line-height: 1.1; display: inline-block; padding-bottom: .08em; }
.heroi__sub { color: var(--txt-2); font-size: clamp(1.03rem, 1rem + .35vw, 1.2rem); max-width: 46ch; margin-top: 1.25rem; }
.heroi__ctas { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2rem; }

.heroi__mid { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
/* o <picture> não deve virar o item flex, senão a imagem não centraliza */
.heroi__mid picture { display: contents; }
/* halo âmbar por trás da figura, para ela não flutuar no vazio */
.heroi__mid::before {
  content: ""; position: absolute; z-index: 0;
  left: 50%; bottom: -6%; translate: -50% 0;
  width: min(135%, 680px); aspect-ratio: 1;
  background:
    radial-gradient(circle at 50% 56%,
      color-mix(in srgb, var(--ac) 34%, transparent) 0%,
      color-mix(in srgb, var(--ac) 12%, transparent) 34%,
      transparent 66%);
  filter: blur(6px);
  pointer-events: none;
}
.heroi__foto {
  position: relative; z-index: 1;
  width: min(78%, 330px); height: auto;      /* celular */
  filter: drop-shadow(0 24px 44px rgb(6 6 20 / .55));
}
@media (min-width: 900px) {
  .heroi__foto { width: auto; max-width: 100%; height: min(62vh, 560px); object-fit: contain; }
}

/* --- selos: no celular, lista normal; no desktop, flutuando --- */
.selos { display: grid; gap: .6rem; margin-top: 1.25rem; }
.selo {
  display: flex; align-items: flex-start; gap: .6rem;
  background: color-mix(in srgb, var(--sup) 86%, transparent);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--linha); border-radius: var(--r);
  padding: .75rem .9rem; font-size: .85rem; color: var(--txt-2); line-height: 1.4;
  box-shadow: 0 10px 26px rgb(6 6 20 / .28);
}
.selo b { color: var(--txt); font-weight: 700; }
.selo .ico { color: var(--ac-txt); margin-top: .1rem; }
@media (prefers-reduced-transparency: reduce) { .selo { background: var(--sup); backdrop-filter: none; } }

@media (min-width: 1000px) {
  .selos { position: absolute; inset: 0; z-index: 2; margin: 0; display: block; pointer-events: none; }
  .selo { position: absolute; width: max-content; max-width: 14.5rem; pointer-events: auto; }
  .selo--ia     { top: 4%;    left: -4%; }
  .selo--pncp   { bottom: 6%; left: -12%; }
  .selo--gestao { top: 44%;   right: -12%; }
}
/* entre 1000 e 1200 a coluna é estreita: puxa os selos para dentro */
@media (min-width: 1000px) and (max-width: 1199px) {
  .selo { max-width: 12.5rem; font-size: .8rem; }
  .selo--ia     { left: 0; }
  .selo--pncp   { left: -6%; }
  .selo--gestao { right: -2%; }
}

/* ---------- 7. Clientes ---------- */
.clientes { padding-block: var(--secao) clamp(3rem, 6vw, 4.5rem); border-top: 1px solid var(--linha); }
.clientes__h {
  font-size: .8125rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: var(--txt-2); text-align: center; margin-bottom: 2.5rem;
}
.clientes__grade {
  display: flex; flex-wrap: wrap; gap: .875rem; justify-content: center;
}
.clientes__grade li {
  flex: 1 1 168px; max-width: 208px;
  background: var(--chip); border: 1px solid var(--linha); border-radius: var(--r);
  padding: 1rem; display: grid; place-items: center; min-height: 96px;
}
.clientes__grade img { width: auto; max-height: 56px; object-fit: contain; }

/* ---------- 8. A quem serve ---------- */
.serve { padding-block: var(--secao); }
.serve__grade { display: grid; gap: var(--gap); margin-top: 3rem; }
@media (min-width: 800px) { .serve__grade { grid-template-columns: 1fr 1fr; } }
.perfil { border-top: 2px solid var(--ac); padding-top: 1.5rem; }
.perfil__ico { width: 34px; height: 34px; color: var(--ac-txt); margin-bottom: 1rem; }
.perfil h3 { font-size: 1.3rem; margin-bottom: .6rem; }
.perfil p { color: var(--txt-2); max-width: 48ch; }

/* ---------- 9. Módulos ---------- */
.mods { padding-block: var(--secao); background: var(--sup); border-block: 1px solid var(--linha); }

.mods__tabs { display: none; gap: .5rem; flex-wrap: wrap; margin: 2.5rem 0 2rem; }
.js .mods__tabs { display: flex; }
.mods__tab {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .7rem 1.15rem; border-radius: var(--r-p);
  background: transparent; border: 1px solid var(--linha); color: var(--txt-2);
  cursor: pointer; font-size: .9rem; font-weight: 500;
  transition: color .18s var(--ease), border-color .18s var(--ease), background-color .18s var(--ease);
}
.mods__tab:hover { color: var(--txt); border-color: var(--ac); }
.mods__tab[aria-selected="true"] { background: var(--ac); border-color: var(--ac); color: var(--ac-sob); font-weight: 700; }
.mods__tab .ico { width: 1.1em; height: 1.1em; }

.mods__painel { display: grid; gap: var(--gap); align-items: center; }
/* sem JS os quatro módulos ficam empilhados e legíveis */
.no-js .mods__painel { margin-top: 3rem; padding-top: 3rem; border-top: 1px solid var(--linha); }
.no-js .mods__painel[hidden] { display: grid; }
/* com JS, o atributo hidden precisa vencer o display acima */
.js .mods__painel[hidden] { display: none; }
@media (min-width: 900px) { .mods__painel { grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); } }

.mods__info h3 { font-size: clamp(1.35rem, 1.1rem + .9vw, 1.9rem); margin-bottom: .85rem; }
.mods__info p { color: var(--txt-2); max-width: 46ch; }
.mods__ia {
  display: flex; gap: .55rem; align-items: flex-start;
  margin-top: 1.25rem; padding: .85rem 1rem;
  background: color-mix(in srgb, var(--ac) 12%, transparent);
  border-left: 3px solid var(--ac); border-radius: 0 var(--r) var(--r) 0;
  color: var(--txt) !important; font-size: .92rem;
}
.mods__ia .ico { color: var(--ac-txt); margin-top: .15rem; }

.lista { display: grid; gap: .65rem; margin-top: 1.25rem; }
.lista li { display: flex; align-items: flex-start; gap: .6rem; color: var(--txt-2); }
.lista .ico { color: var(--ac-txt); margin-top: .28rem; width: 1.05em; height: 1.05em; }
.lista b { color: var(--txt); }

.mods__fig { margin: 0; }
.mods__fig img {
  width: 100%; border-radius: var(--r);
  border: 1px solid var(--linha); box-shadow: var(--sombra);
}

/* ---------- 10. Por que MACGOV ---------- */
.porque { padding-block: var(--secao); }
.pilares { display: grid; gap: 0; margin-top: 3rem; }
@media (min-width: 820px) { .pilares { grid-template-columns: repeat(3, 1fr); } }
.pilar { padding: 1.75rem 0; border-top: 1px solid var(--linha); }
@media (min-width: 820px) {
  .pilar { padding: 0 2rem; border-top: 0; border-left: 1px solid var(--linha); }
  .pilar:first-child { padding-left: 0; border-left: 0; }
}
.pilar .ico { width: 30px; height: 30px; color: var(--ac-txt); margin-bottom: .9rem; }
.pilar h3 { font-size: 1.2rem; margin-bottom: .5rem; }
.pilar p { color: var(--txt-2); }

.autor {
  display: grid; gap: var(--gap); margin-top: 4rem;
  background: var(--sup); border: 1px solid var(--linha); border-radius: var(--r);
  padding: clamp(1.5rem, 4vw, 2.75rem);
}
@media (min-width: 900px) { .autor { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: center; } }
.autor__nome { font-size: 1.5rem; font-weight: 700; }
.autor__cargo { color: var(--ac-txt); font-weight: 500; margin-bottom: 1.25rem; }
.autor__abes { display: flex; gap: .65rem; color: var(--txt-2); font-size: .95rem; max-width: 62ch; }
.autor__abes .ico { color: var(--ac-txt); margin-top: .2rem; width: 1.4em; height: 1.4em; }

.conf { display: grid; gap: .75rem; }
.conf li {
  background: var(--bg); border: 1px solid var(--linha); border-radius: var(--r);
  padding: .9rem 1.1rem; display: flex; flex-direction: column;
}
.conf span { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--txt-2); }
.conf b { font-size: 1.05rem; }

/* ---------- 11. Perguntas ---------- */
.faq { padding-block: var(--secao); background: var(--sup); border-block: 1px solid var(--linha); }
.faq .tit { max-width: none; margin-bottom: 2.5rem; }
.qa { border-bottom: 1px solid var(--linha); }
.qa summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.25rem 0; cursor: pointer; font-weight: 500; font-size: 1.05rem;
  list-style: none;
}
.qa summary::-webkit-details-marker { display: none; }
.qa summary .ico { color: var(--ac-txt); transition: transform .25s var(--ease); }
.qa[open] summary .ico { transform: rotate(180deg); }
.qa summary:hover { color: var(--ac-txt); }
.qa__corpo { padding-bottom: 1.5rem; color: var(--txt-2); max-width: 68ch; }
.qa__corpo .lista { margin-top: 0; }

/* ---------- 12. Demonstração ---------- */
.demo { padding-block: var(--secao); }
.demo__in { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
@media (min-width: 900px) { .demo__in { grid-template-columns: minmax(0, .85fr) minmax(0, 1fr); } }
.demo__txt > p { color: var(--txt-2); margin-top: 1rem; max-width: 42ch; }
.demo__canais { display: grid; gap: .85rem; margin-top: 2rem; }
.demo__canais li { display: flex; align-items: center; gap: .7rem; }
.demo__canais .ico { color: var(--ac-txt); }
.demo__canais a { text-decoration: none; font-weight: 500; border-bottom: 1px solid var(--linha); }
.demo__canais a:hover { border-bottom-color: var(--ac); }

.form {
  display: grid; gap: 1.1rem;
  background: var(--sup); border: 1px solid var(--linha); border-radius: var(--r);
  padding: clamp(1.25rem, 3.5vw, 2rem);
}
.campo { display: grid; gap: .4rem; }
.campo--par { display: grid; gap: 1.1rem; }
@media (min-width: 520px) { .campo--par { grid-template-columns: 1fr 1fr; } }
.campo--par > span { display: grid; gap: .4rem; }
.form label { font-size: .875rem; font-weight: 500; }
.opc { color: var(--txt-2); font-weight: 400; }

.form input[type="text"], .form input[type="email"], .form input[type="tel"], .form select, .form textarea {
  width: 100%; padding: .75rem .9rem;
  background: var(--bg); color: var(--txt);
  border: 1px solid var(--linha); border-radius: 10px;
  transition: border-color .18s var(--ease);
}
.form textarea { resize: vertical; min-height: 84px; }
.form :is(input, select, textarea):hover { border-color: color-mix(in srgb, var(--ac) 55%, var(--linha)); }
.form :is(input, select, textarea):focus-visible { outline-offset: 1px; }
.form :is(input, select, textarea)[aria-invalid="true"] { border-color: #ff6b6b; }

.erro { font-size: .8125rem; color: #ff8080; min-height: 0; }
:root[data-tema="claro"] .erro { color: #c02626; }
@media (prefers-color-scheme: light) { :root:not([data-tema]) .erro { color: #c02626; } }
.erro:empty { display: none; }

.aceite { display: flex; align-items: flex-start; gap: .65rem; font-size: .875rem; color: var(--txt-2); }
.aceite input { margin-top: .28rem; width: 18px; height: 18px; flex: none; accent-color: var(--ac); }
.aceite a { color: var(--txt); }

.ninho { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form__aviso {
  padding: .9rem 1.1rem; border-radius: 10px; font-size: .95rem;
  border: 1px solid var(--linha); background: var(--bg);
}
.form__aviso.ok { border-color: var(--ac); }
.enviando .btn__rot { display: none; }
.enviando .btn__load { display: inline !important; }

/* ---------- 13. Rodapé ---------- */
.rod { background: var(--marinho); color: #ffffff; padding-top: var(--secao); }
.rod__topo { display: grid; gap: var(--gap); padding-bottom: 3rem; }
@media (min-width: 820px) { .rod__topo { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1.2fr); } }
.rod__marca img { width: 168px; height: auto; }
.rod__marca p { color: var(--nevoa); font-size: .9rem; margin-top: 1rem; max-width: 38ch; }
.rod__redes { display: flex; gap: .6rem; margin-top: 1.5rem; }
.rod__redes a {
  display: grid; place-items: center; width: 40px; height: 40px;
  border: 1px solid rgb(255 255 255 / .18); border-radius: var(--r-p);
  transition: border-color .18s var(--ease), background-color .18s var(--ease);
}
.rod__redes a:hover { border-color: var(--ambar); background: rgb(252 192 28 / .12); }

.rod__col h2 { font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ambar); margin-bottom: 1.1rem; }
.rod__col ul { display: grid; gap: .6rem; }
.rod__col a { color: var(--nevoa); text-decoration: none; font-size: .925rem; }
.rod__col a:hover { color: #ffffff; }
.rod__contato li { display: flex; align-items: flex-start; gap: .6rem; color: var(--nevoa); font-size: .925rem; }
.rod__contato .ico { color: var(--ambar); margin-top: .18rem; }
.rod__contato address { font-style: normal; line-height: 1.55; }

.rod__base {
  border-top: 1px solid rgb(255 255 255 / .12);
  padding-block: 1.5rem;
  display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; justify-content: space-between;
  color: var(--nevoa); font-size: .85rem;
}
.rod__base a { color: var(--nevoa); }
.rod__base a:hover { color: #ffffff; }

/* ---------- 14. Movimento ----------
   O conteúdo nunca é escondido pelo CSS. A entrada é uma animação que roda
   quando o elemento chega à viewport. Se o JavaScript falhar, se o observador
   não disparar ou se a animação for interrompida, tudo continua visível. */
@keyframes entra {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: none; }
}
.js .rev.dentro { animation: entra .55s var(--ease) both; }

@media (prefers-reduced-motion: reduce) {
  .js .rev.dentro { animation: none; }
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---------- 15. Página de texto (política) ---------- */
.texto { padding-block: clamp(3rem, 6vw, 5rem); }
.texto h1 { font-size: clamp(1.9rem, 1.4rem + 2vw, 2.6rem); margin-bottom: .5rem; }
.texto .data { color: var(--txt-2); font-size: .9rem; margin-bottom: 2.5rem; }
.texto h2 { font-size: 1.3rem; margin: 2.5rem 0 .85rem; }
.texto p, .texto li { color: var(--txt-2); max-width: 70ch; }
.texto p + p { margin-top: 1rem; }
.texto ul { display: grid; gap: .5rem; margin-top: 1rem; padding-left: 1.1rem; list-style: disc; }
.texto ul + p { margin-top: 1.25rem; }
.texto a { color: var(--txt); }