/* ==========================================================================
   servico.css — páginas de serviço do Instituto Imperium (V2, ago/2026)
   Depende dos tokens de assets/css/style.css (paleta unificada com o escritório).
   Progressive enhancement: nada aqui é necessário para LER a página.
   ========================================================================== */

/* ---- tokens locais derivados ------------------------------------------- */
:root{
  --sv-max: 1180px;
  --sv-aside: 264px;
  --sv-gap: 3.5rem;
  --sv-radius: 4px;
  --sv-ring: 0 0 0 1px var(--color-line, #E6E3DA);
}

/* ---- transição entre páginas (Chrome/Safari; degrada em silêncio) ------- */
@view-transition { navigation: auto; }
@media (prefers-reduced-motion: reduce){ @view-transition { navigation: none; } }

/* ---- barra de progresso de leitura ------------------------------------- */
.sv-progress{
  position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 60;
  background: var(--color-gold); transform-origin: 0 50%; transform: scaleX(0);
}
@supports (animation-timeline: scroll()){
  .sv-progress{
    animation: sv-grow linear both;
    animation-timeline: scroll(root block);
  }
}
@keyframes sv-grow{ from{ transform: scaleX(0);} to{ transform: scaleX(1);} }

/* ---- reveal por scroll (só enfeite: sem suporte, o conteúdo já está lá) - */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .sv-reveal{
      animation: sv-in linear both;
      animation-timeline: view();
      animation-range: entry 10% cover 26%;
    }
  }
}
@keyframes sv-in{
  from{ opacity: 0; transform: translateY(14px); }
  to{ opacity: 1; transform: none; }
}

/* ---- hero -------------------------------------------------------------- */
.sv-hero{
  position: relative; background: var(--color-navy); color: #fff;
  padding: clamp(5rem, 12vw, 8.5rem) 0 clamp(3.5rem, 7vw, 5rem);
  overflow: hidden;
}
.sv-hero::after{
  content:""; position:absolute; inset:auto 0 0 0; height:3px;
  background: linear-gradient(90deg, var(--color-gold), transparent 72%);
}
.sv-hero__bg{
  position:absolute; inset:0; background-size:cover; background-position:center 22%;
  opacity:.30; filter: saturate(.9);
}
.sv-hero__bg::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(4,18,46,.55) 0%, rgba(4,18,46,.92) 78%, var(--color-navy) 100%);
}
.sv-hero__inner{ position:relative; max-width: var(--sv-max); margin:0 auto; padding:0 1.5rem; }
.sv-eyebrow{
  font-family: var(--font-sans); font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; color: var(--color-gold); margin:0 0 1.1rem;
}
.sv-hero h1{
  font-family: var(--font-serif); font-weight:600; line-height:1.13;
  font-size: clamp(2.1rem, 4.6vw, 3.5rem); margin:0 0 1.4rem; max-width: 20ch;
}
.sv-hero__lead{
  font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height:1.65;
  color: var(--color-gold-light, #E6D6A6); max-width: 62ch; margin:0 0 2rem;
}
.sv-hero__cta{ display:flex; gap:1rem; flex-wrap:wrap; }

/* ---- botões ------------------------------------------------------------ */
.sv-btn{
  display:inline-flex; align-items:center; gap:.55rem; padding:.9rem 1.6rem;
  border-radius: var(--sv-radius); font-family: var(--font-sans); font-weight:600;
  font-size:.95rem; text-decoration:none; transition: transform .18s, background .18s, color .18s;
}
.sv-btn--gold{ background: var(--color-gold); color: var(--color-navy); }
.sv-btn--gold:hover{ transform: translateY(-2px); background: var(--color-gold-light,#E6D6A6); }
.sv-btn--ghost{ border:1px solid rgba(255,255,255,.42); color:#fff; }
.sv-btn--ghost:hover{ border-color: var(--color-gold); color: var(--color-gold); }
.sv-btn:focus-visible{ outline:2px solid var(--color-gold); outline-offset:3px; }

/* ---- layout de corpo com índice lateral -------------------------------- */
.sv-body{ max-width: var(--sv-max); margin:0 auto; padding: 0 1.5rem; }
.sv-grid{ display:grid; grid-template-columns: var(--sv-aside) 1fr; gap: var(--sv-gap); align-items:start; }
@media (max-width: 900px){ .sv-grid{ grid-template-columns:1fr; } .sv-toc{ display:none; } }

.sv-toc{ position: sticky; top: 6.5rem; align-self:start; padding: 2.5rem 0; }
.sv-toc__title{
  font-family:var(--font-sans); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color: var(--color-graphite); margin:0 0 .9rem;
}
.sv-toc ol{ list-style:none; margin:0; padding:0; border-left:1px solid var(--color-line,#E6E3DA); }
.sv-toc a{
  display:block; padding:.45rem 0 .45rem 1rem; margin-left:-1px;
  border-left:2px solid transparent; color: var(--color-graphite);
  text-decoration:none; font-size:.9rem; line-height:1.35; transition: color .2s, border-color .2s;
}
.sv-toc a:hover{ color: var(--color-blue); }
.sv-toc a[aria-current="true"]{ color: var(--color-blue-deep); border-left-color: var(--color-gold); font-weight:600; }

/* ---- seções ------------------------------------------------------------ */
.sv-sec{ padding: 3.4rem 0; scroll-margin-top: 6rem; }
.sv-sec + .sv-sec{ border-top:1px solid var(--color-line,#E6E3DA); }
.sv-sec h2{
  font-family: var(--font-serif); font-weight:600; line-height:1.22;
  font-size: clamp(1.6rem, 2.7vw, 2.1rem); color: var(--color-blue-deep); margin:0 0 1.3rem;
}
.sv-sec h3{
  font-family: var(--font-sans); font-weight:700; font-size:1.03rem;
  color: var(--color-ink); margin:2rem 0 .6rem;
}
.sv-sec p, .sv-sec li{ font-size:1.03rem; line-height:1.72; color: var(--color-ink); }
.sv-sec p{ margin:0 0 1.15rem; max-width: 72ch; }
.sv-sec ul{ margin:0 0 1.15rem; padding-left:1.15rem; max-width:72ch; }
.sv-sec li{ margin-bottom:.5rem; }

/* faixa escura */
.sv-sec--dark{
  background: var(--color-blue-deep); color:#fff; padding:3.6rem 0; border-top:0;
}
.sv-sec--dark h2{ color:#fff; }
.sv-sec--dark p, .sv-sec--dark li{ color: rgba(255,255,255,.90); }
.sv-sec--dark .sv-eyebrow{ color: var(--color-gold); }

/* ---- tabela técnica ---------------------------------------------------- */
.sv-table{ width:100%; border-collapse:collapse; margin:0 0 1.4rem; font-size:.95rem; }
.sv-table th, .sv-table td{ padding:.75rem .9rem; text-align:left; vertical-align:top; border-bottom:1px solid var(--color-line,#E6E3DA); }
.sv-table th{
  font-family:var(--font-sans); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--color-blue-deep); background: #F4F6FA; border-bottom:2px solid var(--color-gold);
}
.sv-table td:last-child{ font-family: var(--font-mono); font-size:.86rem; color: var(--color-blue); white-space:nowrap; }
.sv-tablewrap{ overflow-x:auto; }

/* ---- sticky stack (como funciona) -------------------------------------- */
.sv-stack{ display:flex; flex-direction:column; gap:1.1rem; }
.sv-step{
  position: sticky; top: 7rem;
  background:#fff; box-shadow: var(--sv-ring); border-radius: var(--sv-radius);
  padding:1.8rem 1.9rem; border-left:3px solid var(--color-gold);
}
.sv-step__n{
  font-family:var(--font-mono); font-size:.8rem; letter-spacing:.1em;
  color: var(--color-blue); margin:0 0 .5rem;
}
.sv-step h3{ margin:0 0 .6rem; font-size:1.12rem; color: var(--color-blue-deep); }
.sv-step p:last-child{ margin-bottom:0; }
@media (max-width:900px){ .sv-step{ position:static; } }

/* ---- glossário (Popover API) ------------------------------------------- */
.sv-term{
  border:0; background:none; padding:0; cursor:help; font:inherit; color: var(--color-blue);
  border-bottom:1px dashed var(--color-blue-soft); anchor-name: var(--sv-anchor);
}
.sv-term:hover{ color: var(--color-blue-soft); }
.sv-term:focus-visible{ outline:2px solid var(--color-gold); outline-offset:2px; }
.sv-pop{
  margin:0; border:0; padding:1rem 1.15rem; max-width:34ch; border-radius: var(--sv-radius);
  background: var(--color-navy); color:#fff; font-size:.92rem; line-height:1.6;
  box-shadow: 0 12px 34px rgba(4,18,46,.34); border-top:2px solid var(--color-gold);
}
.sv-pop strong{ color: var(--color-gold); display:block; margin-bottom:.35rem; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; }
@supports (position-anchor: --a){
  .sv-pop{ position: fixed; position-anchor: var(--sv-anchor); position-area: block-start span-inline-end; margin-bottom:.5rem;
           position-try-fallbacks: block-end span-inline-end, block-start span-inline-start; }
}

/* ---- destaque legal ---------------------------------------------------- */
.sv-lei{
  background:#F4F6FA; border-left:3px solid var(--color-blue); border-radius:0 var(--sv-radius) var(--sv-radius) 0;
  padding:1.15rem 1.3rem; margin:0 0 1.4rem; max-width:72ch;
}
.sv-lei p{ margin:0; font-size:.98rem; }
.sv-lei cite{ display:block; margin-top:.5rem; font-style:normal; font-family:var(--font-mono); font-size:.82rem; color:var(--color-blue); }

/* ---- FAQ (funciona sem JS) --------------------------------------------- */
.sv-faq details{ border-bottom:1px solid var(--color-line,#E6E3DA); padding:.2rem 0; }
.sv-faq summary{
  cursor:pointer; padding:1rem 0; font-family:var(--font-sans); font-weight:600;
  color: var(--color-blue-deep); font-size:1.01rem; list-style:none; display:flex; justify-content:space-between; gap:1rem;
}
.sv-faq summary::-webkit-details-marker{ display:none; }
.sv-faq summary::after{ content:"+"; color: var(--color-gold); font-size:1.3rem; line-height:1; }
.sv-faq details[open] summary::after{ content:"–"; }
.sv-faq details p{ padding:0 0 1rem; margin:0; max-width:72ch; }

/* ---- cards de serviços relacionados ------------------------------------ */
.sv-rel{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.1rem; }
.sv-rel a{
  display:block; padding:1.3rem; text-decoration:none; border-radius:var(--sv-radius);
  box-shadow: var(--sv-ring); background:#fff; transition: transform .2s, box-shadow .2s;
}
.sv-rel a:hover{ transform:translateY(-3px); box-shadow:0 10px 26px rgba(4,18,46,.10); }
.sv-rel strong{ display:block; color: var(--color-blue-deep); font-family:var(--font-sans); margin-bottom:.35rem; }
.sv-rel span{ color: var(--color-graphite); font-size:.93rem; line-height:1.55; }

/* ---- CTA final --------------------------------------------------------- */
.sv-cta{ background: var(--color-navy); color:#fff; padding:4rem 0; text-align:center; }
.sv-cta h2{ color:#fff; font-family:var(--font-serif); font-size:clamp(1.7rem,3vw,2.4rem); margin:0 0 1rem; }
.sv-cta p{ color: var(--color-gold-light,#E6D6A6); max-width:60ch; margin:0 auto 2rem; }
.sv-cta .sv-hero__cta{ justify-content:center; }

/* ---- impressão (o servidor imprime para juntar ao processo) ------------- */
@media print{
  .sv-progress,.sv-toc,.sv-hero__bg,.sv-cta,.sv-rel{ display:none !important; }
  .sv-hero{ background:#fff; color:#000; padding:1rem 0; }
  .sv-hero h1,.sv-hero__lead{ color:#000; }
  .sv-step{ position:static; box-shadow:none; border-left:2px solid #999; }
  .sv-grid{ grid-template-columns:1fr; }
  a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:.8em; }
}

/* ==========================================================================
   CORREÇÃO DE CASCATA (23/08/2026)
   style.css impõe `h1,h2,h3,h4 { color: var(--color-ink) }` e
   `strong { color: var(--color-ink) }` — regras de ELEMENTO vencem a herança
   de cor do contêiner. Em fundo escuro isso deixava o H1 e os <strong>
   invisíveis (achado na renderização, não no código).
   ========================================================================== */
.sv-hero h1, .sv-hero h2, .sv-hero h3,
.sv-cta h2, .sv-cta h3,
.sv-sec--dark h2, .sv-sec--dark h3{ color:#fff; }

.sv-hero strong, .sv-cta strong, .sv-sec--dark strong{ color: var(--color-gold); }
.sv-hero__lead strong{ color: var(--color-gold); }
.sv-pop strong{ color: var(--color-gold); }

/* h3 herda --color-gold-dark do style.css (4,04:1 — só AA-grande).
   Nas páginas de serviço, h3 de corpo é tinta; h3 de card é azul. */
.sv-sec h3{ color: var(--color-ink); }
.sv-step h3, .sv-rel strong{ color: var(--color-blue-deep); }

/* ==========================================================================
   LOGO — dobrada (38px → 76px) por ordem do Dr. Paulo, 23/08/2026.
   Precisa ficar VISÍVEL o tempo todo, não discreta.
   ========================================================================== */
.sv-logo{ height:76px; width:auto; display:block; transition: height .28s ease; }
@media (max-width:640px){ .sv-logo{ height:54px; } }

/* o cabeçalho encolhe ao rolar, mas a logo nunca some (só reduz um pouco) */
@supports (animation-timeline: scroll()){
  @media (prefers-reduced-motion: no-preference){
    .sv-head{ animation: sv-head-shrink linear both; animation-timeline: scroll(root block); animation-range: 0 220px; }
    .sv-logo{ animation: sv-logo-shrink linear both; animation-timeline: scroll(root block); animation-range: 0 220px; }
  }
}
@keyframes sv-head-shrink{ to{ background: rgba(4,18,46,.97); box-shadow: 0 6px 26px rgba(4,18,46,.42); } }
@keyframes sv-logo-shrink{ to{ height:56px; } }

/* ==========================================================================
   EFEITOS DINÂMICOS — todos sob @supports e prefers-reduced-motion.
   Sem suporte: a página aparece inteira, estática e legível.
   ========================================================================== */
@media (prefers-reduced-motion: no-preference){

  /* 1 · PARALLAX no hero — a foto sobe mais devagar que o texto */
  @supports (animation-timeline: view()){
    .sv-hero__bg{ animation: sv-parallax linear both; animation-timeline: view(); animation-range: cover; }
  }
  @keyframes sv-parallax{ from{ transform: translateY(-7%) scale(1.08); } to{ transform: translateY(7%) scale(1.08); } }

  /* 2 · ENTRADA EM CASCATA do hero */
  .sv-hero .sv-eyebrow{ animation: sv-up .7s .05s both cubic-bezier(.2,.7,.3,1); }
  .sv-hero h1{ animation: sv-up .8s .16s both cubic-bezier(.2,.7,.3,1); }
  .sv-hero__lead{ animation: sv-up .8s .30s both cubic-bezier(.2,.7,.3,1); }
  .sv-hero__cta{ animation: sv-up .8s .44s both cubic-bezier(.2,.7,.3,1); }
  @keyframes sv-up{ from{ opacity:0; transform: translateY(22px); } to{ opacity:1; transform:none; } }

  /* 3 · FILETE DOURADO que se desenha quando a seção entra */
  @supports (animation-timeline: view()){
    .sv-sec h2::after{
      content:""; display:block; height:2px; width:0; margin-top:.75rem;
      background: linear-gradient(90deg, var(--color-gold), transparent);
      animation: sv-rule linear both; animation-timeline: view(); animation-range: entry 14% cover 30%;
    }
  }
  @keyframes sv-rule{ to{ width: 108px; } }

  /* 4 · LINHAS DE TABELA em cascata */
  @supports (animation-timeline: view()){
    .sv-table tbody tr{ animation: sv-row linear both; animation-timeline: view(); animation-range: entry 6% cover 22%; }
  }
  @keyframes sv-row{ from{ opacity:.15; transform: translateX(-10px);} to{ opacity:1; transform:none; } }

  /* 5 · CARDS RELACIONADOS em cascata */
  @supports (animation-timeline: view()){
    .sv-rel a{ animation: sv-in linear both; animation-timeline: view(); animation-range: entry 8% cover 26%; }
    .sv-rel a:nth-child(2){ animation-range: entry 4% cover 28%; }
    .sv-rel a:nth-child(3){ animation-range: entry 0% cover 30%; }
  }

  /* 6 · STICKY STACK com profundidade — o card que fica atrás recua */
  @supports (animation-timeline: view()){
    .sv-step{ animation: sv-step-back linear both; animation-timeline: view(); animation-range: exit-crossing 0% exit 100%; }
  }
  @keyframes sv-step-back{ to{ transform: scale(.955) translateY(-8px); opacity:.55; } }

  /* 7 · DESTAQUE LEGAL — a barra azul cresce de cima para baixo */
  @supports (animation-timeline: view()){
    .sv-lei{ position:relative; overflow:hidden; }
    .sv-lei::before{
      content:""; position:absolute; left:-3px; top:0; width:3px; height:0; background: var(--color-gold);
      animation: sv-bar linear both; animation-timeline: view(); animation-range: entry 12% cover 34%;
    }
  }
  @keyframes sv-bar{ to{ height:100%; } }

  /* 8 · CTA final — respiração dourada no fundo */
  .sv-cta{ position:relative; overflow:hidden; }
  .sv-cta::before{
    content:""; position:absolute; inset:-40% 30% auto -20%; height:520px; border-radius:50%;
    background: radial-gradient(closest-side, rgba(200,165,84,.16), transparent 70%);
    animation: sv-breathe 9s ease-in-out infinite alternate;
  }
  @keyframes sv-breathe{ from{ transform: translate3d(0,0,0) scale(1); } to{ transform: translate3d(6%,4%,0) scale(1.18); } }

  /* 9 · assinatura da casa: filete lateral no hover da seção */
  .sv-sec{ position:relative; }
  .sv-sec::before{
    content:""; position:absolute; left:-1.6rem; top:2.6rem; bottom:2.6rem; width:2px;
    background: var(--color-gold); transform: scaleY(0); transform-origin: top;
    transition: transform .42s cubic-bezier(.2,.7,.3,1); opacity:.85;
  }
  .sv-sec:hover::before{ transform: scaleY(1); }
  @media (max-width:900px){ .sv-sec::before{ display:none; } }

  /* 10 · botões com brilho que atravessa */
  .sv-btn--gold{ position:relative; overflow:hidden; }
  .sv-btn--gold::after{
    content:""; position:absolute; inset:0 auto 0 -60%; width:45%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
    transform: skewX(-18deg); transition: left .55s ease;
  }
  .sv-btn--gold:hover::after{ left:120%; }
}

/* ==========================================================================
   CORREÇÃO DE MOBILE (23/08/2026)
   Medido com emulação real (390px): a pagina transbordava 21px. Causa: item de
   grid tem `min-width:auto` por padrao e nao encolhe abaixo do min-content do
   filho — a tabela com coluna `white-space:nowrap` empurrava a coluna inteira.
   ========================================================================== */
.sv-grid > *{ min-width: 0; }
.sv-tablewrap{ max-width: 100%; }
.sv-sec h2, .sv-sec h3, .sv-sec p, .sv-sec li{ overflow-wrap: break-word; }

@media (max-width: 640px){
  .sv-body{ padding-left: 1.15rem; padding-right: 1.15rem; }
  .sv-table th, .sv-table td{ padding:.6rem .55rem; font-size:.9rem; }
  .sv-table td:last-child{ white-space: normal; }   /* deixa o dispositivo quebrar */
  .sv-step{ padding: 1.3rem 1.2rem; }
  .sv-hero{ padding-top: 4rem; }
  .sv-rel{ grid-template-columns: 1fr; }
}

/* ============================================================
   34 · PLANOS — restauração da seção #planos que existia na
   versão anterior de /sistema-licitacoes/ (index.html 56.602 B,
   backup index.html.bak-20260823-111859). Ordem do Paulo,
   23/08/2026: "a tabela de preços deve voltar exatamente para
   onde estava" — entre a seção de contratação e as dúvidas,
   com os mesmos valores, cotas e itens de cada plano.
   ============================================================ */
.sv-planos h3.sv-modulo{ text-align:center; color:var(--color-blue-deep);
  margin:0 0 .2rem; font-size:1.45rem; }
.sv-planos p.sv-modulo-sub{ text-align:center; font-family:var(--font-mono,ui-monospace,monospace);
  font-size:.78rem; color:var(--color-graphite); margin:0 0 1.3rem; }
.sv-pcards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:20px; margin:0 0 2.4rem; align-items:stretch; }
.sv-pcards > *{ min-width:0; }
.sv-pcard{ border:1px solid var(--color-line); border-radius:6px; padding:24px 22px;
  background:var(--color-white,#fff); display:flex; flex-direction:column; }
.sv-pcard--feat{ border-color:var(--color-gold); box-shadow:0 8px 28px rgba(200,165,84,.18); }
.sv-pcard .sv-ptag{ font-family:var(--font-mono,ui-monospace,monospace); font-size:.66rem;
  letter-spacing:.12em; text-transform:uppercase; color:var(--color-gold-dark);
  font-weight:700; margin-bottom:6px; min-height:1em; }
.sv-pcard h4{ margin:0; font-size:1.25rem; color:var(--color-ink); }
.sv-pcard .sv-perfil{ font-size:.84rem; color:var(--color-graphite); min-height:38px; margin-top:2px; }
.sv-pcard .sv-price{ font-family:var(--font-serif,Georgia,serif); font-size:2.5rem;
  color:var(--color-gold-dark); font-weight:700; margin-top:8px; line-height:1;
  font-feature-settings:"lnum" 1; }
.sv-pcard .sv-price small{ font-size:.9rem; color:var(--color-graphite); font-weight:400; }
.sv-pcard .sv-lim{ font-size:.84rem; color:var(--color-graphite); margin:4px 0 14px; }
.sv-pcard ul{ margin:0 0 18px; padding-left:1.1rem; }
.sv-pcard ul li{ font-size:.9rem; margin-bottom:6px; }
.sv-pcard .sv-btn{ margin-top:auto; align-self:flex-start; }
.sv-pnote{ font-size:.9rem; color:var(--color-graphite); border-top:1px solid var(--color-line);
  padding-top:16px; }
@media (max-width:640px){ .sv-pcard .sv-perfil{ min-height:0; } }

/* ⛔ CORRECAO 23/08/2026 — visto no render, nao no codigo.
   .sv-btn--ghost e branco sobre transparente: foi desenhado para as secoes
   ESCURAS. Dentro de #planos, que e claro, os botoes Essencial e Avancado
   ficavam invisiveis. Aqui o fantasma passa a ser azul sobre claro.
   Mesma familia do defeito do H1 invisivel: regra de elemento vence heranca,
   e so o RENDER mostra. */
.sv-planos .sv-btn--ghost{ border:1px solid var(--color-blue-deep);
  color:var(--color-blue-deep); background:transparent; }
.sv-planos .sv-btn--ghost:hover{ border-color:var(--color-gold-dark);
  color:var(--color-gold-dark); background:rgba(200,165,84,.10); }

/* os cartoes sem destaque precisam de superficie propria, senao somem no fundo */
.sv-pcard{ background:#fff; border:1px solid rgba(10,33,80,.16); }
.sv-planos .sv-eyebrow{ display:block; margin-bottom:.4rem; }

/* ============================================================
   36 · CONTRASTE — dois textos invisiveis achados na varredura
   de 23/08/2026, medindo o RENDER de todas as paginas.
   Mesma familia do defeito dos numeros da home que o Paulo viu.

   a) .sv-term (os termos que abrem o popover) e --color-blue
      #123A8C. Dentro de secao ESCURA (--color-navy #04122E) da
      1,78:1 — o termo some. Em 4 paginas: sistema-licitacoes
      (DFD, ETP, TR), cpi, processo-legislativo, software.
      Dourado #C8A554 sobre o navy: 7,93:1.

   b) .sv-ptag ("★ MAIS CONTRATADO") e --color-gold-dark #9A7A2E
      sobre branco: 4,04:1 com 11px. Texto pequeno pede 4,5:1.
      --color-gold-onlight #8E712E da 4,61:1.
   ============================================================ */
.sv-sec--dark .sv-term,
.sv-hero .sv-term,
.sv-cta .sv-term{ color: var(--color-gold); border-bottom-color: var(--color-gold); }
/* .sv-cta tambem e escura (#04122E) e eu tinha esquecido dela: a primeira
   correcao deixou 2 das 4 paginas ainda ilegiveis. Achado remedindo o
   render DEPOIS de corrigir — nao antes. */
.sv-pcard .sv-ptag{ color: var(--color-gold-onlight); }
