/* ===============================================================
   Informativos — complementa o style.css. Carregado so nas paginas
   de /informativos/. Usa as variaveis das bandas (--mark, --ink...).
   =============================================================== */

/* ---------- indice ---------- */
.inf-filtro{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.inf-filtro[hidden]{display:none}
.inf-filtro button{
  font-family:var(--sans);font-size:.82rem;font-weight:500;letter-spacing:.02em;
  min-height:44px;padding:10px 15px;cursor:pointer;
  background:transparent;color:var(--ink);border:1px solid var(--line);
  transition:border-color .2s ease,background-color .2s ease,color .2s ease;
}
.inf-filtro button:hover{border-color:var(--mark)}
.inf-filtro button[aria-pressed="true"]{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)}
.inf-filtro button:focus-visible{outline:2px solid var(--mark);outline-offset:2px}
.inf-contagem{font-size:.85rem;color:var(--ink2);margin:0 0 22px}
.inf-contagem:empty{display:none}

.inf-lista{border-top:1px solid var(--line)}
.inf-card{position:relative;padding:24px 0 26px;border-bottom:1px solid var(--line)}
.inf-card[hidden]{display:none}
.inf-area{font-size:.68rem;letter-spacing:.17em;text-transform:uppercase;color:var(--mark);margin:0 0 10px}
.inf-card h2{font-size:clamp(1.15rem,2.6vw,1.45rem);line-height:1.32;margin:0 0 10px;max-width:32em;transition:color .25s ease}
.inf-card:hover h2{color:var(--mark)}
.inf-resumo{
  margin:0 0 14px;max-width:44em;color:var(--ink2);font-size:.97rem;line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.inf-card-pe{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 20px}
.inf-card-pe time{font-size:.85rem;color:var(--ink2)}
.inf-ler{font-size:.9rem;font-weight:500;color:var(--mark);text-decoration:underline;text-underline-offset:4px}
.inf-ler::after{content:"";position:absolute;inset:0}   /* card inteiro clicavel */
.inf-ler:focus-visible{outline:none}
.inf-card:focus-within{outline:2px solid var(--mark);outline-offset:6px}
.inf-selo{display:inline-block;margin-left:8px;padding:2px 7px;border:1px solid var(--line);font-size:.62rem;letter-spacing:.12em;color:var(--ink2);vertical-align:1px}

/* ---------- pagina do material ---------- */
.inf-hero .inf-area{margin-bottom:14px}
.inf-hero h1{max-width:24ch}
.inf-autoria{margin:22px 0 0;font-size:.9rem;line-height:1.6;color:var(--ink2)}
.inf-autoria time{display:block;font-size:.68rem;letter-spacing:.17em;text-transform:uppercase;color:var(--mark);margin-bottom:6px}

.inf-download{margin:clamp(34px,5vw,54px) 0 0;padding-top:28px;border-top:1px solid var(--line);max-width:41em}
.inf-download .btn{display:inline-flex;align-items:center;gap:10px}
.inf-download .btn svg{flex:none}
.inf-micro{margin:10px 0 0;font-size:.85rem;color:var(--ink2)}
.inf-aviso{margin:30px 0 0;max-width:41em;font-size:.86rem;line-height:1.65;color:var(--ink2)}

/* ---------- bloco de contato (secundario) ---------- */
.inf-contato{
  margin-top:clamp(48px,7vw,84px);max-width:41em;
  padding:clamp(22px,4vw,34px);border:1px solid var(--line);
}
.inf-contato h2{font-size:clamp(1.12rem,2.4vw,1.35rem);margin:0 0 10px}
.inf-contato-texto{color:var(--ink2);font-size:.95rem;line-height:1.65;margin:0 0 18px}
.inf-abrir{cursor:pointer}
.inf-abrir[hidden]{display:none}
.inf-abrir:focus-visible,.inf-form .btn:focus-visible{outline:2px solid var(--mark);outline-offset:3px}
.inf-wa{margin:14px 0 0;font-size:.9rem}
.inf-wa a{color:var(--mark);text-underline-offset:4px}
.inf-form{margin-top:24px}
.inf-form[hidden]{display:none}
.inf-form .field label,.inf-pref legend{text-transform:uppercase}
.inf-form textarea{resize:vertical;min-height:130px}
.inf-pref{border:0;margin:0;padding:0;min-width:0}
.inf-pref legend{display:block;padding:0;font-size:.66rem;letter-spacing:.17em;color:var(--mark);margin-bottom:10px}
.inf-opcoes{display:flex;flex-wrap:wrap;gap:10px}
.inf-opcao{
  display:flex;align-items:center;gap:10px;min-height:46px;padding:10px 16px;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:.95rem;
}
.inf-opcao input{width:18px;height:18px;margin:0;accent-color:var(--gold-deep)}
.inf-opcao:focus-within{outline:2px solid var(--mark);outline-offset:1px}
.inf-opcao:has(input:checked){border-color:var(--mark)}
.inf-campo[hidden]{display:none}
.inf-ajuda{margin:8px 0 0;font-size:.85rem;line-height:1.55;color:var(--ink2)}
.inf-conta{margin:4px 0 0;font-size:.8rem;color:var(--ink2);text-align:right}
.inf-conta[hidden]{display:none}
.inf-consent{display:flex;gap:12px;align-items:flex-start}
.inf-consent input{flex:none;width:20px;height:20px;margin:3px 0 0;accent-color:var(--gold-deep)}
.inf-consent input:focus-visible{outline:2px solid var(--mark);outline-offset:2px}
.inf-consent label{font-size:.9rem;line-height:1.55;color:var(--ink)}
.inf-consent a{color:var(--mark)}
.inf-nota{margin:0;font-size:.82rem;line-height:1.6;color:var(--ink2)}
.inf-status{margin:0;font-size:.92rem;line-height:1.5;color:#9B2C1A}
.inf-status:empty{display:none}
.inf-ok{margin:24px 0 0;padding:16px 20px;border-left:2px solid var(--mark);background:var(--surface);color:var(--ink);font-size:.97rem}
.inf-ok[hidden]{display:none}
.inf-ok:focus{outline:none}
.inf-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.inf-form button[disabled]{opacity:.6;cursor:progress}
.inf-filtro button[hidden]{display:none}

/* ---------- guias: texto integral dos PDFs ---------- */
.inf-hero .inf-serie{color:inherit}
.inf-hero .inf-sub{margin:18px 0 0;max-width:40em;font-size:1rem;line-height:1.7;opacity:.82}
.inf-guia .entry-content h2,.inf-guia .entry-content h3{scroll-margin-top:84px}
.inf-guia .entry-content strong{color:var(--ink);font-weight:600}
.inf-kicker{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mark);margin:0}
.entry-content .inf-kicker + h2{margin-top:.45em}
.inf-lede{font-family:var(--display);font-size:clamp(1.06rem,2.2vw,1.18rem);line-height:1.62;color:var(--ink)!important}

/* capítulos 01 a 09 */
.entry-content .inf-cap{display:flex;flex-direction:column;gap:.3em;margin:2.6em 0 .55em;padding-top:1.05em;border-top:1px solid var(--line)}
.inf-cap-n{font-family:var(--logo);font-weight:300;font-size:clamp(2.1rem,5vw,2.7rem);line-height:.9;color:var(--mark)}

/* sumário */
.inf-sumario{list-style:none;padding:0!important;margin:.9em 0 1.9em;display:grid;grid-template-columns:1fr;column-gap:34px;border-top:1px solid var(--line)}
@media (min-width:640px){.inf-sumario{grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,auto);grid-auto-flow:column}}
.entry-content .inf-sumario li{margin:0;border-bottom:1px solid var(--line)}
.inf-sumario a{display:flex;align-items:baseline;gap:14px;min-height:44px;padding:11px 0;color:var(--ink)!important;text-decoration:none;font-size:.95rem;line-height:1.45;transition:color .2s ease}
.inf-sumario a:hover{color:var(--mark)!important}
.inf-sumario a:focus-visible{outline:2px solid var(--mark);outline-offset:2px}
.inf-sumario-n{flex:none;min-width:1.6em;font-family:var(--logo);font-size:1.12rem;color:var(--mark)}

/* quadros de destaque */
.inf-destaque{margin:1.8em 0;padding:20px 22px 20px 24px;background:var(--surface);border-left:2px solid var(--mark)}
.inf-destaque p{margin:0 0 .65em;color:var(--ink2);font-size:.97rem;line-height:1.68}
.inf-destaque p:last-child{margin-bottom:0}
.inf-destaque .inf-destaque-tit{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--mark);margin-bottom:.75em}
.inf-destaque--escuro{background:var(--petrol);border-left-color:var(--gold)}
.inf-destaque--escuro p{color:#C9D5D7}
.inf-destaque--escuro .inf-destaque-tit{color:var(--gold)}
.inf-destaque--escuro strong{color:#FDFCFA!important}

/* tabelas (no celular, cada linha vira um bloco) */
.inf-tabela{margin:1.1em 0 1.9em}
.inf-tabela table{width:100%;border-collapse:collapse;font-size:.93rem;line-height:1.55}
.inf-tabela thead th{text-align:left;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--mark);padding:0 16px 10px 0;border-bottom:1px solid var(--mark)}
.inf-tabela tbody tr{border-bottom:1px solid var(--line)}
.inf-tabela tbody th{text-align:left;vertical-align:top;width:34%;padding:13px 18px 13px 0;font-weight:600;color:var(--ink)}
.inf-tabela td{vertical-align:top;padding:13px 0;color:var(--ink2)}
@media (max-width:600px){
  .inf-tabela thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .inf-tabela tbody{border-top:1px solid var(--mark)}
  .inf-tabela tbody tr{display:block;padding:13px 0}
  .inf-tabela tbody th,.inf-tabela td{display:block;width:auto;padding:0}
  .inf-tabela tbody th{margin-bottom:4px}
}

/* mito x verdade */
.inf-mito{display:grid;grid-template-columns:1fr;margin:1.1em 0;background:var(--surface);border:1px solid var(--line)}
@media (min-width:640px){.inf-mito{grid-template-columns:1fr 1fr}}
.entry-content .inf-mito p{margin:0;padding:18px 20px}
.inf-mito-m{font-family:var(--display);font-style:italic;font-size:1.02rem;line-height:1.55;color:var(--ink);border-bottom:1px solid var(--line)}
@media (min-width:640px){.inf-mito-m{border-bottom:0;border-right:1px solid var(--line)}}
.inf-mito-v{color:var(--ink2);font-size:.95rem;line-height:1.62}
.inf-rot{display:block;margin-bottom:8px;font-family:var(--sans);font-style:normal;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--mark)}

/* listas com marcador */
.entry-content .inf-marcas{list-style:none;padding-left:0}
.entry-content .inf-marcas li{position:relative;padding-left:22px;margin-bottom:.7em;line-height:1.65}
.inf-marcas li::before{content:"";position:absolute;left:0;top:.82em;width:10px;height:1px;background:var(--mark)}

/* números em destaque */
.inf-numeros{list-style:none;padding:0!important;margin:1.3em 0 1.9em;display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
@media (min-width:720px){.inf-numeros{grid-template-columns:repeat(4,1fr)}}
.entry-content .inf-numeros li{margin:0;padding-top:12px;border-top:1px solid var(--mark)}
.inf-numeros strong{display:block;margin-bottom:6px;font-family:var(--display);font-weight:400!important;font-size:clamp(1.45rem,3.4vw,1.8rem);line-height:1.1;color:var(--ink)}
.inf-numeros span{display:block;font-size:.83rem;line-height:1.5;color:var(--ink2)}

/* exemplos práticos */
.inf-caso{margin:1.2em 0;padding:20px 22px 6px;background:var(--surface);border:1px solid var(--line)}
.entry-content .inf-caso h3{display:flex;align-items:baseline;gap:10px;margin:0 0 12px;font-size:1.1rem;line-height:1.35}
.inf-caso-l{flex:none;font-family:var(--logo);font-size:1.4rem;line-height:1;color:var(--mark)}
.inf-caso dl{margin:0}
.inf-caso dl > div{padding:12px 0;border-top:1px solid var(--line)}
@media (min-width:640px){.inf-caso dl > div{display:grid;grid-template-columns:8.6rem 1fr;gap:18px}}
.inf-caso dt{margin-bottom:4px;padding-top:.3em;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--mark)}
.inf-caso dd{margin:0;font-size:.95rem;line-height:1.62;color:var(--ink2)}

/* passos numerados */
.entry-content .inf-passos{list-style:none;padding:0;margin:1.2em 0 1.9em;counter-reset:ip}
.entry-content .inf-passos li{counter-increment:ip;position:relative;margin:0;padding:14px 0 14px 3.3em;border-top:1px solid var(--line)}
.inf-passos li::before{content:counter(ip,decimal-leading-zero);position:absolute;left:0;top:.42em;font-family:var(--logo);font-size:1.7rem;line-height:1;color:var(--mark)}
.entry-content .inf-passos p{margin:0}
.entry-content .inf-passos .inf-passo-t{margin-bottom:.3em;font-weight:600;color:var(--ink)}
.entry-content .inf-passos p + p{color:var(--ink2);line-height:1.65}

/* checklist */
.entry-content .inf-check{list-style:none;padding:0;margin:.7em 0 1.7em}
@media (min-width:640px){.entry-content .inf-check--2{columns:2;column-gap:34px}}
.entry-content .inf-check li{position:relative;margin:0;padding:10px 0 10px 32px;border-bottom:1px solid var(--line);color:var(--ink);line-height:1.5;break-inside:avoid}
.inf-check li::before{content:"";position:absolute;left:0;top:13px;width:15px;height:15px;border:1px solid var(--mark);border-radius:2px}

/* impressão: só o texto do guia */
@media print{
  .site-head,.foot,.inf-contato,.inf-download,.skip-link,.inf-hero .back{display:none!important}
  .band{padding:12px 0!important;background:#fff!important;color:#000}
  .area-hero--foto::before{display:none!important}
  .inf-hero,.inf-hero *{color:#000!important}
  .entry-content > *{opacity:1!important;transform:none!important}
  .inf-caso,.inf-mito,.inf-destaque,.inf-tabela tr,.inf-passos li{break-inside:avoid}
  .inf-destaque--escuro{background:#fff;border-left-color:#000}
  .inf-destaque--escuro p,.inf-destaque--escuro strong{color:#000!important}
}
/* algarismos alinhados (a Cormorant usa algarismos de texto por padrão) */
.inf-cap-n,.inf-sumario-n,.inf-passos li::before{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.inf-contato{scroll-margin-top:84px}

/* ---------- índice: baixar o guia direto do card ---------- */
.inf-livre{margin:0 0 18px;font-size:.85rem;color:var(--ink2)}
.inf-card .inf-baixar{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:10px;margin:2px 0 16px}
.inf-card .inf-baixar svg{flex:none}
.inf-card .inf-baixar:focus-visible{outline:2px solid var(--mark);outline-offset:3px}
.inf-card:has(.inf-baixar:focus-visible){outline:none}
@media (max-width:600px){.inf-card .inf-baixar{display:flex;width:100%}}

/* quadro de contato abaixo da lista (decisão do cliente, 10/10/2026):
   botão dourado com texto escuro, contorno um tom abaixo para não sumir no creme */
.inf-fale{margin:clamp(34px,5vw,52px) 0 0;max-width:41em;padding:clamp(22px,4vw,32px);background:var(--surface);border:1px solid var(--line)}
.inf-fale-titulo{margin:0 0 18px;font-family:var(--display);font-size:clamp(1.12rem,2.4vw,1.35rem);line-height:1.35;color:var(--ink)}
.inf-fale .inf-fale-btn{background:var(--gold);border-color:#C9955E;color:#041115}
.inf-fale .inf-fale-btn:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}
@media (max-width:600px){.inf-fale .inf-fale-btn{display:block;text-align:center}}
.inf-fale-wa{margin:14px 0 0;font-size:.9rem}
.inf-fale-wa a{color:var(--mark);text-decoration:underline;text-underline-offset:4px}
.inf-fale-wa a:focus-visible{outline:2px solid var(--mark);outline-offset:3px}
