/* Página de artigo (secção Thinking). Usa a mesma linguagem visual do resto do site:
   preto e branco, linhas finas, tipografia Inter com espaçamento apertado. */

/* Idioma: mostra só o activo. O JS (lang.js / article.js) define <html lang>. */
html:not([lang^="en"]) .t-en{display:none}
html[lang^="en"] .t-pt{display:none}
.art-lang{display:none}
html:not([lang^="en"]) .art-lang[data-lang="pt"]{display:block}
html[lang^="en"] .art-lang[data-lang="en"]{display:block}

:focus-visible{outline:2px solid #000;outline-offset:3px}

/* Barra de progresso de leitura, colada ao fundo do cabeçalho fixo */
.art-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none}
.art-progress i{display:block;height:100%;background:#000;transform:scaleX(var(--p,0));transform-origin:0 50%}
.navlinks a.is-current:after{width:100%}

/* --- Topo do artigo --- */
.art-hero{padding:calc(82px + clamp(48px,7vw,104px)) 0 clamp(48px,6vw,88px);border-bottom:1px solid var(--line)}
.art-back{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.art-back:hover{color:#000}
.art-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:stretch}
.art-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.art-chip{border:1px solid #000;border-radius:999px;padding:6px 12px;color:#000}
.art-hero h1{font-size:clamp(38px,5vw,78px);font-weight:500;letter-spacing:-.065em;line-height:.94;margin:26px 0 22px}
.art-sub{font-size:clamp(18px,1.8vw,24px);line-height:1.25;letter-spacing:-.03em;max-width:34ch;margin:0 0 26px;color:#222}
.art-byline{font-size:13px;color:var(--muted)}
.art-hero-visual{position:relative;min-height:340px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%);mask-image:linear-gradient(90deg,transparent 0,#000 24%)}
.art-hero-visual canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

/* Visualizações + like */
.art-engage{display:flex;align-items:center;flex-wrap:wrap;gap:16px 20px;margin-top:28px}
.art-stat{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.art-like{display:inline-flex;align-items:center;gap:8px;border:1px solid #000;background:#fff;color:#000;border-radius:999px;padding:9px 16px 9px 13px;font-size:13px;line-height:1;cursor:pointer;transition:background-color .18s,color .18s}
.art-like:hover{background:#000;color:#fff}
.art-heart{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;flex:none;transition:transform .2s}
.art-like.is-liked{background:#000;color:#fff}
.art-like.is-liked .art-heart{fill:currentColor;transform:scale(1.08)}
.art-like-count{padding-left:9px;border-left:1px solid currentColor;font-variant-numeric:tabular-nums}
.art-engage-end{margin-top:56px;padding-top:28px;border-top:1px solid var(--line)}

/* --- Corpo --- */
.art-body{padding:clamp(56px,7vw,100px) 0 clamp(80px,10vw,150px)}
.art-rail{grid-column:1/4;align-self:start;position:sticky;top:110px;padding-right:12px}
.art-toc-title{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin-bottom:14px}
.art-toc ol{list-style:none;margin:0;padding:0}
.art-toc a{display:block;padding:8px 0 8px 14px;border-left:1px solid var(--line);font-size:13px;line-height:1.35;color:var(--muted);transition:color .15s,border-color .15s}
.art-toc a:hover{color:#000}
.art-toc a.is-active{color:#000;border-left-color:#000}

.art-text{grid-column:4/11;min-width:0;font-size:18px;line-height:1.62;letter-spacing:-.006em}
.art-text p,.art-text li{text-wrap:pretty}
.art-text p{margin:0 0 1.15em}
.art-text h2{font-size:clamp(28px,3.2vw,44px);font-weight:500;letter-spacing:-.055em;line-height:1;margin:76px 0 24px;scroll-margin-top:110px}
.art-text strong{font-weight:600}
.art-text a{border-bottom:1px solid var(--line)}
.art-text a:hover{border-bottom-color:#000}
.art-text ul,.art-text ol{list-style:none;margin:0 0 1.4em;padding:0}
.art-text li{position:relative;padding-left:24px;margin:0 0 .65em}
.art-text ul li:before{content:"";position:absolute;left:0;top:.86em;width:11px;height:1px;background:#000}
.art-text ol{counter-reset:n}
.art-text ol li{counter-increment:n;padding-left:38px}
.art-text ol li:before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.42em;font-size:11px;letter-spacing:.06em;color:var(--muted);font-variant-numeric:tabular-nums}

.art-notice{border:1px solid var(--line);background:#f6f6f6;border-radius:10px;padding:14px 18px;font-size:14px;line-height:1.5;color:#333;margin:0 0 36px}
.art-tldr{border-top:1px solid #000;border-bottom:1px solid #000;padding:24px 0 10px}
.art-tldr-title,.art-sources-title{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin-bottom:16px}
.art-tldr ul{margin:0}
.art-tldr li{font-size:17px}

/* Diagrama do circuito */
.art-fig{margin:40px 0;border:1px solid var(--line);border-radius:10px;padding:22px 20px 14px;background:#fff}
.art-fig-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.art-fig figcaption{font-size:12px;color:var(--muted);margin-top:10px}
.dg{display:block;width:100%;min-width:640px;height:auto}
.dg-box{fill:#fff;stroke:#111;stroke-width:1}
.dg-box-hi{fill:#111}
.dg-t{font-size:12px;fill:#111;letter-spacing:-.01em}
.dg-inv{fill:#fff}
.dg-lane{font-size:10px;letter-spacing:.14em;fill:#777}
.dg-line{stroke:#111;stroke-width:1.2;fill:none}
.dg-head{fill:#111}
.dg-loop{stroke-dasharray:4 4}
.dg-dash{stroke:#999;stroke-dasharray:3 5}
.dg-dim,.dg-cap{font-size:11px;fill:#666}
.dg-bar{fill:#111}

/* Tabela comparativa */
.art-table-wrap{overflow-x:auto;margin:32px 0;-webkit-overflow-scrolling:touch}
.art-text table{width:100%;min-width:560px;border-collapse:collapse;font-size:15px;line-height:1.45}
.art-text th,.art-text td{text-align:left;vertical-align:top;padding:14px 18px 14px 0;border-bottom:1px solid var(--line)}
.art-text thead th{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);border-bottom:1px solid #000}
.art-text tbody th{font-weight:500}

/* Fecho */
.art-cta{margin:76px 0 0;padding:36px 0 8px;border-top:1px solid #000}
.art-cta-lead{font-size:clamp(22px,2.4vw,32px);line-height:1.15;letter-spacing:-.04em;margin:0 0 22px}
.art-cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px}
.art-text a.art-btn{display:inline-block;background:#000;color:#fff;padding:14px 22px;border-radius:999px;font-size:14px;border:0}
.art-text a.art-btn:hover{opacity:.8}
.art-text a.art-mail{font-size:14px;color:var(--muted)}
.art-bio{font-size:14px;line-height:1.55;color:var(--muted);font-style:italic;max-width:62ch;margin:26px 0 30px}
.art-sources ul{margin:0}
.art-sources li{font-size:13px;line-height:1.5;color:var(--muted);margin-bottom:.4em}

@media(max-width:1100px){
  .art-rail{padding-right:0}
}
@media(max-width:800px){
  .art-hero{padding-top:calc(68px + 44px)}
  .art-hero-grid{grid-template-columns:1fr}
  .art-hero-visual{min-height:260px;order:2;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%);mask-image:linear-gradient(180deg,transparent 0,#000 30%)}
  .art-rail{display:none}
  .art-text{font-size:17px}
  .art-text h2{margin-top:56px;scroll-margin-top:90px}
  .art-progress{bottom:-1px}
}
@media(prefers-reduced-motion:reduce){
  .art-like,.art-heart,.art-toc a{transition:none}
}

/* Notas de edição: linha do tempo, mais recente primeiro. Data à esquerda, texto à direita. */
.art-upd{margin-left:0;border-bottom:1px solid var(--line);color:var(--muted)}
.art-upd:hover{color:#000;border-bottom-color:#000}
.art-notes{margin-top:72px;padding-top:30px;border-top:1px solid #000;scroll-margin-top:110px}
.art-notes .art-sources-title{margin-bottom:6px}
.art-text .art-notes-tz{font-size:12px;line-height:1.4;color:var(--muted);margin:0 0 22px}
.art-note{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 28px;padding:20px 0;border-top:1px solid var(--line)}
.art-note:last-child{border-bottom:1px solid var(--line)}
.art-note time{font-size:13px;line-height:1.45;font-weight:500;color:#000;font-variant-numeric:tabular-nums}
.art-note time span{display:block;font-weight:400;color:var(--muted)}
.art-text .art-note-body p{font-size:14px;line-height:1.6;color:#333;margin:0 0 .7em}
.art-text .art-note-body p:last-child{margin-bottom:0}
@media(max-width:600px){
  .art-note{grid-template-columns:1fr;gap:6px;padding:16px 0}
  .art-note time span{display:inline;margin-left:.4em}
}
.art-ed{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px}