/* ============================================================
   ARTIGOS 2026 — A SEÇÃO NA LINGUAGEM NOVA DO SITE (24/09/2026)
   Pedido do dono: "redesign da página de artigos com base no nosso
   novo design… não precisa ser uma mudança drástica… pelo menos as
   mesmas fontes" + "o título fica só no cantinho da esquerda, podia
   arrastar até a direita quando não tem nada à direita".
   Camada por cima do artigos.css (que a equipe também usa e fica
   intocado), carregada só na capa e nas páginas de artigo:
   · Manrope no lugar da Fraunces e da Inter, como na home e nos
     núcleos (mesmas faces "KO Texto" e "KO Titulos");
   · branco de verdade e cinzas frios da família da tinta;
   · cartões cinza que escurecem para tinta, como os da home;
   · títulos sem "balance" e sem largura em ch: a linha vai até a
     direita e só quebra quando precisa;
   · o "&" decorativo é o da logo (máscara), nunca o da fonte.
   ============================================================ */

/* ---------- FONTES ---------- */
@font-face {
  font-family: "KO Texto";
  src: url("fonts/manrope-latin.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  size-adjust: 104%;
}
@font-face {
  font-family: "KO Titulos";
  src: url("fonts/manrope-latin.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  size-adjust: 96%;
}

/* ---------- TOKENS ---------- */
:root {
  --serif: "KO Titulos", Arial, sans-serif;
  --sans: "KO Texto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  /* a mesma família fria da home (mescla-2026.css, bloco 5) */
  --bone-2: #F4F5F7;
  --surface: #F4F5F7;
  --card: #F4F5F7;
  --card-2: #EEF0F3;
  --linha-suave: #E3E6EB;
  --text: #2A2E37;
  --text-soft: #525761;
  --text-faint: #6B707A;
  --rule: rgba(26, 29, 36, 0.1);
  --rule-mid: rgba(26, 29, 36, 0.18);
  --ink-grad: linear-gradient(180deg, #171A21 0%, #0E1015 100%);
  --on-dark: #F2F3F5;
  --on-dark-soft: #AEB3BC;
  --on-dark-faint: #80858F;
  --r-md: 18px;
  --r-lg: 26px;
  --r-xl: 30px;
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
  --sombra-card: none;
  --sombra-forte: 0 30px 60px -34px rgba(15, 17, 22, 0.6);
  /* o "&" da logo (assets/e-logo.svg) embutido, para usar como máscara */
  --e-logo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 560 636'%3E%3Cpath fill='%23F0BB4A' fill-rule='evenodd' d='M169.0,617.0C120.6,611.7 83.6,596.1 56.3,569.6C35.8,549.8 23.2,525.6 18.6,496.9C14.9,474.8 18.2,445.5 26.7,423.5C30.1,414.8 40.2,395.3 43.1,391.7L46.1,388.0L82.7,388.3C116.2,388.5 119.4,388.6 120.4,390.2C121.2,391.5 120.9,394.1 119.3,400.7C116.5,411.8 114.0,433.3 113.8,447.0C113.6,459.0 116.3,481.5 119.1,490.9C120.1,494.4 121.0,498.0 121.0,498.9C121.1,499.8 121.9,502.3 123.0,504.5C124.1,506.7 124.9,509.0 125.0,509.7C125.0,510.8 127.5,516.3 130.2,521.4C150.2,558.6 182.4,580.3 226.8,586.4C268.1,592.1 306.7,582.1 348.5,554.7C359.5,547.5 361.0,546.2 361.0,543.9C361.0,542.9 352.4,532.5 341.8,520.8C331.3,509.1 317.2,493.4 310.6,486.1C303.9,478.7 291.7,465.2 283.5,456.1C275.2,446.9 250.4,419.5 228.4,395.0C206.3,370.5 179.0,340.1 167.5,327.5C106.4,259.8 86.7,230.3 75.3,189.0C72.7,179.9 72.6,178.4 72.6,154.5C72.6,130.3 72.6,129.2 75.3,119.5C76.8,114.0 78.5,109.1 79.0,108.6C79.6,108.0 80.0,106.9 80.0,106.1C80.0,103.4 89.0,86.9 94.4,79.7C114.4,52.8 146.2,33.2 183.7,24.5C203.1,20.0 239.7,18.6 261.6,21.4C298.5,26.3 323.1,36.7 343.4,56.0C366.8,78.2 376.4,108.1 371.5,143.0C370.6,149.9 369.2,156.8 368.5,158.5C367.9,160.2 367.0,163.2 366.6,165.2C365.4,171.9 355.7,193.1 351.5,198.4L349.3,201.2L316.0,201.0C297.7,201.0 282.3,200.7 281.7,200.3C280.5,199.5 281.5,192.0 284.0,184.5C290.1,165.8 292.9,137.2 291.0,113.8C290.3,105.2 288.9,95.9 287.9,92.5C286.9,89.2 286.0,85.6 286.0,84.5C286.0,83.4 285.1,80.7 284.0,78.5C282.9,76.3 282.0,74.0 282.0,73.5C281.9,71.7 277.6,63.7 273.5,57.5C257.6,33.4 230.8,25.2 200.3,35.1C178.8,42.1 160.5,66.1 156.9,92.0C153.7,115.0 153.7,117.2 156.9,138.6C159.4,155.1 170.0,179.5 183.8,200.5C196.5,219.7 200.5,224.3 284.0,317.0C323.8,361.3 370.8,413.5 388.3,433.0C428.5,477.7 425.3,474.4 427.6,473.2C431.4,471.1 442.6,445.4 447.0,428.9C448.0,425.2 449.1,421.7 449.4,421.1C449.8,420.5 450.7,416.1 451.5,411.3C452.3,406.4 453.4,400.5 453.9,398.0C454.4,395.5 455.3,385.3 456.0,375.2C457.4,353.9 456.1,326.7 452.9,310.8C451.9,305.5 451.0,300.2 451.0,299.0C451.0,297.9 450.1,293.5 448.9,289.2C445.2,275.4 442.9,267.6 441.6,263.4C439.3,256.7 439.7,256.6 457.6,258.5C476.1,260.6 477.1,261.1 478.9,270.7C479.5,273.9 480.8,280.1 481.8,284.5C484.3,296.2 484.3,353.5 481.8,366.0C480.8,370.7 479.6,376.8 479.1,379.5C477.6,387.6 474.9,398.3 473.6,401.5C472.8,403.2 471.9,406.1 471.6,408.0C470.8,411.9 467.7,420.4 464.9,426.6C463.8,428.9 463.0,431.3 463.0,432.0C463.0,432.6 462.4,434.4 461.6,435.8C460.8,437.3 457.4,444.1 454.0,451.0C448.3,462.7 440.3,476.5 437.3,480.1C436.6,480.9 436.0,482.6 436.0,483.8C436.0,485.3 453.0,505.1 487.9,544.4C516.4,576.4 540.3,603.7 540.9,604.9C541.6,606.1 541.8,607.5 541.5,608.0C541.1,608.6 519.4,609.0 482.2,609.0C432.2,609.0 423.1,608.8 421.4,607.5C420.2,606.7 408.6,594.4 395.5,580.0C382.4,565.7 371.4,554.0 371.1,554.0C370.0,554.0 365.3,557.4 359.1,562.7C345.1,574.6 320.4,590.0 302.8,597.6C284.2,605.7 264.6,611.5 243.5,615.1C232.7,616.9 225.9,617.3 203.5,617.6C188.7,617.7 173.1,617.5 169.0,617.0Z'/%3E%3C/svg%3E");
}

/* ---------- BASE ---------- */
html { font-synthesis: none; }
body { color: var(--text); }
/* A Manrope não tem itálico: o que era itálico fica reto e ganha cor
   ou peso, nunca um itálico falso. */
h1, h2, h3, h4, .serif {
  font-weight: 600;
  font-variation-settings: normal;
  /* "balance" deixava duas linhas curtas e um vazio à direita */
  text-wrap: pretty;
}
em { font-style: normal; }
.art-body em { font-style: normal; font-weight: 500; color: var(--ink); }

.eyebrow { color: #7A5A18; letter-spacing: 0.16em; }
:where(a, button, summary, [tabindex]):focus-visible {
  outline-color: #A87A1F;
  border-radius: 6px;
}

/* o "&" da logo como peça: a cor vem do background */
.e-logo-mask,
.ap-sec-num,
.art-end .amp,
.fecho-ghost {
  display: inline-block;
  aspect-ratio: 560 / 636;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  -webkit-mask: var(--e-logo) no-repeat center / contain;
  mask: var(--e-logo) no-repeat center / contain;
}

/* ---------- CABEÇALHO: ver "CABEÇALHO DE PORTAL" no fim ---------- */
.btn { font-weight: 600; letter-spacing: 0; }

/* Masthead: a linha de cima das duas páginas */
.masthead { border-bottom-color: var(--linha-suave); }
.masthead span { font-weight: 600; letter-spacing: 0.16em; }
.masthead .mh-right,
.masthead .mh-right a { color: #7A5A18; }
.masthead a { transition: color 200ms var(--ease); }
.masthead a:hover { color: var(--ink); }

/* ============================================================
   PÁGINA DE ARTIGO
   ============================================================ */
.art-head { padding: clamp(2rem, 4.4vw, 3.5rem) 0 clamp(2.25rem, 4vw, 3.5rem); }

/* etiqueta do núcleo em pílula + data e tempo de leitura */
.art-kicker {
  gap: 8px 12px;
  margin-top: clamp(1.75rem, 3.6vw, 2.75rem);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-faint);
}
.art-kicker > :first-child {
  display: inline-flex;
  align-items: center;
  padding: 6px 13px 7px;
  border-radius: var(--r-pill);
  background: rgba(240, 187, 74, 0.2);
  color: #6A4E12;
  font-weight: 600;
}
.art-kicker .when { color: var(--text-faint); font-weight: 500; }
.art-kicker .dot { background: var(--rule-mid); opacity: 1; }
/* depois da pílula o ponto sobra */
.art-kicker > :first-child + .dot { display: none; }

/* O título atravessa a coluna inteira: nada à direita, nada de
   deixá-lo no canto. */
.art-title {
  max-width: none;
  margin-top: clamp(1rem, 1.8vw, 1.375rem);
  font-size: clamp(2.125rem, 3.6vw + 0.75rem, 4rem);
  line-height: 1.06;
  letter-spacing: -0.034em;
}
.art-standfirst {
  max-width: none;
  margin-top: clamp(1rem, 1.8vw, 1.375rem);
  font-family: var(--sans);
  font-style: normal;
  font-weight: 400;
  font-size: clamp(1.125rem, 0.6vw + 0.95rem, 1.375rem);
  line-height: 1.5;
  letter-spacing: -0.005em;
  color: var(--text-soft);
  text-wrap: pretty;
}

/* Assinatura: selo com o "&" da logo, quem escreve e o núcleo */
.art-byline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 16px;
  margin-top: clamp(1.75rem, 3vw, 2.25rem);
  padding-top: clamp(1.25rem, 2vw, 1.5rem);
  border-top: 1px solid var(--linha-suave);
  font-size: 0.875rem;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-faint);
}
.art-byline-selo {
  flex: none;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--ink);
}
.art-byline-selo::before {
  content: "";
  width: 19px;
  aspect-ratio: 560 / 636;
  background: var(--gold);
  -webkit-mask: var(--e-logo) no-repeat center / contain;
  mask: var(--e-logo) no-repeat center / contain;
}
.art-byline-txt { display: grid; gap: 2px; min-width: 0; }
.art-byline .autor {
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--ink);
}
.art-byline .who { font-weight: 500; color: var(--text-faint); }
.art-byline-aviso {
  margin-left: auto;
  padding: 7px 14px 8px;
  border-radius: var(--r-pill);
  background: var(--card);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--text-soft);
}

.art-cover {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  border-radius: 20px;
  box-shadow: none;
  background: #111318;
}
@media (min-width: 720px) {
  .art-cover { border-radius: var(--r-xl); }
}

/* ---------- CORPO ---------- */
@media (min-width: 1080px) {
  .art-shell {
    grid-template-columns: minmax(0, 700px) 268px;
    gap: 64px;
  }
}

/* Sumário: um cartão cinza; o item em leitura vira uma pílula branca */
.art-toc {
  padding: 4px 18px;
  border-radius: 20px;
  background: var(--card);
}
@media (min-width: 1080px) {
  .art-toc {
    top: calc(var(--nav-h) + 28px);
    padding: 20px 14px 12px;
    border-radius: 24px;
    max-height: calc(100vh - var(--nav-h) - 56px);
    scrollbar-width: none;
  }
  .art-toc::-webkit-scrollbar { display: none; }
}
.art-toc-label {
  padding: 14px 0;
  border-bottom: 0;
  font-size: 0.6875rem;
  letter-spacing: 0.16em;
  color: var(--text-faint);
}
.art-toc-label::after { font-size: 1.125rem; line-height: 1; color: #A87A1F; }
@media (min-width: 1080px) {
  .art-toc-label { padding: 0 8px 12px; }
}
.art-toc ol { margin-top: 0; padding-bottom: 12px; }
@media (min-width: 1080px) {
  .art-toc ol { padding-bottom: 0; }
}
.art-toc li { border-bottom: 0; }
.art-toc li + li { margin-top: 2px; }
.art-toc a {
  grid-template-columns: 1.9rem 1fr;
  gap: 6px;
  padding: 9px 10px;
  margin-inline: -10px;
  border-radius: 12px;
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--text-soft);
  transition: background-color 220ms var(--ease), color 220ms var(--ease);
}
@media (min-width: 1080px) {
  .art-toc a { margin-inline: 0; }
  .art-toc a:hover { padding-left: 10px; }
}
.art-toc a .n {
  font-family: var(--sans);
  font-style: normal;
  font-size: 0.75rem;
  font-weight: 600;
  color: #A87A1F;
  opacity: 1;
}
.art-toc a:hover { background: var(--card-2); color: var(--ink); }
.art-toc a[aria-current="true"] {
  background: #FFFFFF;
  color: var(--ink);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(16, 18, 24, 0.05), 0 6px 16px -10px rgba(16, 18, 24, 0.25);
}

/* Prosa */
.art-body { font-size: 1.0625rem; line-height: 1.75; }
@media (min-width: 720px) {
  .art-body { font-size: 1.0938rem; line-height: 1.78; }
}
.art-body strong { font-weight: 700; }

/* capitular na Manrope: menor e mais pesada que a da Fraunces */
.art-body > p:first-of-type::first-letter {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 3.3em;
  line-height: 0.8;
  padding: 0.07em 0.1em 0 0;
  letter-spacing: -0.02em;
  font-variation-settings: normal;
}
/* onde há initial-letter, a capitular ocupa exatamente duas linhas */
@supports (initial-letter: 2) or (-webkit-initial-letter: 2) {
  .art-body > p:first-of-type::first-letter {
    float: none;
    font-size: inherit;
    line-height: inherit;
    padding: 0;
    margin-right: 0.12em;
    -webkit-initial-letter: 2;
    initial-letter: 2;
  }
}

/* títulos de seção: numeral dourado e o texto, sem fio solto */
.art-body h2 {
  display: block;
  margin-top: 2.3em;
  font-size: clamp(1.5rem, 1.1vw + 1.1rem, 1.875rem);
  line-height: 1.2;
  letter-spacing: -0.024em;
}
.art-body h2::after { display: none; }
.art-body h2 .n {
  display: inline-block;
  margin-right: 0.4em;
  font-style: normal;
  font-size: 0.72em;
  font-weight: 700;
  letter-spacing: 0;
  color: #A87A1F;
  transform: translateY(-0.06em);
}
.art-body h3 { font-size: 1.25rem; letter-spacing: -0.016em; }

/* listas: bolinha dourada no lugar do traço */
.art-body ul li::before {
  top: 0.68em;
  left: 0.2em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
}
.art-body ol li::before { font-weight: 700; color: #A87A1F; }

.art-body a:not(.btn) { color: #7A5A18; border-bottom-color: rgba(122, 90, 24, 0.35); }

/* Citação de destaque: o bloco dourado da home */
.art-quote {
  margin-block: 2.2em;
  padding: clamp(24px, 3vw, 36px) clamp(24px, 3.2vw, 40px);
  border-radius: var(--r-lg);
  background: var(--gold);
}
.art-quote p {
  font-family: var(--serif);
  font-style: normal;
  font-weight: 600;
  font-size: clamp(1.25rem, 1vw + 0.95rem, 1.5625rem);
  line-height: 1.36;
  letter-spacing: -0.018em;
  color: var(--ink);
  text-wrap: pretty;
}
.art-quote cite {
  font-weight: 600;
  letter-spacing: 0.14em;
  color: rgba(26, 29, 36, 0.66);
}

/* Quadro prático */
.art-box {
  padding: clamp(24px, 3vw, 34px);
  border-radius: var(--r-lg);
  background: var(--card);
}
.art-box-label { color: #7A5A18; letter-spacing: 0.16em; }
.art-box h3 { font-size: 1.25rem; }
.art-box p, .art-box li { color: var(--text-soft); }

/* Resumo em setas sob cada seção: cinza frio, não mais o creme */
.art-setas {
  padding: 16px 20px 17px;
  border-radius: var(--r-md);
  background: var(--card);
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--ink);
}
@media (min-width: 720px) { .art-setas { font-size: 1.0313rem; padding: 17px 24px 18px; } }
.art-setas-rotulo { color: #7A5A18; letter-spacing: 0.16em; }
.art-setas .seta { color: #A87A1F; font-weight: 600; }
.art-body ul.art-flechas li::before { font-weight: 700; color: #A87A1F; border-radius: 0; }

.art-body ol.art-fluxo li {
  padding: 20px 20px 22px;
  border: 0;
  border-radius: var(--r-md);
  background: var(--card);
}
.art-body ol.art-fluxo li::before { font-weight: 700; }
.art-cartao {
  padding: 20px 22px 22px;
  border: 0;
  border-radius: var(--r-md);
  background: var(--card);
}
.art-body .art-cartao h3, .art-cartao-titulo { color: #7A5A18; letter-spacing: 0.14em; }
.art-cartao.nao { background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--linha-suave); }
.art-nota {
  padding: 16px 20px;
  border: 0;
  border-radius: var(--r-md);
  background: var(--card);
}

/* Resumo interativo: o painel de tinta da home */
.art-resumo {
  padding: clamp(24px, 3.4vw, 40px);
  border-radius: var(--r-xl);
  background:
    radial-gradient(90% 110% at 88% 0%, rgba(240, 187, 74, 0.09), transparent 55%),
    var(--ink-grad);
  box-shadow: none;
}
.art-resumo-rotulo { letter-spacing: 0.16em; }
.art-body .art-resumo .art-resumo-titulo { letter-spacing: -0.024em; }
.art-resumo-tab .n,
.art-resumo h3 .n { font-weight: 700; }
.art-resumo-base { color: var(--gold-soft) !important; }

/* Fim do artigo */
.art-end { border-top-color: var(--linha-suave); gap: 12px; }
.art-end .amp { width: 18px; background: var(--gold); }
.art-end span:last-child { font-weight: 600; letter-spacing: 0.14em; }
.art-disclaimer { font-style: normal; font-size: 0.8125rem; color: var(--text-faint); }

/* ---------- LEIA TAMBÉM: os cartões da home ---------- */
.art-rel {
  padding: clamp(1rem, 2vw, 1.5rem) 0 0;
  background: #FFFFFF;
  border-top: 0;
}
.ap-sec-head { align-items: center; }
.ap-sec-num { width: 17px; background: var(--gold); }
.ap-sec-title { font-size: clamp(1.375rem, 1.2vw + 1rem, 1.875rem); letter-spacing: -0.024em; }
.ap-sec-rule { background: var(--linha-suave); }
.ap-sec-count,
a.ap-sec-count {
  padding: 8px 15px 9px;
  border: 0;
  border-radius: var(--r-pill);
  background: var(--card);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink);
  transition: background-color 240ms var(--ease), color 240ms var(--ease);
}
a.ap-sec-count:hover { background: var(--ink); color: #FFFFFF; }

.art-rel-grid { gap: 14px; }
@media (min-width: 1024px) { .art-rel-grid { gap: 16px; } }
.art-rel-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 0;
  padding: 10px;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: none;
  transition: background-color 320ms var(--ease), transform 320ms var(--ease), box-shadow 320ms var(--ease);
}
.art-rel-fig {
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border-radius: var(--r-md);
  background: #111318;
}
.art-rel-fig img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms var(--ease);
}
.art-rel-txt {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 10px;
  padding: 18px 14px 12px;
}
.art-rel-card .tag {
  align-self: flex-start;
  padding: 5px 11px;
  border-radius: var(--r-pill);
  background: #FFFFFF;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: #7A5A18;
  transition: background-color 320ms var(--ease), color 320ms var(--ease);
}
.art-rel-card h3 {
  margin-top: 4px;
  font-size: clamp(1.15rem, 0.4vw + 1.02rem, 1.375rem);
  line-height: 1.22;
  letter-spacing: -0.014em;
  transition: color 320ms var(--ease);
}
.art-rel-card p { color: var(--text-soft); transition: color 320ms var(--ease); }
/* a seta num círculo, sobre a capa, como na home */
.art-rel-card .go {
  position: absolute;
  top: 22px;
  right: 22px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  background: #FFFFFF;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1;
  color: var(--ink);
  transform: rotate(-45deg);
  box-shadow: 0 6px 18px -8px rgba(0, 0, 0, 0.45);
  transition: background-color 320ms var(--ease), transform 320ms var(--ease);
}
.art-rel-card:focus-visible { outline: 2px solid #A87A1F; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
  .art-rel-card:hover {
    background: var(--ink);
    transform: translateY(-4px);
    box-shadow: var(--sombra-forte);
  }
  .art-rel-card:hover .art-rel-fig img { transform: scale(1.04); }
  .art-rel-card:hover h3 { color: #FFFFFF; }
  .art-rel-card:hover p { color: rgba(255, 255, 255, 0.72); }
  .art-rel-card:hover .tag { background: rgba(240, 187, 74, 0.14); color: var(--gold); }
  .art-rel-card:hover .go { background: var(--gold); transform: rotate(0deg); }
}

/* ---------- FECHO + RODAPÉ ---------- */
.fecho { margin-top: clamp(3rem, 6vw, 5rem); }
.fecho > .container {
  border-radius: var(--r-xl);
  background:
    radial-gradient(90% 120% at 86% 0%, rgba(240, 187, 74, 0.1), transparent 54%),
    var(--ink-grad);
}
.fecho-ghost {
  right: clamp(24px, 4vw, 56px);
  bottom: -14%;
  width: clamp(9rem, 17vw, 14rem);
  background: var(--gold);
  opacity: 0.08;
}
.fecho .eyebrow { color: var(--gold); }
.fecho h2 {
  max-width: 17em;
  font-size: clamp(1.75rem, 2vw + 1rem, 2.625rem);
  line-height: 1.12;
  letter-spacing: -0.028em;
  color: #FFFFFF;
}
.fecho h2 em { font-style: normal; color: var(--gold); }
.fecho .btn-gold { border-radius: 14px; }

.rodape { background: var(--card); }
.rodape p { max-width: 64ch; border-top-color: var(--linha-suave); color: var(--text-faint); }
.rodape a { color: #7A5A18; }
.rodape a:hover { color: var(--ink); }

/* ============================================================
   CABEÇALHO DE PORTAL (24/09/2026)
   Pedido do dono: "centralizar a logo no meio, como se fosse o G1…
   tira o voltar ao site… use o amarelo". Faixa dourada de ponta a
   ponta, logo no centro (volta ao site do escritório) com "Artigos"
   ao lado, menu à esquerda, diagnóstico à direita. Serve à página
   principal e às páginas de artigo.
   ============================================================ */
:root { --nav-h: 64px; }
@media (min-width: 1024px) { :root { --nav-h: 80px; } }

.nav--pub {
  background:
    radial-gradient(120% 220% at 0% 0%, rgba(255, 236, 190, 0.55) 0%, rgba(255, 236, 190, 0) 46%),
    var(--gold);
  border-bottom: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: 0 1px 0 rgba(26, 29, 36, 0.08);
}
.nav--pub .nav-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}
/* a barra de leitura corre sobre o dourado: em tinta */
.read-bar { background: var(--ink); height: 3px; }

/* marca no centro */
.nav-marca {
  justify-self: center;
  display: flex;
  align-items: center;
  gap: clamp(10px, 1.4vw, 16px);
}
.nav--pub .nav-logo img {
  height: 30px;
  transform: none;
  /* sobre o dourado o "&" da logo sumiria: a marca inteira em tinta */
  filter: brightness(0);
}
@media (min-width: 620px) { .nav--pub .nav-logo img { height: 36px; } }
@media (min-width: 1024px) { .nav--pub .nav-logo img { height: 42px; } }
.nav-div {
  width: 1px;
  height: 24px;
  background: rgba(26, 29, 36, 0.3);
}
.nav-pub {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--serif);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ink);
  transition: opacity 200ms var(--ease);
}
@media (min-width: 1024px) { .nav-pub { font-size: 1.3125rem; } }
.nav-pub:hover { opacity: 0.72; }

/* diagnóstico à direita, em tinta sobre o dourado */
.nav--pub .nav-cta {
  justify-self: end;
  gap: 9px;
  min-height: 44px;
  padding: 0 20px;
  background: var(--ink);
  color: #FFFFFF;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
}
.nav--pub .nav-cta:hover { background: #000000; }
.nav-cta-ic { display: none; flex: none; }
@media (max-width: 619.98px) {
  /* no celular o botão vira um círculo com o balão; o texto fica
     para o leitor de tela */
  .nav--pub .nav-cta { width: 44px; padding: 0; justify-content: center; }
  .nav--pub .nav-cta .lbl-longo {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip-path: inset(50%); white-space: nowrap;
  }
  .nav-cta-ic { display: block; }
}
.nav--pub .nav-cta:focus-visible,
.nav--pub a:focus-visible { outline-color: var(--ink); }

/* menu à esquerda: um <details> que abre um cartão branco */
.nav-menu { position: relative; justify-self: start; }
.nav-menu-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  min-width: 44px;
  padding: 0 16px 0 13px;
  border-radius: var(--r-pill);
  font-family: var(--sans);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  list-style: none;
  user-select: none;
  transition: background-color 200ms var(--ease);
}
.nav-menu-btn::-webkit-details-marker { display: none; }
.nav-menu-btn:hover,
.nav-menu[open] .nav-menu-btn { background: rgba(26, 29, 36, 0.1); }
.nav-menu-btn:focus-visible { outline-color: var(--ink); }
.nav-menu-ic { display: grid; gap: 4px; width: 18px; }
.nav-menu-ic i {
  display: block;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform 260ms var(--ease), opacity 200ms var(--ease);
}
.nav-menu[open] .nav-menu-ic i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-menu[open] .nav-menu-ic i:nth-child(2) { opacity: 0; }
.nav-menu[open] .nav-menu-ic i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 619.98px) {
  .nav-menu-btn { padding: 0; justify-content: center; }
  .nav-menu-btn .lbl { display: none; }
  /* no celular o cartão do menu fica centrado, 16px de cada lado */
  .nav-menu-painel { left: calc(16px - clamp(24px, 4vw, 32px)); width: calc(100vw - 32px); }
}
.nav-menu-painel {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  z-index: 2;
  width: min(360px, calc(100vw - 32px));
  max-height: calc(100vh - var(--nav-h) - 32px);
  overflow-y: auto;
  padding: 16px;
  border-radius: 24px;
  background: #FFFFFF;
  box-shadow: 0 0 0 1px rgba(26, 29, 36, 0.06), 0 30px 60px -28px rgba(15, 17, 22, 0.45);
  animation: menu-entra 260ms var(--ease) both;
  scrollbar-width: thin;
}
@keyframes menu-entra {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}
.nav-menu-rotulo {
  margin: 4px 10px 8px;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-faint);
}
.nav-menu-rotulo + ul + .nav-menu-rotulo { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--linha-suave); }
.nav-menu-painel ul { display: grid; gap: 2px; }
.nav-menu-painel a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  padding: 8px 10px;
  border-radius: 12px;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.3;
  color: var(--text);
  transition: background-color 200ms var(--ease), color 200ms var(--ease);
}
.nav-menu-painel a:hover { background: var(--card); color: var(--ink); }
.nav-menu-painel .qtd {
  flex: none;
  min-width: 28px;
  padding: 2px 8px;
  border-radius: var(--r-pill);
  background: var(--card);
  font-size: 0.75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
  color: var(--text-soft);
}
.nav-menu-painel a[aria-current="true"] { background: var(--ink); color: #FFFFFF; }
.nav-menu-painel a[aria-current="true"] .qtd { background: rgba(240, 187, 74, 0.18); color: var(--gold); }
.nav-menu-site a::after {
  content: "→";
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: #A87A1F;
  transform: rotate(-45deg);
}

/* etiqueta do núcleo no artigo: leva aos artigos do núcleo */
a.art-kicker-nucleo { transition: background-color 220ms var(--ease), color 220ms var(--ease); }
a.art-kicker-nucleo:hover { background: var(--ink); color: var(--gold); }

/* ============================================================
   PÁGINA PRINCIPAL DOS ARTIGOS
   editorias (o filtro) → destaque em tinta → três recentes →
   "Mais artigos" em cartões + trilho → fecho dourado
   ============================================================ */

/* ---------- editorias + busca ---------- */
.pt-editorias { padding-top: clamp(16px, 2vw, 24px); }
.pt-ed-barra { display: flex; align-items: center; gap: 12px; }
.pt-ed-nav { flex: 1 1 auto; min-width: 0; }
.pt-ed-lista {
  display: flex;
  gap: 6px;
  padding: 2px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.pt-ed-lista::-webkit-scrollbar { display: none; }
@media (min-width: 720px) and (max-width: 1199.98px) {
  /* quando não cabe tudo, a faixa desliza e some suave sob a busca */
  .pt-ed-lista {
    -webkit-mask-image: linear-gradient(to right, #000 88%, transparent);
    mask-image: linear-gradient(to right, #000 88%, transparent);
    padding-right: 48px;
  }
}
@media (max-width: 719.98px) {
  /* no celular a busca vem primeiro, e as editorias deslizam de borda a borda */
  .pt-ed-barra { flex-direction: column; align-items: stretch; gap: 12px; }
  .pt-busca { order: -1; }
  .pt-ed-lista {
    margin-inline: calc(-1 * clamp(24px, 4vw, 32px));
    padding-inline: clamp(24px, 4vw, 32px);
    scroll-padding-inline: clamp(24px, 4vw, 32px);
  }
}

.pt-busca {
  position: relative;
  flex: 0 0 auto;
  width: 126px;
  height: 44px;
  --busca-aberta: min(360px, 70vw);
}
.pt-busca[hidden] { display: none; }
/* recolhida em "Buscar"; ao entrar, abre para a esquerda por cima
   das editorias, sem empurrar nada */
.pt-busca-campo {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 100%;
  height: 44px;
  padding: 0 14px 0 42px;
  border: 1px solid var(--linha-suave);
  border-radius: var(--r-pill);
  background: #FFFFFF;
  font-family: var(--sans);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ink);
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition: width 320ms var(--ease), border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
.pt-busca-campo::placeholder { color: var(--ink); opacity: 1; }
.pt-busca-campo:hover { border-color: #C9CDD5; }
.pt-busca-campo:focus,
.pt-busca.tem-texto .pt-busca-campo {
  width: var(--busca-aberta);
  padding-right: 12px;
  font-weight: 500;
  cursor: text;
  box-shadow: 0 10px 30px -18px rgba(15, 17, 22, 0.45);
}
.pt-busca-campo:focus {
  outline: none;
  border-color: var(--ink);
  box-shadow: 0 0 0 4px rgba(240, 187, 74, 0.45), 0 10px 30px -18px rgba(15, 17, 22, 0.45);
}
.pt-busca-campo:focus::placeholder { color: var(--text-faint); }
.pt-busca-campo::-webkit-search-decoration { -webkit-appearance: none; }
.pt-busca-campo::-webkit-search-cancel-button {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    linear-gradient(45deg, transparent 44%, #FFFFFF 44%, #FFFFFF 56%, transparent 56%),
    linear-gradient(-45deg, transparent 44%, #FFFFFF 44%, #FFFFFF 56%, transparent 56%),
    var(--text-faint);
  cursor: pointer;
}
.pt-busca-ic {
  position: absolute;
  left: 15px;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  color: var(--ink);
  pointer-events: none;
  transition: left 320ms var(--ease), color 200ms var(--ease);
}
/* a lupa acompanha a borda esquerda do campo quando ele abre */
.pt-busca:focus-within .pt-busca-ic,
.pt-busca.tem-texto .pt-busca-ic { left: calc(100% - var(--busca-aberta) + 15px); color: var(--text-faint); }
@media (max-width: 719.98px) {
  .pt-busca { width: 100%; --busca-aberta: 100%; }
  .pt-busca-campo,
  .pt-busca-campo:focus,
  .pt-busca.tem-texto .pt-busca-campo { width: 100%; font-weight: 500; cursor: text; }
  .pt-busca-campo::placeholder { color: var(--text-faint); }
}

.pt-ed {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: var(--r-pill);
  background: var(--card);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ink);
  white-space: nowrap;
  transition: background-color 220ms var(--ease), color 220ms var(--ease);
}
.pt-ed .qtd {
  font-size: 0.75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text-faint);
  transition: color 220ms var(--ease);
}
.pt-ed:hover { background: var(--card-2); }
.pt-ed[aria-current="true"] { background: var(--ink); color: #FFFFFF; }
.pt-ed[aria-current="true"] .qtd { color: var(--gold); }

/* ---------- destaque: painel de tinta, a capa se funde ao fundo ---------- */
.pt-bloco-destaque { padding-top: clamp(16px, 2vw, 24px); }
.pt-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  border-radius: 28px;
  background: #101217;
  color: #FFFFFF;
}
/* a própria capa, desfocada, vira a luz do painel */
.pt-hero-fundo {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}
.pt-hero-fundo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(46px) saturate(1.25);
  opacity: 0.5;
  transform: scale(1.25);
}
.pt-hero-fundo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(14, 16, 21, 0.9) 0%, rgba(14, 16, 21, 0.55) 55%, rgba(14, 16, 21, 0.15) 100%);
}
.pt-hero-fig {
  position: relative;
  z-index: 0;
  display: block;
  order: -1;
}
.pt-hero-fig img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform 900ms var(--ease);
  -webkit-mask-image: linear-gradient(to bottom, #000 72%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 72%, transparent 100%);
}
.pt-hero-txt { padding: 4px 22px 26px; }
@media (max-width: 719.98px) {
  /* no celular o resumo do destaque para na quarta linha */
  .pt-hero-lead {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
  }
}
.pt-hero-tag {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.62);
}
.pt-hero-nucleo {
  padding: 6px 13px 7px;
  border-radius: var(--r-pill);
  background: var(--gold);
  color: var(--ink);
  font-weight: 700;
}
.pt-hero-titulo {
  margin-top: 16px;
  font-size: clamp(1.75rem, 1.7vw + 1.15rem, 3rem);
  line-height: 1.08;
  letter-spacing: -0.032em;
  color: #FFFFFF;
}
.pt-hero-titulo a { color: inherit; }
/* o painel inteiro leva ao artigo */
.pt-hero-titulo a::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
.pt-hero-lead {
  margin-top: 16px;
  max-width: 36em;
  font-size: 1rem;
  line-height: 1.62;
  color: rgba(255, 255, 255, 0.74);
  text-wrap: pretty;
}
.pt-hero-rodape {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 24px;
  margin-top: 26px;
}
.pt-hero-ler {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 7px 7px 7px 20px;
  border-radius: var(--r-pill);
  background: var(--gold);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ink);
  transition: background-color 280ms var(--ease);
}
.pt-hero-ler .ar {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--gold);
  transform: rotate(-45deg);
  transition: transform 280ms var(--ease);
}
.pt-hero-quem {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.6);
}
.pt-hero-quem > span:last-child { display: grid; gap: 1px; }
.pt-hero-quem strong { font-size: 0.875rem; font-weight: 600; color: #FFFFFF; }
.pt-hero .art-byline-selo { width: 40px; height: 40px; background: rgba(255, 255, 255, 0.1); }
.pt-hero .art-byline-selo::before { width: 16px; }
@media (hover: hover) and (pointer: fine) {
  .pt-hero:hover .pt-hero-fig img { transform: scale(1.03); }
  .pt-hero:hover .pt-hero-ler { background: var(--gold-soft); }
  .pt-hero:hover .pt-hero-ler .ar { transform: rotate(0deg); }
}
.pt-hero:focus-within { outline: 2px solid var(--gold); outline-offset: 3px; }
.pt-hero-titulo a:focus-visible { outline: none; }

@media (min-width: 900px) {
  .pt-hero {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    align-items: center;
    border-radius: 34px;
  }
  .pt-hero-fig { order: 0; align-self: center; }
  /* só a borda esquerda e as pontas se dissolvem no painel */
  .pt-hero-fig img {
    -webkit-mask-image:
      linear-gradient(to right, transparent 0%, #000 20%),
      linear-gradient(to bottom, transparent 0%, #000 7%, #000 93%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image:
      linear-gradient(to right, transparent 0%, #000 20%),
      linear-gradient(to bottom, transparent 0%, #000 7%, #000 93%, transparent 100%);
    mask-composite: intersect;
  }
  .pt-hero-txt { padding: clamp(32px, 4vw, 60px) 8px clamp(32px, 4vw, 60px) clamp(32px, 4vw, 60px); }
  .pt-hero-lead { font-size: 1.0625rem; }
}

/* ---------- cabeçalhos de seção ---------- */
.pt-sec { margin: clamp(44px, 5.4vw, 72px) 0 clamp(16px, 2vw, 24px); }
.pt-sec-mark { width: 10px; height: 10px; background: var(--gold); }
.pt-sec h2 { font-size: clamp(1.375rem, 0.9vw + 1.05rem, 1.875rem); letter-spacing: -0.024em; }
.pt-sec-rule { background: var(--linha-suave); }
.pt-sec-count {
  padding: 6px 13px 7px;
  border-radius: var(--r-pill);
  background: var(--card);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-soft);
}

/* ---------- etiquetas e meta ---------- */
.pt-tag {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.pt-tag > span:first-child {
  padding: 5px 11px;
  border-radius: var(--r-pill);
  background: #FFFFFF;
  color: #7A5A18;
  transition: background-color 320ms var(--ease), color 320ms var(--ease);
}
.pt-tag time { font-weight: 500; letter-spacing: 0; color: var(--text-faint); transition: color 320ms var(--ease); }
.pt-meta {
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-faint);
  transition: color 320ms var(--ease);
}
@media (max-width: 719.98px) {
  .pt-tag { flex-direction: row; align-items: center; }
}

/* ---------- cartões (a peça da seção de artigos da home) ---------- */
.pt-cards { display: grid; gap: 14px; }
@media (min-width: 1024px) { .pt-cards { gap: 16px; } }
.pt-card-item { min-width: 0; }
.pt-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 10px;
  border-radius: var(--r-lg);
  background: var(--card);
  color: var(--ink);
  transition: background-color 320ms var(--ease), transform 320ms var(--ease), box-shadow 320ms var(--ease);
}
.pt-card-fig {
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border-radius: var(--r-md);
  background: #111318;
}
.pt-card-fig img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms var(--ease);
}
.pt-card-txt {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 10px;
  padding: 16px 12px 10px;
}
.pt-card-titulo {
  display: block;
  margin-top: 2px;
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(1.0625rem, 0.35vw + 1rem, 1.25rem);
  line-height: 1.24;
  letter-spacing: -0.014em;
  text-wrap: pretty;
  transition: color 320ms var(--ease);
}
.pt-card-resumo {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--text-soft);
  transition: color 320ms var(--ease);
}
.pt-card .pt-meta { margin-top: auto; padding-top: 2px; }
.pt-card-go {
  position: absolute;
  top: 20px;
  right: 20px;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #FFFFFF;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1;
  color: var(--ink);
  transform: rotate(-45deg);
  box-shadow: 0 6px 18px -8px rgba(0, 0, 0, 0.45);
  transition: background-color 320ms var(--ease), transform 320ms var(--ease);
}
.pt-card:focus-visible { outline: 2px solid #A87A1F; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
  .pt-card:hover {
    background: var(--ink);
    transform: translateY(-4px);
    box-shadow: var(--sombra-forte);
  }
  .pt-card:hover .pt-card-fig img { transform: scale(1.04); }
  .pt-card:hover .pt-card-titulo { color: #FFFFFF; }
  .pt-card:hover .pt-card-resumo { color: rgba(255, 255, 255, 0.72); }
  .pt-card:hover .pt-meta,
  .pt-card:hover .pt-tag time { color: rgba(255, 255, 255, 0.55); }
  .pt-card:hover .pt-tag > span:first-child { background: rgba(240, 187, 74, 0.14); color: var(--gold); }
  .pt-card:hover .pt-card-go { background: var(--gold); transform: rotate(0deg); }
}

/* três recentes: lado a lado; no celular, uma faixa que desliza */
@media (min-width: 900px) {
  .pt-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 899.98px) {
  .pt-cards--3 {
    grid-auto-flow: column;
    grid-auto-columns: min(84%, 380px);
    gap: 10px;
    margin-inline: calc(-1 * clamp(24px, 4vw, 32px));
    padding-inline: clamp(24px, 4vw, 32px);
    scroll-padding-inline: clamp(24px, 4vw, 32px);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .pt-cards--3::-webkit-scrollbar { display: none; }
  .pt-cards--3 > li { scroll-snap-align: start; }
  .pt-cards--3 .pt-card-resumo { -webkit-line-clamp: 2; }
}

/* biblioteca: duas colunas ao lado do trilho */
@media (min-width: 620px) {
  .pt-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* no celular estreito os cartões viram linhas: capa pequena à esquerda */
@media (max-width: 619.98px) {
  .pt-cards--2 { gap: 8px; }
  .pt-cards--2 .pt-card {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 10px;
    border-radius: 20px;
  }
  .pt-cards--2 .pt-card-fig { border-radius: 12px; }
  .pt-cards--2 .pt-card-txt { gap: 6px; padding: 2px 4px 4px 0; }
  .pt-cards--2 .pt-card-titulo { font-size: 1rem; line-height: 1.28; }
  .pt-cards--2 .pt-card-resumo { display: none; }
  .pt-cards--2 .pt-card-go { display: none; }
  .pt-cards--2 .pt-tag > span:first-child { padding: 0; background: transparent; }
  .pt-cards--2 .pt-meta { font-size: 0.75rem; }
}

/* o cartão largo: capa à esquerda, texto à direita, as duas colunas */
@media (min-width: 620px) {
  .pt-cards--2 > .is-largo { grid-column: 1 / -1; }
  .pt-cards--2 > .is-largo .pt-card {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    padding: 12px;
    border-radius: var(--r-xl);
  }
  .pt-cards--2 > .is-largo .pt-card-fig { border-radius: 20px; }
  .pt-cards--2 > .is-largo .pt-card-txt { justify-content: center; gap: 12px; padding: clamp(12px, 2vw, 28px); }
  .pt-cards--2 > .is-largo .pt-card-titulo {
    font-size: clamp(1.25rem, 0.8vw + 1rem, 1.625rem);
    line-height: 1.16;
    letter-spacing: -0.02em;
  }
  .pt-cards--2 > .is-largo .pt-card-resumo { -webkit-line-clamp: 4; }
  .pt-cards--2 > .is-largo .pt-meta { margin-top: 4px; }
  .pt-cards--2 > .is-largo .pt-card-go { top: 24px; left: 24px; right: auto; }
}

/* sem filtro, os quatro do topo não se repetem na biblioteca */
.pt-card-item.is-topo { display: none; }
.is-filtrado .pt-card-item.is-topo:not([hidden]) { display: block; }
.pt-card-item[hidden] { display: none !important; }
.is-filtrado .pt-bloco-destaque,
.is-filtrado .pt-recentes { display: none; }
.is-filtrado .pt-biblioteca .pt-sec { margin-top: clamp(28px, 3.6vw, 44px); }

.pt-filtro-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  margin: -4px 0 20px;
}
.pt-filtro-info[hidden] { display: none; }
.pt-filtro-busca {
  padding: 7px 14px 8px;
  border-radius: var(--r-pill);
  background: rgba(240, 187, 74, 0.22);
  font-size: 0.875rem;
  font-weight: 600;
  color: #5E4510;
}
.pt-filtro-busca[hidden],
.pt-filtro-nucleo[hidden] { display: none; }
.pt-vazio {
  display: grid;
  justify-items: start;
  gap: 8px;
  padding: clamp(24px, 3vw, 36px);
  border-radius: var(--r-lg);
  background: var(--card);
  color: var(--text-soft);
}
.pt-vazio[hidden] { display: none; }
.pt-vazio-titulo { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; color: var(--ink); }
.pt-vazio .pt-filtro-limpar { margin-top: 8px; }
.pt-filtro-limpar {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 16px;
  border-radius: var(--r-pill);
  background: var(--ink);
  font-size: 0.875rem;
  font-weight: 600;
  color: #FFFFFF;
  transition: background-color 220ms var(--ease);
}
.pt-filtro-limpar::before {
  content: "←";
  margin-right: 8px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--gold);
}
.pt-filtro-limpar:hover { background: #000000; }
.pt-filtro-nucleo {
  font-size: 0.875rem;
  font-weight: 600;
  color: #7A5A18;
  border-bottom: 1px solid rgba(122, 90, 24, 0.35);
  padding-bottom: 1px;
}
.pt-filtro-nucleo:hover { color: var(--ink); border-bottom-color: var(--ink); }

/* ---------- biblioteca + trilho ---------- */
.pt-biblioteca .pt-grid { padding-bottom: 0; }
@media (min-width: 1040px) {
  .pt-biblioteca .pt-grid { grid-template-columns: minmax(0, 1fr) 292px; gap: clamp(32px, 3.6vw, 56px); }
  .pt-rail { top: calc(var(--nav-h) + 24px); }
}
.pt-rail { gap: 14px; }
.pt-bloco { padding: 22px 20px; border-radius: var(--r-lg); background: var(--card); }
.pt-bloco-titulo {
  border-bottom-color: var(--linha-suave);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.16em;
}
@media (min-width: 1040px) {
  /* o trilho só existe ao lado da biblioteca: alinha com o título dela */
  .pt-rail { margin-top: clamp(44px, 5.4vw, 72px); }
  .is-filtrado .pt-rail { margin-top: clamp(28px, 3.6vw, 44px); }
}
/* no celular e no tablet o filtro é a faixa de editorias do topo */
@media (max-width: 1039.98px) {
  .pt-bloco--filtro { display: none; }
  /* o convite do trilho repetiria o fecho logo abaixo */
  .pt-rail .pt-cta { display: none; }
  .pt-rail { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin-top: 28px; }
}
.pt-nucleos { display: grid; gap: 2px; margin-top: 8px; }
.pt-nucleos li + li { border-top: 0; }
.pt-nucleos a {
  grid-template-columns: 1.7rem 1fr auto;
  align-items: center;
  margin-inline: -10px;
  padding: 9px 10px;
  border-radius: 12px;
  font-weight: 500;
  color: var(--text-soft);
  transition: background-color 220ms var(--ease), color 220ms var(--ease);
}
.pt-nucleos a .n { font-weight: 700; letter-spacing: 0.04em; color: var(--text-faint); }
.pt-nucleos a .qtd {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 22px;
  padding: 0 7px;
  border-radius: var(--r-pill);
  background: #FFFFFF;
  font-family: var(--sans);
  font-style: normal;
  font-size: 0.6875rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #7A5A18;
}
.pt-nucleos a:hover { background: var(--card-2); color: var(--ink); }
.pt-nucleos a[aria-current="true"] { background: var(--ink); color: #FFFFFF; font-weight: 600; }
.pt-nucleos a[aria-current="true"] .n { color: rgba(255, 255, 255, 0.5); }
.pt-nucleos a[aria-current="true"] .qtd { background: var(--gold); color: var(--ink); }

.pt-nota { background: var(--card); }
.pt-nota h2 { font-size: 1rem; letter-spacing: -0.01em; }
.pt-nota p { font-size: 0.8438rem; color: var(--text-soft); }

.pt-cta {
  position: relative;
  overflow: hidden;
  gap: 12px;
  padding: 24px 22px;
  background:
    radial-gradient(110% 90% at 100% 0%, rgba(240, 187, 74, 0.12), transparent 60%),
    var(--ink-grad);
}
.pt-cta::after {
  content: "";
  position: absolute;
  right: -12px;
  bottom: -26px;
  width: 104px;
  aspect-ratio: 560 / 636;
  background: var(--gold);
  opacity: 0.09;
  -webkit-mask: var(--e-logo) no-repeat center / contain;
  mask: var(--e-logo) no-repeat center / contain;
  pointer-events: none;
}
.pt-cta .eyebrow { color: var(--gold); }
.pt-cta p { position: relative; color: rgba(242, 243, 245, 0.8); }
.pt-cta .btn { position: relative; z-index: 1; width: 100%; border-radius: 14px; }

/* ---------- fecho da página principal: o bloco dourado ---------- */
.pt-page .fecho > .container {
  background:
    radial-gradient(90% 140% at 0% 0%, rgba(255, 236, 190, 0.6), transparent 50%),
    var(--gold);
}
.pt-page .fecho { color: var(--ink); }
.pt-page .fecho .eyebrow { color: rgba(26, 29, 36, 0.7); }
.pt-page .fecho h2 { color: var(--ink); }
/* "diagnóstico" no marca-texto de tinta com letra dourada, como o
   "devolve?" da capa da home */
.pt-page .fecho h2 em {
  padding: 0 0.18em 0.04em;
  border-radius: 0.24em;
  background: var(--ink);
  color: var(--gold);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.pt-page .fecho-ghost { background: var(--ink); opacity: 0.07; }
.pt-page .fecho .btn-gold { background: var(--ink); border-color: var(--ink); color: #FFFFFF; }
.pt-page .fecho .btn-gold:hover { background: #000000; border-color: #000000; color: #FFFFFF; }
.pt-page .fecho a:focus-visible { outline-color: var(--ink); }

/* ---------- rodapé ---------- */
.rodape-topo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 32px;
  margin-bottom: 20px;
}
.rodape-marca { margin-bottom: 0; }
.rodape-links { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.rodape .rodape-links a {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ink);
  transition: color 200ms var(--ease);
}
.rodape .rodape-links a:hover { color: #7A5A18; }
.rodape p { max-width: none; }

/* ============================================================
   CELULAR (páginas de artigo)
   ============================================================ */
@media (max-width: 719.98px) {
  /* a pílula numa linha, data · leitura na outra: o ponto logo
     depois da pílula vira a quebra, e nenhum separador fica órfão */
  .art-kicker { flex-direction: row; align-items: center; gap: 10px; }
  .art-kicker .dot { display: inline-block; }
  .art-kicker > :first-child + .dot { display: block; flex-basis: 100%; height: 0; margin-top: -4px; background: none; }
  .art-byline { flex-direction: row; align-items: center; gap: 12px 14px; }
  .art-byline-aviso { margin-left: 0; }
}
@media (max-width: 619.98px) {
  .art-rel-card .go { top: 18px; right: 18px; width: 34px; height: 34px; }
  .pt-card-go { top: 18px; right: 18px; width: 34px; height: 34px; }
  .art-byline-aviso { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .art-rel-card, .art-rel-fig img, .art-rel-card .go,
  .pt-card, .pt-card-fig img, .pt-card-go, .pt-hero-fig img, .pt-hero-ler .ar,
  .nav-menu-ic i { transition: none; }
  .nav-menu-painel { animation: none; }
}
@media print {
  .art-byline-selo, .art-rel, .nav-menu, .pt-editorias, .pt-rail { display: none !important; }
}

/* ============================================================
   CORES 2026 (30/09/2026) — a mesma régua da home (assets/cores-2026.css):
   base em preto, branco e cinza; um amarelo só, #F0BB4A, e só no que é
   destaque de verdade. Saem o marrom-dourado dos textos (#A87A1F,
   #7A5A18), o amarelo claro (#F5C868) e os fundos de amarelo lavado.
   Pedido do dono: "o marca-texto… o laranja do 'Visão de negócio'… é
   uma cor que destoa, não é aquele amarelo forte".
   ============================================================ */
:root {
  --gold-strong: #6B7280;
  --gold-deep: #4D525C;
  --gold-soft: #F0BB4A;
}
/* marca-texto: bloco cinza de cantos redondos */
.marker {
  padding: 0.06em 0.3em 0.12em;
  margin: 0 -0.06em;
  border-radius: 0.36em;
  background: #E6E9EE;
  background-image: none;
}
.eyebrow { color: #6B7280; }
:where(a, button, summary, [tabindex]):focus-visible { outline-color: #1A1D24; }
.masthead .mh-right a,
.art-box-label,
.art-setas-rotulo,
.art-body .art-cartao h3, .art-cartao-titulo,
.art-rel-card .tag,
.pt-tag > span:first-child,
.pt-filtro-nucleo,
.pt-nucleos a .qtd { color: #4D525C; }
.art-toc-label::after,
.art-toc a .n,
.art-body h2 .n,
.art-body ol li::before,
.art-setas .seta,
.art-body ul.art-flechas li::before,
.nav-menu-site a::after { color: #6B7280; }
.art-body a:not(.btn) { color: #1A1D24; border-bottom-color: rgba(26, 29, 36, 0.35); }
.pt-filtro-nucleo { border-bottom-color: rgba(26, 29, 36, 0.3); }
.rodape a { color: #4D525C; }
.rodape .rodape-links a:hover { color: #6B7280; }
.art-rel-card:focus-visible,
.pt-card:focus-visible { outline-color: #1A1D24; }
/* fundos de amarelo lavado viram cinza */
.art-kicker > :first-child { background: #ECEEF2; color: #4D525C; }
/* o bloco de citação (.art-quote) continua amarelo cheio: é destaque */
.pt-filtro-busca { background: #ECEEF2; color: #1A1D24; }