

.pcard__ph, .bl-dest__ph, .art-capa__ph, .evt-player__ph, .in-dest__ph, .bl-recente__ph {
  position: absolute; inset: 0; display: block;
  background:
    radial-gradient(120% 90% at 70% 10%, rgba(21,116,255,.35), transparent 60%),
    linear-gradient(160deg, #14203a, #0b0b0b);
}

.pcard[hidden], .ccard[hidden], .bcard[hidden] { display: none; }

.pcard { display: flex; flex-direction: column; }
.pcard__capa {
  position: relative; display: block; aspect-ratio: 390 / 314; overflow: hidden;
  border-radius: var(--r-small-xxl); background: #0c0c0c;
  box-shadow: 0 0 0 1px rgba(21,116,255,.25), 0 18px 50px -24px rgba(21,116,255,.55);
}
.pcard__capa img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--arx-ease); }
.pcard:hover .pcard__capa img { transform: scale(1.05); }

.pcard__cat {
  position: absolute; top: 16px; right: 16px; z-index: 2;
  display: inline-flex; align-items: center; height: 42px; padding-inline: 18px;
  font-size: 15px; line-height: 28.8px; letter-spacing: -.24px; color: var(--arx-white);
}
.pcard__titulo { margin-top: 22px; font-size: 20px; line-height: 29px; font-weight: var(--fw-semibold); }
.pcard__titulo a { color: var(--arx-white); transition: color .3s var(--arx-ease); }
.pcard__titulo a:hover { color: var(--arx-blue-border); }
.pcard__resumo { margin-top: 12px; flex: 1; font-size: 15px; line-height: 23px; color: var(--arx-grey-70); }
.pcard__btn { margin-top: 22px; align-self: flex-start; }

html.arx-anim .pcard {
  opacity: 0; transform: translateY(22px);
  transition: opacity .6s var(--arx-ease), transform .6s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 80ms);
}
html.arx-anim .is-revealed .pcard { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.arx-anim .pcard { opacity: 1; transform: none; transition: none; }
}

.bl-hero { position: relative; padding: calc(var(--arx-header-h) + 24px) 0 0; overflow-x: clip; }
.bl-hero__grad {
  position: absolute; inset: 206px 0 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(21,21,21,0) 57%, #151515 98%);
}
.bl-hero .arx-container { position: relative; z-index: 1; }
.bl-hero__topo { display: grid; grid-template-columns: 1fr 396px; gap: 60px; align-items: end; }
.bl-hero__title {

  margin-top: 22px;
  font-size: clamp(32px, 3.5417vw, 68px); line-height: 1.09; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.bl-hero__sub { font-size: 20px; line-height: 30px; color: var(--arx-white); }

.bl-vitrine { margin-top: 56px; }
.bl-vitrine__palco { overflow: hidden; }
.bl-vitrine__trilho {
  --dur: .72s;
  display: flex; gap: var(--vao, 30px); align-items: stretch;
  transform: translate3d(var(--desloc, 0px), 0, 0);
  transition: transform var(--dur) var(--arx-ease);
  will-change: transform;
}
.bl-dest {
  position: relative; flex: 0 0 auto;
  width: var(--lado, 240px); min-height: 600px;
  border-radius: 20px; overflow: hidden;
  transition: width var(--dur) var(--arx-ease), opacity var(--dur) var(--arx-ease),
              box-shadow var(--dur) var(--arx-ease);
  opacity: .45;
}
.bl-dest.is-ativo { width: var(--centro, 725px); opacity: 1; box-shadow: 0 0 0 1px rgba(21,116,255,.28); }
.bl-dest__ph { border-radius: inherit; }
.bl-dest img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bl-dest::after {
  content: ""; position: absolute; inset: 0; opacity: 0;
  transition: opacity var(--dur) var(--arx-ease);
  background: linear-gradient(180deg, rgba(6,8,14,.35) 0%, rgba(6,8,14,.55) 45%, rgba(6,8,14,.94) 100%);
}
.bl-dest.is-ativo::after { opacity: 1; }

.bl-dest__meta, .bl-dest__corpo {
  position: absolute; z-index: 1; left: 38px; right: 38px;
  opacity: 0; transform: translateY(14px);
  transition: opacity .5s var(--arx-ease), transform .5s var(--arx-ease);
  pointer-events: none;
}
.bl-dest__meta { top: 34px; }
.bl-dest__corpo { bottom: 40px; }
.bl-dest.is-ativo .bl-dest__meta,
.bl-dest.is-ativo .bl-dest__corpo { opacity: 1; transform: none; pointer-events: auto; transition-delay: .18s; }
.bl-dest__meta { display: flex; flex-wrap: wrap; gap: 18px; font-size: 14px; color: var(--arx-grey-90); }
.bl-dest__meta b { font-weight: var(--fw-semibold); color: var(--arx-white); }
.bl-dest__cats { display: flex; gap: 10px; }
.bl-dest__cats span {
  min-width: 134px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center; padding-inline: 18px;
  font-size: 15px; line-height: 28.8px; letter-spacing: -.24px; color: var(--arx-white);
}
.bl-dest__titulo { margin-top: 24px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); }
.bl-dest__titulo a { color: var(--arx-white); }
.bl-dest__titulo a:hover { color: var(--arx-blue-border); }
.bl-dest__resumo { margin-top: 16px; max-width: 580px; font-size: 16px; line-height: 25px; color: var(--arx-grey-90); }
.bl-dest__corpo .arx-btn { margin-top: 24px; }

/* Quadro do salto silencioso: quando o trilho troca o clone pelo slide real,
   nada pode animar nem o trilho, nem a largura do slide, nem o texto, que
   tem transição própria com atraso. Era ele que reaparecia em fade e lia como
   um piscar depois de uma espera. */
.bl-vitrine.is-saltando,
.bl-vitrine.is-saltando *,
.bl-vitrine.is-saltando *::after,
.bl-vitrine.is-saltando *::before { transition: none !important; }

/* ── Destaques do blog: mosaico de três ────────────────────────────────────
   Um card grande à esquerda e dois empilhados à direita. As proporções vêm dos
   dois menores: cada um é 1.9:1, e o grande ocupa as duas fileiras, de modo que
   a altura da peça é consequência deles e não um número fixo.

   O raio, a sobreposição escura e o anel azul no hover são os mesmos do resto
   da vitrine, o card muda de forma, não de identidade. */
.bl-destaques {
  margin-top: 44px;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.bl-card--principal { grid-row: 1 / span 2; }

.bl-card {
  position: relative; overflow: hidden; border-radius: 20px;
  background: #0c0c0c; isolation: isolate;
  transition: transform .35s var(--arx-ease), box-shadow .35s var(--arx-ease);
}
.bl-card:not(.bl-card--principal) { aspect-ratio: 1.9 / 1; }
.bl-card img, .bl-card__ph {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s var(--arx-ease);
}
.bl-card__ph {
  background:
    radial-gradient(120% 90% at 70% 10%, rgba(21,116,255,.35), transparent 60%),
    linear-gradient(160deg, #14203a, #0b0b0b);
}
/* A sobreposição existe para o texto ter contraste, não para escurecer a foto.
   A primeira versão puxava .62 no topo e .22 no meio: num card baixo isso
   cobria quase tudo e uma imagem de luminância 129 aparecia preta. Agora ela
   é forte só onde o texto pousa, uma pitada no topo, para o rótulo, e a
   massa embaixo, sob o título. */
.bl-card::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg,
    rgba(6,8,14,.46) 0%,
    rgba(6,8,14,.06) 24%,
    rgba(6,8,14,.06) 44%,
    rgba(6,8,14,.68) 80%,
    rgba(6,8,14,.93) 100%);
}
.bl-card:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(21,116,255,.45); }
.bl-card:hover img { transform: scale(1.04); }

/* Rótulo no topo, título na base, por flex, não por posicionamento absoluto.
   Com o título absoluto, o `::after` esticado do link se media por ele e só o
   texto ficava clicável; sendo estático, o bloco de contenção passa a ser o
   card e o link cobre a peça inteira. De quebra, o responsivo vira uma troca
   de padding em vez de reposicionar quatro arestas em cada faixa. */
.bl-card {
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 26px 28px;
}
.bl-card--principal { padding: 34px 36px; }
/* Sem `position` aqui de propósito: um título posicionado vira o bloco de
   contenção do ::after do link, e o esticado volta a cobrir só o texto. Como
   o card é flex, o z-index sozinho já levanta os dois acima do gradiente. */
.bl-card__rotulo, .bl-card__titulo { z-index: 1; }
.bl-card__rotulo {
  font-size: 13px; letter-spacing: var(--ls-label); text-transform: uppercase;
  font-weight: var(--fw-semibold); color: var(--arx-white);
}
/* sem rótulo o título continua na base */
.bl-card__titulo { margin-top: auto; }
.bl-card__titulo {
  font-size: 24px; line-height: 31px; font-weight: var(--fw-semibold);
  color: var(--arx-white); text-wrap: balance;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}
.bl-card--principal .bl-card__titulo { font-size: 36px; line-height: 44px; }
.bl-card__titulo a { color: inherit; }
/* agora sim: o link cobre o card inteiro */
.bl-card__titulo a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.bl-card:hover .bl-card__titulo a { color: var(--arx-blue-border); }

/* ── Faixas ─────────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .bl-destaques { grid-template-columns: 1fr; grid-template-rows: none; }
  .bl-card--principal { grid-row: auto; aspect-ratio: 1.6 / 1; }
  .bl-card--principal .bl-card__titulo { font-size: 28px; line-height: 35px; }
}

/* No celular o mosaico vira carrossel: três cards empilhados custam três telas
   de rolagem antes da lista de posts. Aqui é scroll-snap nativo, o gesto é o
   do sistema, com inércia, e não depende de script. */
@media (max-width: 640px) {
  .bl-destaques {
    display: flex; grid-template-columns: none; grid-template-rows: none;
    gap: 14px; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    /* sangra até as bordas da tela sem perder o alinhamento do container */
    margin-inline: calc(var(--arx-gutter) * -1);
    padding-inline: var(--arx-gutter);
    scroll-padding-inline: var(--arx-gutter);
    scrollbar-width: none;
  }
  .bl-destaques::-webkit-scrollbar { display: none; }
  .bl-card,
  .bl-card--principal {
    flex: 0 0 86%; scroll-snap-align: start; aspect-ratio: 1.5 / 1;
    padding: 22px 24px;
  }
  .bl-card__titulo,
  .bl-card--principal .bl-card__titulo { font-size: 21px; line-height: 28px; }
  .bl-card__rotulo { font-size: 12px; }
}

.bl-vitrine__controles { margin-top: 26px; display: flex; align-items: center; justify-content: center; gap: 20px; }
.bl-vitrine__seta {
  width: 38px; height: 38px; display: grid; place-items: center;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.18);
  background: none; color: var(--arx-grey-90); cursor: pointer;
  transition: border-color .3s var(--arx-ease), color .3s var(--arx-ease), background-color .3s var(--arx-ease);
}
.bl-vitrine__seta:hover { border-color: var(--arx-blue); color: var(--arx-white); background: rgba(21,116,255,.14); }
.bl-vitrine__seta svg { width: 12px; height: 12px; }
.bl-vitrine__pontos { display: flex; align-items: center; gap: 10px; }
.bl-vitrine__ponto {
  width: 9px; height: 9px; padding: 0; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.4); background: none; cursor: pointer;
  transition: width .45s var(--arx-ease), background-color .3s var(--arx-ease), border-color .3s var(--arx-ease);
}
.bl-vitrine__ponto.is-on { width: 28px; border-radius: 5px; background: var(--arx-blue); border-color: var(--arx-blue); }

@media (prefers-reduced-motion: reduce) {
  .bl-vitrine__trilho, .bl-dest, .bl-dest::after,
  .bl-dest__meta, .bl-dest__corpo, .bl-vitrine__ponto { transition: none; }
}

.bl-lista { padding-block: 96px; position: relative; overflow-x: clip; }
.bl-lista__h2 { margin-top: 14px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.bl-lista__grid {
  margin-top: 56px;
  display: grid; grid-template-columns: 1fr 396px; gap: 42px; align-items: start;
}
.bl-lista__posts { display: grid; grid-template-columns: 1fr 1fr; gap: 44px 42px; }

.arx-blur {
  border-radius: 20px;
  border: 1px solid var(--arx-blue);

  background:
    radial-gradient(120% 120% at 50% 0%, #1c212a 0%, #111317 38%, transparent 72%),
    linear-gradient(180deg, #0e1013 0%, #09090b 46%, #131313 100%);
}

.bl-side {
  position: sticky; top: calc(var(--arx-header-h) - 60px);

  padding: 34px 22px 40px; border-radius: 20px;
  --recuo-texto: 21px;
}
.bl-side__bloco + .bl-side__bloco { margin-top: 30px; }
.bl-side__tit {
  padding-left: var(--recuo-texto);
  font-size: 24px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white);
}

.bl-busca { position: relative; margin-top: 8px; }
.bl-busca::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  border-radius: 20px; border: 2px solid var(--arx-blue);
  filter: blur(5px); pointer-events: none;
}
.bl-busca input {
  position: relative; z-index: 1;
  width: 100%; height: 52px; padding: 0 44px 0 22px;
  color: var(--arx-white); font-family: var(--arx-font); font-size: 14px; line-height: 27px;
}
.bl-busca input::placeholder { color: rgba(255,255,255,.45); }
.bl-busca input:focus-visible { outline: 2px solid var(--arx-blue-border); outline-offset: 3px; }
.bl-busca button {
  position: absolute; z-index: 2; right: 16px; top: 50%; transform: translateY(-50%);
  width: 16px; height: 16px; padding: 0;
  background: none; border: 0; color: rgba(255,255,255,.75); cursor: pointer;
}
.bl-busca button svg { width: 16px; height: 16px; display: block; }
.bl-busca button:hover { color: var(--arx-white); }

/* Posts recentes: miniatura à esquerda, título à direita. O mesmo recuo e o
   mesmo passo de 12px do topo que os blocos vizinhos usam, para a lateral
   continuar lendo como uma coluna só. */
.bl-recentes {
  margin-top: 12px; padding: 0 0 0 var(--recuo-texto); list-style: none;
  display: flex; flex-direction: column; gap: 16px;
}
.bl-recente {
  display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 13px;
  align-items: center; color: var(--arx-white);
  transition: color .3s var(--arx-ease);
}
.bl-recente__capa {
  /* `position: relative` é requisito do placeholder, que se posiciona por
     `inset: 0`, sem isso ele escaparia para o ancestral posicionado. */
  position: relative; display: block; overflow: hidden;
  aspect-ratio: 4 / 3; border-radius: var(--r-small); background: #0c0c0c;
  box-shadow: 0 0 0 1px rgba(21,116,255,.25);
}
.bl-recente__capa img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s var(--arx-ease);
}
.bl-recente:hover .bl-recente__capa img { transform: scale(1.06); }
.bl-recente:hover { color: var(--arx-blue-border); }
.bl-recente__titulo {
  font-size: 14px; line-height: 20px; letter-spacing: -.24px;
  /* Três linhas: o suficiente para os títulos longos do acervo se explicarem
     sem que um deles empurre a lateral para fora do sticky. */
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}

.bl-ordem { margin-top: 12px; padding-left: var(--recuo-texto); display: flex; gap: 9px; }
.bl-ordem__btn {

  display: inline-grid; place-items: center; text-decoration: none;
  width: 134px; height: 31px; padding: 0;
  font-family: var(--arx-font); font-size: 15px; line-height: 28.8px;
  letter-spacing: -.24px; color: var(--arx-white); cursor: pointer;
  transition: background-color .3s var(--arx-ease), box-shadow .3s var(--arx-ease);
}
.bl-ordem__btn:hover { background: rgba(21,116,255,.16); }
.bl-ordem__btn.is-on { box-shadow: inset 0 0 0 1px var(--arx-blue), 0 0 14px -4px rgba(21,116,255,.9); }

.bl-cats { margin-top: 12px; padding: 0 0 0 var(--recuo-texto); list-style: none; }
.bl-cats a {
  display: block; height: 39px; display: flex; align-items: center;
  font-size: 15px; line-height: 28.8px; letter-spacing: -.24px; color: var(--arx-white);
  transition: color .3s var(--arx-ease), padding-left .3s var(--arx-ease);
}
.bl-cats a:hover { color: var(--arx-blue-border); padding-left: 6px; }
.bl-cats a.is-on { color: var(--arx-blue-border); font-weight: var(--fw-semibold); }

.art-share__links a.is-copiado { color: var(--arx-blue-border); box-shadow: inset 0 0 0 1px var(--arx-blue); }

.bl-pag { margin-top: 56px; display: flex; justify-content: center; align-items: center; gap: 10px; }
.bl-pag[hidden] { display: none; }
.bl-pag__num, .bl-pag__seta {
  font-family: var(--arx-font); background: none; cursor: pointer;
  min-width: 38px; height: 38px; padding: 0 10px;
  display: inline-grid; place-items: center; border-radius: 8px;
  border: 1px solid rgba(255,255,255,.16); font-size: 14px; color: var(--arx-grey-90);
  transition: border-color .3s var(--arx-ease), background-color .3s var(--arx-ease), color .3s var(--arx-ease);
}
.bl-pag__num:hover, .bl-pag__seta:hover { border-color: var(--arx-blue); color: var(--arx-white); }
.bl-pag__num.is-on { background: rgba(21,116,255,.2); border-color: var(--arx-blue); color: var(--arx-white); }
.bl-pag__seta[disabled] { opacity: .3; pointer-events: none; }
.bl-pag__seta svg { width: 12px; height: 12px; }

.arx-news { position: relative; overflow: hidden; background: linear-gradient(180deg, #0e0f12, #0b0b0d); }

.arx-news__luz {
  position: absolute; z-index: 0; inset: 0 53.54% 0 0; pointer-events: none;
  background: radial-gradient(75% 67% at 0% 100%,
    rgba(43,132,200,.58) 0%,
    rgba(43,132,200,.44) 11%,
    rgba(43,132,200,.31) 22%,
    rgba(43,132,200,.23) 33%,
    rgba(43,132,200,.12) 55%,
    rgba(43,132,200,.03) 77%,
    rgba(43,132,200,0) 100%);
}

.arx-news__arte { position: absolute; inset: 0 0 0 46.46%; border-left: 1px solid #171e2c; }

.arx-news__arte img { width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }
.arx-news__grid { position: relative; z-index: 1; }
.arx-news__copy {
  min-height: 640px; max-width: 517px;
  display: flex; flex-direction: column; justify-content: center;
  padding-block: 90px;
}
.arx-news__h2 { margin-top: 16px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.arx-news__sub { margin-top: 20px; font-size: 16px; line-height: 27px; color: var(--arx-grey-70); }

.arx-news__form { margin-top: 34px; display: flex; flex-direction: column; align-items: flex-start; gap: 30px; }
.arx-news__form input {
  width: 100%; height: 70px; padding: 0 26px; border-radius: 12px;
  color: var(--arx-white); font-family: var(--arx-font); font-size: 15px;
}
.arx-news__form input::placeholder { color: var(--arx-grey-50); }
.arx-news__form input:focus-visible { outline: 2px solid var(--arx-blue-border); outline-offset: 2px; }

.in-hero { position: relative; padding: calc(var(--arx-header-h) + 63px) 0 120px; overflow: hidden; }
.in-hero__bg { position: absolute; inset: 0; }
.in-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; opacity: .3; }
.in-hero__bg::after {
  content: ""; position: absolute; inset: 32% 0 -2% 0;
  background: linear-gradient(180deg, rgba(21,21,21,0) 57%, #151515 98%);
}
.in-hero__inner { position: relative; z-index: 1; text-align: center; }
.in-hero__title {
  font-size: clamp(32px, 3.5417vw, 68px); line-height: 1.15; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.in-hero__sub { margin: 24px auto 0; max-width: 724px; font-size: 24px; line-height: 27px; color: var(--arx-white); }

.in-busca { position: relative; margin: 44px auto 0; max-width: 757px; }
.in-busca input {
  width: 100%; height: 64px; padding: 0 60px 0 26px; border-radius: 12px;
  background: rgba(10,12,20,.72); border: 1px solid var(--arx-blue);
  backdrop-filter: blur(10px);
  color: var(--arx-white); font-family: var(--arx-font); font-size: 16px;
}
.in-busca input::placeholder { color: var(--arx-grey-50); }
.in-busca input:focus-visible { outline: 2px solid var(--arx-blue-border); outline-offset: 2px; }
.in-busca button {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; display: grid; place-items: center;
  background: none; border: 0; color: var(--arx-grey-70); cursor: pointer;
}
.in-busca button svg { width: 22px; height: 22px; }
.in-busca button:hover { color: var(--arx-white); }

.in-dest { padding-block: 0 96px; }
.in-dest__grid { display: grid; grid-template-columns: 784fr 451fr; gap: 30px; }
.in-dest__card { position: relative; overflow: hidden; min-height: 512px; }
.in-dest__card--alto { padding-bottom: 51px; }
.in-dest__card--largo { display: grid; grid-template-columns: 1fr 40%; align-items: center; padding-block: 59px 51px; }

.in-dest__copy { position: relative; z-index: 3; }
.in-dest__card--largo .in-dest__copy { padding: 0 0 0 6.8%; }

.in-dest__olho {
  display: block; font-size: 20px; line-height: 16.1px; letter-spacing: .64px;
  text-transform: uppercase; font-weight: var(--fw-semibold); color: var(--arx-blue);
}
.in-dest__tit { margin-top: 26px; font-size: 36px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.in-dest__rot { margin-top: 18px; font-size: 18px; line-height: 27px; color: rgba(255,255,255,.58); }
.in-dest__txt { margin-top: 16px; max-width: 371px; font-size: 20px; line-height: 27px; color: var(--arx-white); }
.in-dest__card .arx-btn { margin-top: 28px; }

.in-dest__arte { position: relative; align-self: stretch; display: flex; align-items: center; justify-content: center; }
.in-dest__arte img { position: relative; z-index: 1; display: block; max-width: 100%; max-height: 402px; width: auto; }

.in-dest__luz {
  position: absolute; z-index: 0; left: 50%; bottom: 12%;
  width: 78%; aspect-ratio: 344 / 130; transform: translateX(-50%);
  background: radial-gradient(50% 50% at 50% 50%,
    rgba(21,116,255,.55), rgba(21,116,255,.18) 45%, transparent 72%);
  filter: blur(18px);
}

.in-dest__card--alto { display: flex; flex-direction: column; text-align: center; }
.in-dest__arte--topo { align-self: auto; margin: 18px 0 0; height: 290px; }
.in-dest__arte--topo img { max-height: 290px; }

.in-dest__arte--topo::after {
  content: ""; position: absolute; z-index: 2; inset: 0;
  background: linear-gradient(180deg, rgba(17,17,17,0) 0%, #101011 86%);
}
.in-dest__card--alto .in-dest__copy { margin-top: -46px; padding-inline: 8%; }
.in-dest__card--alto .in-dest__txt { max-width: none; margin-inline: auto; }
.in-dest__card--alto .arx-btn { margin-inline: auto; }

.in-rec-sec { padding-block: 96px; position: relative; overflow-x: clip; }

.in-rec__grid { position: relative; }
.in-rec__luz {
  position: absolute; z-index: -1; pointer-events: none;
  transform: translate(-50%, -50%); border-radius: 50%;
  background: rgba(21,116,255,var(--a));
  filter: blur(150px);
}
.in-rec__luz--a { left: 46.4%; top: 45.6%; width: 657px; height: 247px; --a: 1; }
.in-rec__luz--b { left: 123.8%; top: 145.4%; width: 680px; height: 475px; --a: .42; }
.in-rec__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.in-rec__h2 { margin-top: 14px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.in-rec__lead { max-width: 349px; font-size: 16px; line-height: 27px; color: var(--arx-grey-70); }

.in-rec__grid {
  margin-top: 56px; display: grid; gap: 26px; justify-content: center;
  grid-template-columns: repeat(auto-fit, minmax(240px, 420px));
}

.in-rec {
  position: relative; display: flex; flex-direction: column;
  min-height: 286px; padding: 1px; border-radius: 10px;
  background: linear-gradient(128.75deg, #1574ff 0%, rgba(112,112,112,.2) 24%);
}
.in-rec__miolo {
  flex: 1; display: flex; flex-direction: column;
  padding: 40px 24px; border-radius: 10px; background: #1b1b1b;
}

.in-rec::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: conic-gradient(from var(--arx-beam),
    transparent 0deg, transparent 78%,
    rgba(88,150,255,.55) 88%, rgba(160,200,255,.85) 92%, rgba(88,150,255,.55) 96%,
    transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .4s var(--arx-ease); pointer-events: none;
}
.in-rec:hover::after { opacity: 1; animation: arx-beam-spin 3.5s linear infinite; }
@media (prefers-reduced-motion: reduce) {
  .in-rec:hover::after { animation: none; opacity: .5; }
}
.in-rec__ico { display: block; align-self: flex-start; width: auto; height: 57px; color: var(--arx-blue); }
.in-rec__nome { margin-top: auto; padding-top: 32px; font-size: 24px; line-height: 28px; font-weight: var(--fw-semibold); color: var(--arx-white); }
.in-rec__desc { margin-top: 20px; font-size: 14px; line-height: 18px; color: rgba(255,255,255,.6); }
.in-rec__mais {
  margin-top: 24px; display: inline-flex; align-items: center; gap: 8px;
  font-size: 16px; line-height: 18px; color: var(--arx-blue);
}
.in-rec__mais svg { width: 9px; height: 9px; }
.in-rec__acao { margin-top: 44px; display: flex; justify-content: center; }

html.arx-anim .in-rec {
  opacity: 0; transform: translateY(20px);
  transition: opacity .55s var(--arx-ease), transform .55s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 70ms);
}
html.arx-anim .in-rec__grid.is-revealed .in-rec { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.arx-anim .in-rec { opacity: 1; transform: none; transition: none; }
}

.in-ult { padding-block: 96px; position: relative; overflow: visible; background: #151543; }
.in-ult > .arx-container { position: relative; z-index: 1; }
.in-ult__head { text-align: center; }
.in-ult__h2 { margin-top: 14px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }

.in-abas {
  margin: 34px auto 0; width: fit-content;
  display: flex; gap: 14px;
  padding: 16px 34px 19px 29px;
  border-radius: 20px; border: 1px solid var(--arx-blue);
  background:
    radial-gradient(120% 120% at 50% 0%, rgba(28,33,42,.5) 0%, rgba(17,19,23,.5) 38%, transparent 72%),
    linear-gradient(180deg, rgba(14,16,19,.5) 0%, rgba(9,9,11,.5) 46%, rgba(19,19,19,.5) 100%);
}
.in-abas__btn {

  min-width: 132px; height: 30.4px; padding-inline: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; border: 1px solid var(--arx-blue); background: none;
  font-family: var(--arx-font); font-size: 16px; line-height: 27px;
  color: var(--arx-white); cursor: pointer;
  transition: background-color .3s var(--arx-ease), border-color .3s var(--arx-ease);
}
.in-abas__btn:hover { background: rgba(21,116,255,.22); }
.in-abas__btn.is-on { background: var(--arx-blue); border-color: transparent; }
.in-ult__grid { margin-top: 52px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 42px; }

.in-ult__grid[hidden] { display: none; }

.in-blog { padding-block: 114px 152px; position: relative; overflow: hidden; background: var(--arx-blue-section); }
.in-blog > .arx-container { position: relative; z-index: 1; }
.in-blog__aba {
  position: absolute; left: 50%; width: 374px; height: 54px;
  z-index: 2; pointer-events: none; display: block;
}
.in-blog__aba--topo { top: 0; transform: translateX(-50%) scaleY(-1); }
.in-blog__aba--base { bottom: 0; transform: translateX(-50%); }

.in-blog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 40px; }
.in-blog__h2 { margin-top: 14px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.in-blog__sub { margin-top: 14px; font-size: 20px; line-height: 27px; color: var(--arx-white); }
.in-blog__grid { margin-top: 52px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; }

.in-blog .pcard__capa { box-shadow: 0 0 0 1px rgba(255,255,255,.28); }
.in-blog .pcard__resumo { color: rgba(255,255,255,.85); }
.in-blog .arx-eyebrow { color: #cfe0ff; }
.in-blog .pcard__cat { color: var(--arx-white); }

.in-blog .pcard__btn {
  background-image: none; background: none;
  border: 2px solid #fff; color: var(--arx-white);
}
.in-blog .pcard__btn::before, .in-blog .pcard__btn::after { content: none; }
.in-blog .pcard__btn:hover { background: rgba(255,255,255,.14); }

.in-glos { padding-block: 96px; position: relative; overflow-x: clip; }
.in-glos__head { text-align: center; }
.in-glos__h2 { margin-top: 14px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.in-glos__sub { margin-top: 14px; font-size: 20px; line-height: 23px; color: var(--arx-white); }
.in-glos__grid { margin-top: 46px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 19px; }
.in-glos__termo {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  height: 71px; padding-inline: 24px; border-radius: 30px;
  font-size: 24px; line-height: 22.4px; color: var(--arx-white);
  transition: background-color .3s var(--arx-ease);
}
.in-glos__termo svg { width: 37px; height: 40px; flex: none; color: var(--arx-blue); }
.in-glos__termo:hover { background-color: rgba(21,116,255,.14); }
.in-glos__acao { margin-top: 40px; display: flex; justify-content: center; }

.art-hero { position: relative; padding: calc(var(--arx-header-h) + 20px) 0 60px; overflow: hidden; }
.art-hero__bg { position: absolute; inset: 0; background: linear-gradient(168deg, #101828 0%, #14161c 62%, #151515 100%); }
.art-hero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .35; }
.art-hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(900px 380px at 20% 0%, rgba(21,116,255,.28), transparent 70%);
}
/* A caixa de leitura acompanha a fonte.
   O título é fluido (clamp de 30 a 52px) e a caixa era fixa em 900px: em tela
   grande a letra crescia sem a caixa crescer junto, e títulos que cabiam em
   duas linhas a 1440px voltavam para três a 1920px. Mantendo a razão
   caixa/corpo (23,08) o número de linhas passa a depender só do texto.
   Em 1440px o valor continua sendo exatamente os mesmos 900px de antes. */
.art-hero__inner { position: relative; z-index: 1; --leitura: clamp(846px, 76.39vw, 1466px); }
.art-crumbs { display: flex; flex-wrap: wrap; gap: 10px; font-size: 14px; color: var(--arx-grey-50); }
.art-crumbs a { color: var(--arx-grey-70); }
.art-crumbs a:hover { color: var(--arx-blue-border); }
.art-cat {
  display: inline-block; margin-top: 24px;
  font-size: 13px; letter-spacing: 1.2px; text-transform: uppercase;
  font-weight: var(--fw-semibold); color: var(--arx-blue-border);
}
.art-titulo {
  margin-top: 14px;
  font-size: clamp(30px, 2.7083vw, 52px); line-height: 1.16; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
  /* duas linhas parelhas em vez de uma última linha órfã */
  text-wrap: balance;
}
/* Quase tudo cabe em duas linhas na largura de leitura: só os títulos acima
   de 110 caracteres precisam de ajuda, e aí o corpo desce um degrau curto.
   Medido nos 350 títulos mais longos do acervo: 332 ficam no corpo cheio. */
.art-titulo--longo   { font-size: clamp(26px, 2.36vw, 45px); }
.art-titulo--extenso { font-size: clamp(23px, 2.08vw, 40px); }
.art-meta { margin-top: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 22px; font-size: 15px; color: var(--arx-grey-70); }
.art-meta__autor { display: inline-flex; align-items: center; gap: 10px; color: var(--arx-white); }
.art-meta__autor img { width: 28px; height: 28px; object-fit: contain; }

/* A capa repete a caixa do .arx-container e precisa da mesma conta: o
   max-width soma as duas calhas, senão a figura fica 2×gutter mais estreita
   que o texto, a borda da imagem entrava 24px de cada lado em relação a
   todas as outras seções da página. */
.art-capa {
  position: relative; margin: -30px auto 0;
  max-width: calc(var(--arx-container) + 2 * var(--arx-gutter));
  padding-inline: var(--arx-gutter);
}
.art-capa img, .art-capa__ph {
  position: relative; inset: auto; display: block;
  width: 100%; aspect-ratio: 16 / 7; object-fit: cover; border-radius: 18px;
  box-shadow: 0 0 0 1px rgba(21,116,255,.25), 0 40px 90px -50px rgba(0,0,0,.9);
}

.art-corpo { padding-block: 76px 96px; }
.art-corpo__grid, .evt-corpo__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 64px; align-items: start;
}
/* A coluna do sumário ocupa a fileira inteira: com `align-items: start` ela
   encolhia até a altura do próprio cartão, e aí o `position: sticky` de dentro
   não tinha por onde correr, grudava e ia embora junto no primeiro rolar. */
.art-corpo__grid > .art-side,
.evt-corpo__grid > .art-side { align-self: stretch; }

/* Coluna com sidebar: o texto ocupa a coluna inteira.
   Os três grids com sidebar, artigo/boletim, evento e case, reservam
   `minmax(0,1fr) 360px`, o que dá 1016px de coluna. Com o texto capado em
   760px sobravam 256px de coluna vazia antes do gap: o texto encostado à
   esquerda e um vão que não separava nada. O cap segue valendo onde o
   artigo corre sem sidebar (missão). */
.art-corpo__grid .art-conteudo,
.evt-corpo__grid .art-conteudo,
.cs-corpo__grid  .art-conteudo { max-width: none; }

.art-hero__inner > *, .evt-hero__inner > *, .cs-topo__inner > * { max-width: var(--leitura, 900px); }

.art-conteudo { max-width: 760px; font-size: 17px; line-height: 30px; color: var(--arx-grey-90); }
.art-conteudo > * + * { margin-top: 22px; }
.art-lead { font-size: 20px; line-height: 33px; color: var(--arx-white); }
/* Âncora do sumário não pode pousar debaixo do cabeçalho fixo. */
.art-conteudo :is(h2, h3, h4)[id] { scroll-margin-top: calc(var(--arx-header-h) - 40px); }

.art-conteudo h2 {
  margin-top: 48px; font-size: 30px; line-height: 38px;
  font-weight: var(--fw-semibold); color: var(--arx-white);
}
.art-conteudo h3 {
  margin-top: 36px; font-size: 21px; line-height: 29px;
  font-weight: var(--fw-semibold); color: var(--arx-blue-border);
}

.art-conteudo:not(:has(h2)) h3 {
  margin-top: 48px; font-size: 30px; line-height: 38px; color: var(--arx-white);
}
.art-conteudo:not(:has(h2)) h4 {
  margin-top: 36px; font-size: 21px; line-height: 29px; color: var(--arx-blue-border);
}
.art-conteudo ul, .art-conteudo ol { padding-left: 22px; display: grid; gap: 10px; }
.art-conteudo li::marker { color: var(--arx-blue); }
.art-conteudo blockquote {
  margin-top: 30px; padding: 22px 28px; border-left: 3px solid var(--arx-blue);
  background: rgba(21,116,255,.06); border-radius: 0 12px 12px 0;
  font-size: 19px; line-height: 30px; color: var(--arx-white);
}
.art-conteudo a { color: var(--arx-blue-border); text-decoration: underline; text-underline-offset: 3px; }

.art-conteudo a.arx-btn {
  color: var(--arx-white); text-decoration: none;
}
.art-conteudo a.arx-btn--stroke { color: var(--arx-white); }

.art-conteudo .wp-block-group > * + *,
.art-conteudo .wp-block-group__inner-container > * + *,
.art-conteudo .wp-block-column > * + * { margin-top: 22px; }

.art-conteudo > :first-child,
.art-conteudo > :first-child > :first-child,
.art-conteudo > :first-child > :first-child > :first-child { margin-top: 0; }

.art-conteudo > .wp-block-group + .wp-block-group { margin-top: 48px; }

.art-conteudo .wp-block-image { margin-block: 34px; }
.art-conteudo .wp-block-image img {
  display: block; width: 100%; height: auto; border-radius: 14px;
  box-shadow: 0 0 0 1px rgba(21,116,255,.18), 0 26px 60px -40px rgba(0,0,0,.9);
}
.art-conteudo .wp-block-image figcaption {
  margin-top: 12px; font-size: 14px; line-height: 22px; color: var(--arx-grey-70);
}

.art-conteudo .wp-block-columns { margin-block: 34px; align-items: center; gap: 34px; }

.art-conteudo p:has(> i:only-child),
.art-conteudo p:has(> em:only-child) {
  margin-top: 26px; padding: 4px 0 4px 22px;
  border-left: 3px solid rgba(21,116,255,.55);
  color: var(--arx-white);
}
.art-conteudo p:has(> i:only-child) i,
.art-conteudo p:has(> em:only-child) em { font-style: normal; }

/* ── Blocos padrão do Gutenberg no corpo do texto ──────────────────────────
   O reset de base zera `list-style` em todo ul/ol (certo para menus e cards),
   mas o conteúdo editorial nunca o restaurava, por isso as listas do editor
   apareciam sem marcador nenhum. O resto abaixo é o que o editor entrega e o
   tema ainda não vestia: tabela, código, separador e botão vinham com o
   default do core, desenhado para tema claro. */

/* Listas: devolve o marcador que o reset tirou. */
.art-conteudo ul { list-style: disc; }
.art-conteudo ol { list-style: decimal; }
.art-conteudo ul ul { list-style: circle; }
.art-conteudo ul ul ul { list-style: square; }
.art-conteudo ol ol { list-style: lower-alpha; }
.art-conteudo li { display: list-item; }
.art-conteudo li::marker { color: var(--arx-blue); }
/* sublistas respiram como um bloco só, sem dobrar o gap da lista-mãe */
.art-conteudo li > ul,
.art-conteudo li > ol { margin-top: 10px; padding-left: 22px; }

/* Tabela: a do core vem com borda clara de tema claro. */
/* `overflow-x: auto` sozinho faz o eixo Y virar `auto` também (regra da
   spec), e o arredondamento da borda sobra 1px, o que acendia uma barra de
   rolagem vertical fantasma. Fixar o eixo Y resolve; a rolagem que interessa,
   em tabela larga no celular, é a horizontal. */
.art-conteudo .wp-block-table,
.art-conteudo figure.wp-block-table { margin-block: 34px; overflow: auto hidden; }
.art-conteudo table {
  width: 100%; border-collapse: collapse;
  font-size: 15px; line-height: 22px;
}
.art-conteudo th,
.art-conteudo td {
  padding: 12px 16px; text-align: left; vertical-align: top;
  border: 1px solid rgba(255,255,255,.12);
}
.art-conteudo th {
  background: rgba(21,116,255,.10);
  font-weight: var(--fw-semibold); color: var(--arx-white);
}
.art-conteudo tbody tr:nth-child(even) { background: rgba(255,255,255,.02); }
.art-conteudo figcaption,
.art-conteudo .wp-element-caption {
  margin-top: 10px; font-size: 13px; line-height: 19px; color: var(--arx-grey-70);
}

/* Código: caixa escura, como os outros contêineres do site. */
.art-conteudo pre,
.art-conteudo .wp-block-code {
  margin-block: 28px; padding: 18px 20px; border-radius: 12px; overflow-x: auto;
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.10);
}
.art-conteudo pre,
.art-conteudo code,
.art-conteudo kbd {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 14px; line-height: 22px; color: var(--arx-grey-90);
}
/* trecho de código no meio da frase */
.art-conteudo :not(pre) > code {
  padding: 2px 6px; border-radius: 5px;
  background: rgba(21,116,255,.12); color: #cfe0ff; font-size: .92em;
}

/* Separador: o filete do sistema, não a régua do navegador. */
.art-conteudo hr,
.art-conteudo .wp-block-separator {
  margin-block: 40px; height: 0;
  border: 0; border-top: 1px solid rgba(255,255,255,.12);
}

/* Botão do editor veste o botão do tema. */
.art-conteudo .wp-block-buttons { margin-block: 30px; display: flex; flex-wrap: wrap; gap: 14px; }
.art-conteudo .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 15px 26px; border-radius: var(--r-btn);
  background-image: var(--arx-grad-btn);
  font-size: 16px; line-height: 20px; color: var(--arx-white);
  text-decoration: none; border: 0;
}
.art-conteudo .wp-block-button__link:hover { filter: brightness(1.08); }
.art-conteudo .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent; background-image: none;
  border: 1px solid var(--arx-blue-border);
}

/* Galeria e legendas de imagem seguem o mesmo respiro dos demais blocos. */
.art-conteudo .wp-block-gallery { margin-block: 34px; }
.art-conteudo .wp-block-gallery img { border-radius: 10px; }

.art-tags { margin-top: 48px; display: flex; flex-wrap: wrap; gap: 10px; }
.art-tags a {
  padding: 8px 16px; border-radius: 20px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.12);
  font-size: 13px; color: var(--arx-grey-90);
}
.art-tags a:hover { border-color: var(--arx-blue); color: var(--arx-white); }

.art-autor {
  margin-top: 40px; display: flex; gap: 20px; align-items: flex-start;
  padding: 26px 28px; border-radius: 16px;
  background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.09);
}
.art-autor img { width: 46px; height: 46px; flex: none; object-fit: contain; }
.art-autor b { display: block; font-size: 16px; color: var(--arx-white); }
.art-autor p { margin-top: 6px; font-size: 14px; line-height: 22px; color: var(--arx-grey-70); }

/* A coluna grudada não pode ser mais alta que a tela: o que passasse disso
   ficaria preso fora de alcance, foi o que aconteceu quando o cartão da
   Lista VIP entrou como quarto bloco. Ela vira um painel com rolagem própria,
   e o sumário devolve a rolagem dele para não empilhar um scroll dentro do
   outro. */
/* A coluna grudada não passa da tela. Antes o painel inteiro rolava, e o que
   estivesse embaixo, o cartão da Lista VIP, no boletim, só aparecia depois
   de rolar. Agora quem cede espaço é a lista do sumário: ela encolhe e rola
   dentro do próprio cartão, e tudo o que vem depois continua sempre à vista.
   Continua havendo uma rolagem só, não duas aninhadas. */
.art-side__sticky {
  position: sticky; top: calc(var(--arx-header-h) - 60px);
  display: flex; flex-direction: column; gap: 24px;
  max-height: calc(100dvh - (var(--arx-header-h) - 60px) - 24px);
  overflow: hidden;
}
/* cartões guardam a altura natural; só o sumário é elástico */
.art-side__sticky > * { flex: none; }
.art-side__sticky > .art-sumario {
  display: flex; flex-direction: column; min-height: 0; flex: 0 1 auto;
}
.art-sumario, .art-share, .art-cta-lateral, .evt-form {
  padding: 24px 26px; border-radius: 16px;
  background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.09);
}
.art-sumario b, .art-share b, .art-cta-lateral b, .evt-form__tit {
  display: block; font-size: 15px; font-weight: var(--fw-semibold); color: var(--arx-white);
}
/* ── Sumário lateral ───────────────────────────────────────────────────────
   Agora ele espelha a estrutura do texto: h2 na raiz, h3 e h4 recuados. Como
   os títulos saem inteiros, o item quebra em várias linhas, o recuo vive no
   padding do <li> para que a segunda linha alinhe com a primeira, e não volte
   para a margem. O trilho à esquerda dá a leitura de hierarquia sem exigir
   numeração, que ficaria errada assim que houvesse subnível. */
.art-sumario__lista {
  margin-top: 14px; padding-left: 0; list-style: none;
  display: grid; gap: 2px;
  overflow-y: auto; overscroll-behavior: contain; min-height: 0;
  scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.14) transparent;
}
.art-sumario__lista::-webkit-scrollbar { width: 6px; }
.art-sumario__lista::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); border-radius: 3px; }
.art-sumario__item { position: relative; }
.art-sumario__item a {
  display: block; padding: 6px 4px 6px 14px;
  border-left: 2px solid rgba(255,255,255,.10);
  font-size: 14px; line-height: 20px; color: var(--arx-grey-70);
  transition: color .2s var(--arx-ease), border-color .2s var(--arx-ease);
}
.art-sumario__item--n1 a { padding-left: 28px; font-size: 13.5px; }
.art-sumario__item--n2 a { padding-left: 42px; font-size: 13px; }
.art-sumario__item a:hover {
  color: var(--arx-white); border-left-color: var(--arx-blue);
}
/* item da seção que está sendo lida */
.art-sumario__item.is-atual a {
  color: var(--arx-white); border-left-color: var(--arx-blue);
}


.art-share__links { margin-top: 14px; display: flex; gap: 12px; }
.art-share__links a {
  width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px;
  border: 1px solid rgba(255,255,255,.14); color: var(--arx-grey-90);
  transition: border-color .3s var(--arx-ease), color .3s var(--arx-ease);
}
.art-share__links a:hover { border-color: var(--arx-blue); color: var(--arx-white); }
.art-share__links svg { width: 20px; height: 20px; }
.art-cta-lateral { background: rgba(21,116,255,.06); border-color: rgba(21,116,255,.3); }
.art-cta-lateral p { margin-top: 8px; font-size: 14px; line-height: 21px; color: var(--arx-grey-90); }
.art-cta-lateral .arx-btn { margin-top: 18px; }

.art-rel { padding-block: 0 96px; }
.art-rel__head { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.art-rel__h2 { font-size: 34px; line-height: 42px; font-weight: var(--fw-regular); color: var(--arx-white); }
.art-rel__grid { margin-top: 44px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; }

.evt-hero { position: relative; padding: calc(var(--arx-header-h) + 20px) 0 70px; overflow: hidden; }
.evt-hero__bg { position: absolute; inset: 0; background: linear-gradient(168deg, #0d1730 0%, #14161c 62%, #151515 100%); }
.evt-hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(900px 400px at 75% 0%, rgba(21,116,255,.3), transparent 70%);
}
.evt-hero__inner { position: relative; z-index: 1; --leitura: 980px; }
.evt-selo {
  display: inline-block; margin-top: 24px; padding: 8px 18px; border-radius: 20px;
  background: rgba(21,116,255,.16); border: 1px solid var(--arx-blue);
  font-size: 13px; letter-spacing: 1px; text-transform: uppercase; color: var(--arx-white);
}
.evt-titulo {
  margin-top: 18px;
  font-size: clamp(30px, 2.5vw, 48px); line-height: 1.17; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.evt-lead { margin-top: 18px; max-width: 720px; font-size: 18px; line-height: 28px; color: var(--arx-grey-90); }

.evt-dados {
  margin-top: 36px; display: flex; flex-wrap: wrap; gap: 14px;
  max-width: 940px;
}
.evt-dado {
  display: flex; align-items: center; gap: 13px;
  padding: 14px 20px; border-radius: 12px;
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.10);
}

.evt-dado b { white-space: nowrap; }
.evt-dado svg { width: 24px; height: 24px; flex: none; color: var(--arx-blue); }

.evt-dado span {
  display: flex; flex-direction: column-reverse; gap: 2px;
  font-size: 12px; line-height: 16px; color: var(--arx-grey-50);
}
.evt-dado b { font-size: 15px; line-height: 22px; font-weight: var(--fw-semibold); color: var(--arx-white); }
.evt-acoes { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 14px; }

.evt-video { padding-block: 0; margin-top: -40px; position: relative; z-index: 2; }
.evt-player {
  position: relative; aspect-ratio: 16 / 8; border-radius: 18px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(21,116,255,.3), 0 50px 110px -60px rgba(0,0,0,.95);
}
.evt-player img { width: 100%; height: 100%; object-fit: cover; }
.evt-player::after {
  content: ""; position: absolute; inset: 0; background: rgba(6,8,14,.35); pointer-events: none;
}
.evt-player__play {
  position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(21,116,255,.9); border: 2px solid var(--arx-blue-border); cursor: pointer;
  box-shadow: 0 0 40px -6px rgba(21,116,255,.9);
  transition: transform .3s var(--arx-ease);
}
.evt-player__play:hover { transform: translate(-50%, -50%) scale(1.07); }
.evt-player__play svg { width: 32px; height: 32px; color: #fff; margin-left: 4px; }

.evt-player.is-tocando::after,
.evt-player.is-tocando .evt-player__play { display: none; }
.evt-player.is-tocando img,
.evt-player.is-tocando .evt-player__ph,
.evt-player.is-tocando .bl-dest__ph { visibility: hidden; }
.evt-player iframe { z-index: 2; }

.evt-insc {
  padding: 24px 26px; border-radius: 16px;
  background: rgba(255,255,255,.03); border: 1px solid rgba(21,116,255,.3);
  display: grid; gap: 10px; justify-items: start;
}
.evt-insc .arx-btn { margin-top: 6px; }

.evt-corpo { padding-block: 76px 96px; }
.evt-prog { margin-top: 22px; padding: 0; list-style: none; display: grid; gap: 12px; max-width: 760px; }
.evt-prog li {
  display: flex; gap: 20px; align-items: baseline;
  padding: 16px 20px; border-radius: 12px;
  background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.08);
}
.evt-prog b { flex: none; width: 62px; font-variant-numeric: tabular-nums; color: var(--arx-blue-border); }
.evt-prog span { font-size: 15px; line-height: 23px; color: var(--arx-grey-90); }

.evt-palestrantes { margin-top: 48px; max-width: 760px; }
.evt-palestrantes h2 { font-size: 30px; line-height: 38px; font-weight: var(--fw-semibold); color: var(--arx-white); }
.evt-pal__grid { margin-top: 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.evt-pal {
  display: flex; align-items: center; gap: 16px;
  padding: 18px 20px; border-radius: 14px;
  background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.09);
}
.evt-pal img { width: 44px; height: 44px; flex: none; object-fit: contain; }
.evt-pal b { display: block; font-size: 15px; color: var(--arx-white); }
.evt-pal span { font-size: 13px; color: var(--arx-grey-70); }

.evt-form { display: grid; gap: 12px; }
.evt-form__sub { font-size: 14px; line-height: 21px; color: var(--arx-grey-70); }
.evt-form input {
  height: 46px; padding: 0 16px; border-radius: 10px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.16);
  color: var(--arx-white); font-family: var(--arx-font); font-size: 15px;
}
.evt-form input::placeholder { color: var(--arx-grey-50); }
.evt-form input:focus-visible { outline: 2px solid var(--arx-blue-border); outline-offset: 2px; }
.evt-form .arx-btn { width: 100%; justify-content: center; }
.evt-form__nota { font-size: 12px; line-height: 18px; color: var(--arx-grey-50); }

.cs-hero { position: relative; padding: calc(var(--arx-header-h) + 40px) 0 70px; overflow: hidden; }
.cs-hero__luz {
  position: absolute; z-index: 0; left: 50%; top: -140px;
  width: 900px; height: 480px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(50% 50% at 50% 50%, rgba(21,116,255,.34), rgba(21,116,255,.10) 45%, transparent 72%);
}
.cs-hero__inner { position: relative; z-index: 1; text-align: center; }
.cs-hero__title {
  margin-top: 20px;
  font-size: clamp(32px, 3.5417vw, 68px); line-height: 1.09; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.cs-hero__sub { margin: 20px auto 0; max-width: 724px; font-size: 20px; line-height: 30px; color: var(--arx-grey-90); }

.cs-lista { padding-block: 0 96px; position: relative; overflow-x: clip; }
.cs-filtros { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.cs-filtros__btn {
  height: 42px; padding-inline: 24px; border-radius: 21px;
  font-family: var(--arx-font); font-size: 15px; color: var(--arx-white); cursor: pointer;
  transition: background-color .3s var(--arx-ease);
}
.cs-filtros__btn:hover { background-color: rgba(21,116,255,.18); }
.cs-filtros__btn.is-on { background: var(--arx-blue); border-color: transparent; }

.cs-select { display: none; position: relative; border-radius: 24px; }
.cs-select select {
  width: 100%; height: 48px; padding: 0 46px 0 20px;
  background: none; border: 0; appearance: none;
  font-family: var(--arx-font); font-size: 15px; color: var(--arx-white);
}
.cs-select select option { background: #14161c; color: var(--arx-white); }
.cs-select svg {
  position: absolute; right: 18px; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; color: var(--arx-blue); pointer-events: none;
}

.cs-grid { margin-top: 52px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 42px; }
.cs-grid--rel { margin-top: 44px; }
.cs-vazio { margin-top: 52px; text-align: center; font-size: 16px; color: var(--arx-grey-70); }

.ccard { display: flex; flex-direction: column; }
.ccard__capa {

  position: relative; display: block;
  aspect-ratio: 390 / 240; overflow: hidden;
  border-radius: var(--r-small-xxl); background: #0c0c0c;
  box-shadow: 0 0 0 1px rgba(21,116,255,.25), 0 18px 50px -24px rgba(21,116,255,.55);
}
.ccard__ph {
  position: absolute; inset: 0;
  background:
    radial-gradient(120% 90% at 70% 10%, rgba(21,116,255,.22), transparent 60%),
    linear-gradient(160deg, #14203a, #0b0b0b);
}
.ccard:hover .ccard__capa img { transform: scale(1.05); }

.ccard__capa.arx-capa--banner:hover img { transform: none; }
.ccard__seg {
  position: absolute; z-index: 2; top: 14px; right: 14px;
  display: inline-flex; align-items: center; height: 34px; padding-inline: 16px;
  font-size: 13.5px; letter-spacing: -.24px; color: var(--arx-white);
}
.ccard__titulo { margin-top: 22px; font-size: 22px; line-height: 28px; font-weight: var(--fw-semibold); }
.ccard__titulo a { color: var(--arx-white); transition: color .3s var(--arx-ease); }
.ccard__titulo a:hover { color: var(--arx-blue-border); }
.ccard__resumo { margin-top: 12px; flex: 1; font-size: 15px; line-height: 23px; color: var(--arx-grey-70); }
.ccard__btn { margin-top: 22px; align-self: flex-start; }

html.arx-anim .ccard {
  opacity: 0; transform: translateY(22px);
  transition: opacity .6s var(--arx-ease), transform .6s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 80ms);
}
html.arx-anim .is-revealed .ccard { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.arx-anim .ccard { opacity: 1; transform: none; transition: none; }
}

.cs-topo { position: relative; padding: calc(var(--arx-header-h) + 20px) 0 40px; overflow: hidden; }

.cs-topo__bg { position: absolute; inset: 0; background: linear-gradient(168deg, #101828 0%, #14161c 62%, #151515 100%); }

.cs-topo__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(58% 62% at 27% 58%, rgba(21,116,255,.30) 0%, rgba(21,116,255,.10) 45%, transparent 72%),
    radial-gradient(70% 40% at 78% 0%, rgba(21,116,255,.08) 0%, transparent 66%);
}
.cs-topo__inner { position: relative; z-index: 1; --leitura: 940px; }
.cs-topo__seg {
  display: inline-block; margin-top: 22px;
  font-size: 13px; letter-spacing: 1.2px; text-transform: uppercase;
  font-weight: var(--fw-semibold); color: var(--arx-blue-border);
}
.cs-topo__titulo {
  margin-top: 12px;
  font-size: clamp(30px, 2.7083vw, 52px); line-height: 1.16; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.cs-corpo { padding-block: 40px 96px; }
.cs-corpo__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 64px; align-items: start; }

.cs-depo {
  margin: 48px 0 0; padding: 32px 36px; border-radius: 16px;
  background: rgba(21,116,255,.06); border: 1px solid rgba(21,116,255,.3);
  display: grid; grid-template-columns: 116px 1fr; gap: 28px; align-items: start;
}
.cs-depo__foto {
  position: relative; aspect-ratio: 1; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(21,116,255,.45);
}
.cs-depo__foto img { width: 100%; height: 100%; object-fit: cover; }
.cs-depo__ph {
  position: absolute; inset: 0;
  background:
    radial-gradient(120% 90% at 50% 15%, rgba(21,116,255,.35), transparent 62%),
    linear-gradient(160deg, #14203a, #0b0b0b);
}
.cs-depo__aspas { display: block; width: 30px; height: 22px; color: var(--arx-blue); }
.cs-depo blockquote { margin: 14px 0 0; font-size: 19px; line-height: 30px; color: var(--arx-white); }
.cs-depo figcaption { margin-top: 18px; display: flex; flex-direction: column; }
.cs-depo b { font-size: 15px; color: var(--arx-white); }
.cs-depo span { margin-top: 2px; font-size: 14px; color: var(--arx-grey-70); }

.cs-topo__marca {
  display: grid; place-items: center; width: fit-content;
  margin-top: 26px; margin-bottom: 4px; padding: 12px 20px;
  background: #fff; border-radius: 12px;
  box-shadow: 0 10px 30px -18px rgba(0,0,0,.8);
}
.cs-topo__logo { display: block; height: 40px; width: auto; max-width: 260px; object-fit: contain; }

.cs .art-conteudo h2 {
  margin-top: 40px; font-size: 22px; line-height: 30px;
  font-weight: var(--fw-semibold); color: var(--arx-white);
}

.cs-fala { padding-block: 0 96px; }
.cs-fala__head { text-align: center; }
.cs-fala__h2 {
  margin-top: 14px; font-size: 34px; line-height: 42px;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.cs-fala__sub { margin: 14px auto 0; max-width: 620px; font-size: 16px; line-height: 27px; color: var(--arx-grey-70); }
.cs-fala__form { margin: 40px auto 0; max-width: 760px; }

.cs-tec { margin-top: 48px; }
.cs-tec h2 { font-size: 30px; line-height: 38px; font-weight: var(--fw-semibold); color: var(--arx-white); }
.cs-tec__grid { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 12px; }
.cs-tec__item {
  display: inline-flex; align-items: center; height: 46px; padding-inline: 22px;
  border-radius: 23px; font-size: 15px; color: var(--arx-white);
}

.bo-hero { position: relative; padding: calc(var(--arx-header-h) + 40px) 0 70px; overflow: hidden; }
.bo-hero__luz {
  position: absolute; z-index: 0; left: 50%; top: -160px;
  width: 900px; height: 500px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(50% 50% at 50% 50%, rgba(21,116,255,.32), rgba(21,116,255,.10) 45%, transparent 72%);
}
.bo-hero__inner { position: relative; z-index: 1; text-align: center; }
.bo-hero__title {
  margin-top: 20px;
  font-size: clamp(32px, 3.5417vw, 68px); line-height: 1.09; letter-spacing: -0.01em;
  font-weight: var(--fw-regular); color: var(--arx-white);
}
.bo-hero__sub { margin: 20px auto 0; max-width: 724px; font-size: 20px; line-height: 30px; color: var(--arx-grey-90); }
.bo-hero__form { margin: 34px auto 0; max-width: 560px; display: flex; gap: 14px; }
.bo-hero__form input {
  flex: 1; min-width: 0; height: 52px; padding: 0 22px; border-radius: 26px;
  color: var(--arx-white); font-family: var(--arx-font); font-size: 15px;
}
.bo-hero__form input::placeholder { color: var(--arx-grey-50); }
.bo-hero__form input:focus-visible { outline: 2px solid var(--arx-blue-border); outline-offset: 3px; }

.bo-hero__ou {
  margin: 22px auto 0; max-width: 560px;
  display: flex; align-items: center; gap: 16px;
  color: var(--arx-grey-50); font-size: 13px;
}
.bo-hero__ou::before, .bo-hero__ou::after { content: ""; flex: 1; height: 1px; }
.bo-hero__ou::before { background: linear-gradient(90deg, transparent, #1e2a3d); }
.bo-hero__ou::after  { background: linear-gradient(90deg, #1e2a3d, transparent); }

.bo-hero__zap {
  margin: 18px auto 0; height: 52px; padding: 0 26px; border-radius: 26px;
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--arx-white); font-size: 15px; text-decoration: none;
  transition: border-color .25s ease;
}
.bo-hero__zap svg { width: 18px; height: 18px; fill: #25d366; flex: none; }
.bo-hero__zap:hover, .bo-hero__zap:focus-visible { border-color: #25d366; }

.bo-dest { padding-block: 0 96px; }
.bo-lista { padding-block: 0 96px; position: relative; overflow-x: clip; }
.bo-lista__h2 { margin-top: 14px; font-size: 40px; line-height: 46px; font-weight: var(--fw-regular); color: var(--arx-white); }
.bo-grid { margin-top: 52px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 42px; }

.bcard { display: flex; flex-direction: column; }
.bcard__capa {
  position: relative; display: block; aspect-ratio: 390 / 240; overflow: hidden;
  border-radius: var(--r-small-xxl); background: #0c0c0c;
  box-shadow: 0 0 0 1px rgba(21,116,255,.25), 0 18px 50px -24px rgba(21,116,255,.55);
}
.bcard__capa img, .ccard__capa > img:not(.ccard__logo) {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s var(--arx-ease);
}

.bcard__capa.arx-capa--banner > img {
  height: auto; max-height: 100%; object-fit: contain;
}
.bcard:hover .bcard__capa img { transform: scale(1.05); }
.bcard__ph {
  position: absolute; inset: 0;
  background:
    radial-gradient(120% 90% at 70% 10%, rgba(21,116,255,.32), transparent 60%),
    linear-gradient(160deg, #14203a, #0b0b0b);
}

.bcard__ed {
  position: absolute; z-index: 2; top: 14px; right: 14px;
  display: inline-flex; align-items: center; height: 34px; padding-inline: 16px;
  font-size: 13.5px; letter-spacing: -.24px; color: var(--arx-white);
}
.bcard__mes { display: block; margin-top: 20px; font-size: 13px; letter-spacing: 1.1px; text-transform: uppercase; font-weight: var(--fw-semibold); color: var(--arx-blue-border); }
.bcard__titulo { margin-top: 8px; font-size: 20px; line-height: 29px; font-weight: var(--fw-semibold); }
.bcard__titulo a { color: var(--arx-white); transition: color .3s var(--arx-ease); }
.bcard__titulo a:hover { color: var(--arx-blue-border); }
.bcard__resumo { margin-top: 12px; flex: 1; font-size: 15px; line-height: 23px; color: var(--arx-grey-70); }
.bcard__btn { margin-top: 22px; align-self: flex-start; }

.bcard--destaque {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr auto auto auto auto 1fr;
  column-gap: 44px; padding: 28px; border-radius: 20px;
  background: rgba(255,255,255,.022); border: 1px solid rgba(21,116,255,.34);
}
.bcard--destaque .bcard__capa {
  grid-column: 1; grid-row: 1 / -1; align-self: center; aspect-ratio: 16 / 10;
}
.bcard--destaque .bcard__mes    { grid-column: 2; grid-row: 2; margin-top: 0; }
.bcard--destaque .bcard__titulo { grid-column: 2; grid-row: 3; font-size: 30px; line-height: 38px; }
.bcard--destaque .bcard__resumo { grid-column: 2; grid-row: 4; flex: none; margin-top: 14px; font-size: 16px; line-height: 25px; }

.bcard--destaque .bcard__btn    { grid-column: 2; grid-row: 5; justify-self: start; margin-top: 22px; }

html.arx-anim .bcard {
  opacity: 0; transform: translateY(22px);
  transition: opacity .6s var(--arx-ease), transform .6s var(--arx-ease);
  transition-delay: calc(var(--i, 0) * 80ms);
}
html.arx-anim .is-revealed .bcard, html.arx-anim .is-revealed.bcard { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.arx-anim .bcard { opacity: 1; transform: none; transition: none; }
}

.bo-selo {
  display: inline-block; margin-top: 24px; padding: 8px 18px; border-radius: 20px;
  background: rgba(21,116,255,.16); border: 1px solid var(--arx-blue);
  font-size: 13px; letter-spacing: 1px; text-transform: uppercase; color: var(--arx-white);
}
.bo-assina { padding: 24px 26px; border-radius: 16px; }
.bo-assina b { display: block; font-size: 15px; font-weight: var(--fw-semibold); color: var(--arx-white); }
.bo-assina p { margin-top: 8px; font-size: 14px; line-height: 21px; color: var(--arx-grey-70); }
.bo-assina form { margin-top: 16px; display: grid; gap: 12px; }
.bo-assina input {
  height: 44px; padding: 0 16px; border-radius: 10px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.16);
  color: var(--arx-white); font-family: var(--arx-font); font-size: 15px;
}
.bo-assina input::placeholder { color: var(--arx-grey-50); }
.bo-assina .arx-btn { width: 100%; justify-content: center; }

/* O cartão passou a convidar para o grupo do WhatsApp. O botão herda o
   .arx-btn (que aqui já é full-width) na variante discreta, e o ícone leva o
   verde da rede, o mesmo tratamento de .bo-hero__zap e .ct-canal--zap. */
.bo-assina__zap { margin-top: 16px; }
.bo-assina__zap svg { width: 18px; height: 18px; fill: #25d366; flex: none; }

.bu-hero { padding-bottom: 8px; }

.bu-hero__luz {
  position: absolute; z-index: 0; pointer-events: none;
  top: -240px; left: 50%; transform: translateX(-50%);
  width: min(1180px, 118vw); aspect-ratio: 1180 / 720;
  background: radial-gradient(50% 50% at 50% 50%,
    rgba(21,116,255,.30) 0%, rgba(21,116,255,.12) 42%, rgba(21,116,255,0) 72%);
  filter: blur(18px);
}
.bu-hero .bl-hero__topo { align-items: center; }

.bu-busca { margin-top: 38px; max-width: 620px; }
.bu-abas { flex-wrap: wrap; justify-content: center; max-width: 100%; }
.bu-abas .in-abas__btn {
  min-width: 0; padding-inline: 22px; gap: 8px; text-decoration: none;
}

.bu-abas__n { font-size: 13px; color: rgba(255,255,255,.55); }
.bu-abas .in-abas__btn.is-on .bu-abas__n { color: rgba(255,255,255,.8); }

.bu-lista { padding-block: 72px 96px; position: relative; overflow-x: clip; }
.bu-lista .in-ult__grid { margin-top: 0; }

.bu-lista::before {
  content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: min(1180px, 90vw); height: 1px;
  background: linear-gradient(90deg,
    transparent 0%, rgba(21,116,255,.55) 50%, transparent 100%);
}

.bu-vazio { text-align: center; }
.bu-vazio__txt {
  margin: 0 auto; max-width: 620px;
  font-size: 17px; line-height: 29px; color: var(--arx-grey-70);
}
.bu-vazio__links {
  margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;
}
.bu-vazio__h2 {
  margin-top: 84px; text-align: center;
  font-size: 28px; line-height: 36px; font-weight: var(--fw-regular); color: var(--arx-white);
}
.bu-vazio__h2 + .in-ult__grid { margin-top: 40px; }

.arx-sug__ancora { position: relative; z-index: 40; }
.arx-sug {
  position: absolute; z-index: 30; top: calc(100% + 10px); left: 0; right: 0;

  text-align: left;
  padding: 8px; border-radius: 18px;
  border: 1px solid rgba(21,116,255,.55);
  background: linear-gradient(180deg, rgba(16,18,22,.97) 0%, rgba(9,9,11,.97) 100%);
  backdrop-filter: blur(18px);
  box-shadow: 0 26px 60px -22px rgba(0,0,0,.9), 0 0 34px -18px rgba(21,116,255,.85);
  animation: arx-sug-entra .22s var(--arx-ease) both;
}
.arx-sug[hidden] { display: none; }
@keyframes arx-sug-entra {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .arx-sug { animation: none; } }

.arx-sug__lista {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px;

  max-height: 58vh; overflow-y: auto;
}
.arx-sug__item {
  display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center;
  padding: 9px 10px; border-radius: 12px; text-decoration: none;
  transition: background-color .2s var(--arx-ease);
}
.arx-sug__lista > li.is-ativo .arx-sug__item,
.arx-sug__item:hover { background: rgba(21,116,255,.18); }
.arx-sug__capa {
  width: 64px; aspect-ratio: 16 / 11; border-radius: 8px;
  background: #0c0c0c center / cover no-repeat;
  box-shadow: inset 0 0 0 1px rgba(21,116,255,.28);
}
.arx-sug__corpo { min-width: 0; }

.arx-sug__tipo {
  display: block; font-style: normal;
  font-size: 10.5px; line-height: 14px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--arx-blue-border);
}
.arx-sug__titulo {
  margin-top: 3px;
  font-size: 13.5px; line-height: 19px; font-weight: var(--fw-semibold);
  color: var(--arx-white);

  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.arx-sug__titulo mark { background: none; color: var(--arx-blue-border); }
.arx-sug__vazio { margin: 0; padding: 16px 12px; font-size: 14px; color: var(--arx-grey-70); }
.arx-sug__todos {
  display: block; margin-top: 6px; padding: 11px 10px;
  border-top: 1px solid rgba(255,255,255,.08);
  font-size: 13px; color: var(--arx-blue-border); text-decoration: none;
  transition: color .2s var(--arx-ease);
}
.arx-sug__todos:hover { color: var(--arx-white); }


@media (max-width: 1024px) {
  /* Sem sticky (mobile.css) a coluna rola junto com a página: limitar a
     altura criaria uma rolagem dentro da outra. */
  .art-side__sticky { max-height: none; overflow: visible; }
  .art-sumario__lista { overflow-y: visible; }
}
