/* ==========================================================================
   Irroba — CSS único da central de ajuda

   CSS puro (sem pré-processador): cores, fontes e medidas ficam nas
   variáveis --ir-* logo abaixo. Todas as classes do tema usam o prefixo
   "ir-" e dependem só do HTML dos templates.

   Ordem do arquivo
     1. Variáveis e base (normalização, tipografia, link "Pular")
     2. Componentes gerais: botões, cabeçalho, busca, cartões, rodapé
     3. Páginas: início, módulo, seção, artigo, busca, solicitação,
        erro, perfil, solicitações, assinaturas, atividades, comunidade
     4. ADAPTADOR ZENDESK (no fim): marcação gerada pelo Zendesk

   Para usar em outra plataforma: as partes 1 a 3 valem para qualquer HTML
   com as mesmas classes; a parte 4 e os trechos marcados "Zendesk" dentro
   das páginas estilizam componentes que só existem no Zendesk.
   ========================================================================== */

:root {
  /* Marca */
  --ir-red: #E30005;          /* botões, ícones, início do degradê */
  --ir-red-text: #B30004;     /* texto e links em vermelho (7.2:1 no branco) */
  --ir-carmine: #9E0004;
  --ir-wine: #2A0A0E;
  --ir-red-50: #FDECEB;
  --ir-red-100: #FBD6D4;
  --ir-red-200: #F5C6C4;
  --ir-gradient: linear-gradient(135deg, var(--ir-red) 0%, var(--ir-carmine) 45%, var(--ir-wine) 100%);

  /* Neutros */
  --ir-ink: #16161D;          /* títulos (18:1) */
  --ir-ink-2: #4A4A57;        /* texto secundário (8.7:1) */
  --ir-line: #E6E6EA;
  --ir-bg: #F5F5F7;
  --ir-surface: #FFFFFF;

  /* Tipografia */
  --ir-font-heading: "Montserrat", system-ui, sans-serif;
  --ir-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Forma e profundidade */
  --ir-radius: 12px;
  --ir-radius-lg: 20px;
  --ir-shadow-sm: 0 1px 2px rgba(20, 20, 30, .06), 0 6px 18px rgba(20, 20, 30, .07);
  --ir-shadow-red: 0 2px 4px rgba(227, 0, 5, .06), 0 12px 28px rgba(227, 0, 5, .12);
  --ir-shadow-search: 0 12px 32px rgba(0, 0, 0, .28);

  /* Layout */
  --ir-container: 1200px;
  --ir-gutter: clamp(16px, 4vw, 32px);
  --ir-ease: .18s ease;
}

/* -------------------------------------------------------------------- base
   Normalização mínima (derivada do normalize.css v8, MIT) e padrões do tema. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* margens zeradas: cada componente define o próprio espaçamento */
* {
  margin: 0;
  padding: 0;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--ir-bg);
  color: var(--ir-ink);
  font-family: var(--ir-font-body);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

main {
  display: block;
}

@media (min-width: 1024px) {
  body > main {
    min-height: 65vh; /* rodapé não sobe em páginas curtas */
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  font-family: var(--ir-font-heading);
}

/* títulos de página e de seção sempre na fonte de títulos */
h1,
h2 {
  font-family: var(--ir-font-heading) !important;
}

h1 { font-size: 32px; }
h2 { font-size: 22px; }
h3 { font-size: 18px; font-weight: 600; }
h4 { font-size: 16px; }

a {
  background-color: transparent;
  color: var(--ir-red-text);
  text-decoration: none;
}

a:visited {
  color: inherit;
}

a:hover,
a:active,
a:focus {
  text-decoration: underline;
}

b,
strong {
  font-weight: bolder;
}

small {
  font-size: 80%;
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub { bottom: -0.25em; }
sup { top: -0.5em; }

img {
  border-style: none;
}

pre,
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

textarea {
  overflow: auto;
}

[type="checkbox"],
[type="radio"] {
  padding: 0;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

[hidden] {
  display: none;
}

/* link "Pular para o conteúdo": só aparece com o foco do teclado */
.ir-skip {
  position: absolute;
  top: -100px;
  left: 16px;
  z-index: 1000;
  padding: 12px 18px;
  border-radius: 10px;
  background: #fff;
  color: var(--ir-ink);
  font-weight: 600;
  box-shadow: var(--ir-shadow-sm);
}

.ir-skip:focus {
  top: 12px;
  outline: 3px solid var(--ir-ink);
  outline-offset: 2px;
}

/* ---------------------------------------------------------------- utilidades */
.ir-sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

.ir-container {
  width: 100%;
  max-width: var(--ir-container);
  margin: 0 auto;
  padding: 0 var(--ir-gutter);
  box-sizing: border-box;
}

.ir-page,
.ir-page *,
.ir-footer,
.ir-footer * {
  box-sizing: border-box;
}

.ir-page :focus-visible,
.ir-footer :focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 3px;
  border-radius: 6px;
}

.ir-on-dark :focus-visible {
  outline-color: #fff;
}

/* ------------------------------------------------------------------ página
   Toda página do tema fica dentro de .ir-page. */
body:has(.ir-page) {
  background: var(--ir-bg);
}

.ir-page {
  font-family: var(--ir-font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ir-ink);
  background: var(--ir-bg);
  -webkit-font-smoothing: antialiased;
}

/* Títulos dentro das páginas: fonte de títulos e sem margem própria. */
.ir-page :is(h1, h2, h3) {
  font-family: var(--ir-font-heading);
  margin: 0;
}

/* Resets com :where() têm especificidade zero: não sobrepõem os componentes abaixo. */
:where(.ir-page) :where(h1, h2, h3) {
  color: inherit;
  letter-spacing: -0.01em;
}

:where(.ir-page) p {
  margin: 0;
}

:where(.ir-page, .ir-footer) ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ---------------------------------------------------------------- botões */
.ir-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 20px;
  border-radius: 999px;
  border: 1.5px solid transparent;
  font: 600 15px/1.2 var(--ir-font-body);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ir-ease), color var(--ir-ease), border-color var(--ir-ease), box-shadow var(--ir-ease);
}

.ir-btn,
.ir-btn:visited,
.ir-btn:hover,
.ir-btn:focus {
  text-decoration: none;
}

.ir-btn--primary,
.ir-btn--primary:visited {
  background: var(--ir-red);
  color: #fff;
}

.ir-btn--primary:hover {
  background: #C40004;
  color: #fff;
}

.ir-btn--light,
.ir-btn--light:visited {
  background: #fff;
  color: var(--ir-red-text);
}

.ir-btn--light:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

/* --------------------------------------------------------------- cabeçalho */
.ir-top {
  background: var(--ir-gradient);
  color: #fff;
}

.ir-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 76px;
}

.ir-header__logo {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.ir-header__logo img {
  display: block;
  width: 110px;
  height: auto;
}

/* ------------------------------------------------------------------- hero */
.ir-hero {
  padding: clamp(24px, 5vw, 48px) 0 clamp(120px, 14vw, 150px);
}

.ir-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr);
  gap: 32px;
  align-items: center;
}

.ir-hero__title {
  font-size: clamp(30px, 4.4vw, 44px);
  font-weight: 700;
  line-height: 1.1;
  color: #fff;
}

.ir-hero__lead {
  margin-top: 12px;
  max-width: 520px;
  font-size: 17px;
  color: #fff;
}

.ir-hero__art {
  display: flex;
  justify-content: flex-end;
}

.ir-hero__art img {
  display: block;
  width: 100%;
  max-width: 320px;
  height: auto;
}

/* ------------------------------------------------------------------ busca */
.ir-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 28px;
  max-width: 600px;
  padding: 6px 6px 6px 16px;
  background: #fff;
  border-radius: 14px;
  box-shadow: var(--ir-shadow-search);
  position: relative;
}

.ir-search:focus-within {
  box-shadow: var(--ir-shadow-search), 0 0 0 3px #fff, 0 0 0 6px var(--ir-ink);
}

.ir-search__icon {
  flex: none;
  width: 20px;
  height: 20px;
  color: var(--ir-ink-2);
}

.ir-page .ir-search__input {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  padding: 0 4px;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  font: 400 16px var(--ir-font-body);
  color: var(--ir-ink);
  -webkit-appearance: none;
  appearance: none;
}

.ir-page .ir-search__input::placeholder {
  color: #6E6E7A; /* 4.9:1 no branco */
  opacity: 1;
}

.ir-page .ir-search__input:focus-visible {
  outline: 0; /* o anel fica no formulário inteiro (:focus-within) */
}

.ir-search__input::-webkit-search-cancel-button {
  display: none;
}

.ir-search__btn {
  flex: none;
  border-radius: 10px;
  padding: 10px 22px;
}

/* botão "limpar" criado pelo script.js do tema */
.ir-search .clear-button {
  display: none;
  flex: none;
  order: 2;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ir-ink-2);
  cursor: pointer;
}

.ir-search.search-has-value .clear-button {
  display: inline-flex;
}

.ir-search .clear-button:hover {
  background: var(--ir-bg);
}

.ir-search__btn {
  order: 3;
}

/* ---------------------------------------------------------------- atalhos */
.ir-quick {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin-top: 18px;
  font-size: 14px;
}

.ir-quick__label {
  color: #fff;
  font-weight: 500;
}

.ir-quick ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ir-quick a,
.ir-quick a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 6px 14px;
  border-radius: 999px;
  /* fundo vinho translúcido: branco sobre ele fica ≥ 7:1 em todo o degradê */
  background: rgba(42, 10, 14, .3);
  border: 1px solid rgba(255, 255, 255, .3);
  color: #fff;
  text-decoration: none;
  transition: background-color var(--ir-ease), border-color var(--ir-ease);
}

.ir-quick a:hover {
  background: rgba(42, 10, 14, .5);
  border-color: rgba(255, 255, 255, .6);
  color: #fff;
  text-decoration: none;
}

/* ---------------------------------------------------------------- seções */
.ir-section {
  padding: 56px 0 0;
}

.ir-section__head {
  margin-bottom: 20px;
}

.ir-section__title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
}

.ir-section__desc {
  margin-top: 4px;
  color: var(--ir-ink-2);
}

/* --------------------------------------------------------------- módulos */
.ir-modules {
  margin-top: calc(-1 * clamp(96px, 11vw, 116px));
  padding-top: 0;
}

.ir-modules .ir-section__title,
.ir-modules .ir-section__desc {
  color: #fff;
}

.ir-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.ir-mod,
.ir-mod:visited {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  background: var(--ir-surface);
  border: 1px solid transparent;
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
  color: var(--ir-ink);
  text-decoration: none;
  transition: transform var(--ir-ease), box-shadow var(--ir-ease), border-color var(--ir-ease), background-color var(--ir-ease);
}

.ir-mod:hover {
  transform: translateY(-3px);
  border-color: var(--ir-red-200);
  background: #FFFAFA;
  box-shadow: var(--ir-shadow-red);
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-mod__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 14px;
  border-radius: 12px;
  background: var(--ir-red-50);
  transition: background-color var(--ir-ease);
}

.ir-mod:hover .ir-mod__icon {
  background: var(--ir-red-100);
}

.ir-mod__icon img {
  display: block;
  width: 26px;
  height: 26px;
}

/* módulo novo sem ícone mapeado: mostra um marcador neutro */
.ir-mod__icon:not(:has(img))::before {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: var(--ir-red);
}

.ir-mod__title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
}

.ir-mod__arrow {
  flex: none;
  color: var(--ir-red-text);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity var(--ir-ease), transform var(--ir-ease);
}

.ir-mod:hover .ir-mod__arrow,
.ir-mod:focus-visible .ir-mod__arrow {
  opacity: 1;
  transform: none;
}

.ir-mod__desc {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ir-ink-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ------------------------------------------------ destaques + recentes */
.ir-duo {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 0 24px;
}

.ir-panel {
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
  padding: 4px 20px;
}

.ir-list li + li {
  border-top: 1px solid var(--ir-line);
}

.ir-list__link,
.ir-list__link:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 12px 0;
  color: var(--ir-ink);
  font-weight: 500;
  text-decoration: none;
}

.ir-list__link::after {
  content: "→";
  color: var(--ir-red-text);
  flex: none;
}

.ir-list__link:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Marcação gerada pelo helper {{recent_activity}} do Zendesk.
   Zendesk: a estrutura do HTML vem pronta; aqui só o visual. */
.ir-recent .recent-activity {
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
  padding: 4px 20px;
  margin: 0;
}

.ir-recent .recent-activity-header {
  display: none; /* o título da seção já é o h2 da página */
}

.ir-recent .recent-activity-list {
  display: block;
  margin: 0;
  padding: 0;
}

.ir-recent .recent-activity-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  margin: 0;
  padding: 14px 0;
  border: 0;
  border-bottom: 1px solid var(--ir-line);
}

.ir-recent .recent-activity-item h3,
.ir-recent .recent-activity-item-parent,
.ir-recent .recent-activity-item-parent:visited {
  order: 1;
  display: block;
  margin: 0;
  font: 500 13px/24px var(--ir-font-body); /* alvo de toque ≥ 24px (WCAG 2.2) */
  letter-spacing: 0;
  color: var(--ir-ink-2);
  text-decoration: none;
}

.ir-recent .recent-activity-item-parent:hover {
  color: var(--ir-ink);
  text-decoration: underline;
}

.ir-recent .recent-activity-item-link,
.ir-recent .recent-activity-item-link:visited {
  order: 2;
  display: block;
  margin: 0;
  font: 600 16px/1.5 var(--ir-font-body);
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-recent .recent-activity-item-link:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-recent .recent-activity-item-meta {
  order: 3;
  align-self: flex-start;
  display: block;
  margin: 2px 0 0;
  font-size: 13px;
  color: var(--ir-ink-2);
}

.ir-recent .recent-activity-item-time {
  color: var(--ir-ink-2);
}

.ir-recent .recent-activity-item-comment {
  display: none;
}

.ir-recent .recent-activity-controls {
  display: block;
  margin: 0;
  padding: 8px 0;
  text-align: left;
}

.ir-recent .recent-activity-controls a,
.ir-recent .recent-activity-controls a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ir-red-text);
  font: 600 15px var(--ir-font-body);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-transform: none;
}

/* ------------------------------------------------ topo das páginas internas */
.ir-inner-top {
  background: var(--ir-gradient);
  color: #fff;
  padding-bottom: 72px;
}

.ir-inner-nav {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 72px;
}

.ir-inner-nav .ir-header__logo img {
  width: 104px;
}

.ir-inner-nav .ir-btn {
  margin-left: auto;
}

.ir-mini-search {
  flex: 1;
  max-width: 520px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 6px 0 12px;
  background: #fff;
  border-radius: 12px;
}

.ir-mini-search:focus-within {
  box-shadow: 0 0 0 3px var(--ir-wine), 0 0 0 5px #fff;
}

.ir-page .ir-mini-search input {
  flex: 1;
  min-width: 0;
  min-height: 42px;
  padding: 0;
  border: 0;
  outline: 0;
  background: none;
  box-shadow: none;
  font: 400 15px var(--ir-font-body);
  color: var(--ir-ink);
  -webkit-appearance: none;
  appearance: none;
}

.ir-page .ir-mini-search input::placeholder {
  color: #6E6E7A;
  opacity: 1;
}

.ir-page .ir-mini-search input:focus-visible {
  outline: 0;
}

.ir-mini-search input::-webkit-search-cancel-button {
  display: none;
}

.ir-mini-search .clear-button {
  display: none;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ir-ink-2);
  cursor: pointer;
}

.ir-mini-search.search-has-value .clear-button {
  display: inline-flex;
}

/* breadcrumb */
.ir-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
}

.ir-crumbs li + li::before {
  content: "›";
  margin-right: 6px;
  opacity: .85;
}

.ir-crumbs a,
.ir-crumbs a:visited {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-crumbs a:hover {
  color: #fff;
  text-decoration-thickness: 2px;
}

.ir-crumbs [aria-current] {
  color: #fff;
  font-weight: 600;
}

/* cabeçalho do módulo */
.ir-cat-head {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 22px;
}

.ir-cat-head:focus {
  outline: 0;
}

.ir-cat-head__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 60px;
  height: 60px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
}

.ir-cat-head__icon img {
  display: block;
  width: 34px;
  height: 34px;
}

.ir-cat-head__icon:not(:has(img))::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background: var(--ir-red);
}

.ir-cat-head__title {
  font-size: clamp(26px, 3.4vw, 36px);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
}

.ir-cat-head__desc {
  margin-top: 6px;
  max-width: 680px;
  font-size: 16px;
  color: #fff;
}

.ir-cat-head__meta {
  margin-top: 4px;
  font-size: 14px;
  color: #fff;
}

.ir-cat-head__meta:empty {
  display: none;
}

.ir-inner-body {
  margin-top: -44px;
}

/* --------------------------------------------- índice lateral + seções */
.ir-toc-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

/* com menos de 3 seções o índice não ajuda: some e a lista ocupa a largura */
.ir-toc-layout:not(:has(.ir-seclist > section:nth-of-type(3))) {
  grid-template-columns: minmax(0, 1fr);
  max-width: 820px;
}

.ir-toc-layout:not(:has(.ir-seclist > section:nth-of-type(3))) :is(.ir-toc, .ir-toc-mobile) {
  display: none;
}

.ir-toc {
  position: sticky;
  top: 24px;
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: 16px 12px;
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-toc__title {
  margin: 0 8px 8px;
  font: 600 12px var(--ir-font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ir-ink-2);
}

.ir-toc a,
.ir-toc a:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 40px;
  padding: 6px 10px;
  border-radius: 8px;
  color: var(--ir-ink);
  font-size: 14px;
  line-height: 1.35;
  text-decoration: none;
}

.ir-toc a:hover {
  background: var(--ir-bg);
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-toc a[aria-current="true"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-toc__count {
  flex: none;
  font-size: 12px;
  font-weight: 400;
  color: var(--ir-ink-2);
}

.ir-toc-mobile {
  display: none;
}

.ir-seclist {
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-seclist > section {
  padding: 22px 26px 12px;
  scroll-margin-top: 24px;
}

.ir-seclist > section + section {
  border-top: 1px solid var(--ir-line);
}

.ir-sec__title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ir-ink);
}

.ir-sec__count {
  flex: none;
  font: 500 13px var(--ir-font-body);
  color: var(--ir-ink-2);
}

.ir-links {
  margin-top: 10px;
}

.ir-links li + li {
  border-top: 1px solid var(--ir-line);
}

.ir-links a,
.ir-links a:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 8px 0;
  color: var(--ir-ink);
  font-size: 15px;
  text-decoration: none;
}

.ir-links a::after {
  content: "→";
  flex: none;
  color: var(--ir-red-text);
  opacity: 0;
  transition: opacity var(--ir-ease);
}

.ir-links a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-links a:hover::after,
.ir-links a:focus-visible::after {
  opacity: 1;
}

.ir-links__star {
  flex: none;
  width: 14px;
  height: 14px;
  margin-left: 6px;
  color: var(--ir-red);
  vertical-align: -1px;
}

.ir-more,
.ir-more:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 4px;
  color: var(--ir-red-text);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-more:hover {
  color: var(--ir-red-text);
  text-decoration-thickness: 2px;
}

.ir-empty {
  margin-top: 8px;
  color: var(--ir-ink-2);
}

@media (max-width: 900px) {
  .ir-toc-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-toc {
    display: none;
  }

  .ir-toc-mobile {
    display: block;
    margin-bottom: 16px;
    background: var(--ir-surface);
    border-radius: var(--ir-radius);
    box-shadow: var(--ir-shadow-sm);
  }

  .ir-toc-mobile summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    padding: 0 16px;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
  }

  .ir-toc-mobile summary::-webkit-details-marker {
    display: none;
  }

  .ir-toc-mobile summary::after {
    content: "";
    width: 9px;
    height: 9px;
    margin-top: -4px;
    border-right: 2px solid var(--ir-red-text);
    border-bottom: 2px solid var(--ir-red-text);
    transform: rotate(45deg);
    transition: transform var(--ir-ease);
  }

  .ir-toc-mobile[open] summary::after {
    margin-top: 4px;
    transform: rotate(-135deg);
  }

  .ir-toc-mobile ul {
    padding: 0 8px 8px;
  }

  .ir-toc-mobile a,
  .ir-toc-mobile a:visited {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    min-height: 44px;
    align-items: center;
    padding: 6px 8px;
    border-radius: 8px;
    color: var(--ir-ink);
    text-decoration: none;
    font-size: 15px;
  }
}

@media (max-width: 640px) {
  .ir-inner-nav {
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 0;
  }

  .ir-inner-nav .ir-btn {
    min-height: 40px;
    padding: 8px 14px;
    font-size: 14px;
  }

  .ir-mini-search {
    order: 3;
    flex-basis: 100%;
    max-width: none;
  }

  .ir-cat-head {
    align-items: flex-start;
    gap: 14px;
  }

  .ir-cat-head__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
  }

  .ir-cat-head__icon img {
    width: 26px;
    height: 26px;
  }

  .ir-seclist > section {
    padding: 18px 18px 8px;
  }
}

/* ---------------------------------------------------------- página de seção */
.ir-cat-head__eyebrow,
.ir-cat-head__eyebrow:visited {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  margin-bottom: 2px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-cat-head__eyebrow:hover {
  color: #fff;
  text-decoration-thickness: 2px;
}

/* barra lateral opcional: só vira duas colunas quando a navegação é carregada */
.ir-side-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.ir-side-layout:has(> .ir-toc:not([hidden])) {
  grid-template-columns: 260px minmax(0, 1fr);
}

.ir-toc[hidden],
.ir-toc-mobile[hidden] {
  display: none !important;
}

.ir-toc a[aria-current="page"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-subsecs {
  margin-bottom: 24px;
}

.ir-subsecs .ir-section__title {
  margin-bottom: 12px;
}

.ir-subsecs .ir-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Zendesk: paginação gerada pelo helper {{pagination}} */
.ir-pager .pagination {
  display: block;
  width: auto;
  margin: 24px 0 0;
}

.ir-pager .pagination-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-pager li {
  display: block;
  margin: 0;
}

.ir-pager li::before,
.ir-pager li::after,
.ir-pager a::before,
.ir-pager a::after {
  display: none;
}

.ir-pager a,
.ir-pager a:visited {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 18px;
  margin: 0;
  border: 1px solid var(--ir-line);
  border-radius: 999px;
  background: var(--ir-surface);
  color: var(--ir-ink);
  font: 600 14px var(--ir-font-body);
  text-decoration: none;
  box-shadow: var(--ir-shadow-sm);
  transition: background-color var(--ir-ease), border-color var(--ir-ease), color var(--ir-ease);
}

.ir-pager a:hover {
  border-color: var(--ir-red-200);
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-pager span {
  display: inline;
  min-width: 32px; /* texto e ícone com a mesma largura mínima */
  text-align: center;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  font: inherit;
}

.ir-pager a:hover span {
  background: none;
  color: inherit;
}

/* "Primeiro"/"Último" sempre com texto, como "Anterior"/"Próximo" */
.ir-pager .pagination-first-text,
.ir-pager .pagination-last-text {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  clip-path: none;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .ir-side-layout:has(> .ir-toc:not([hidden])) {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .ir-subsecs .ir-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* --------------------------------------------------------- página de artigo */
.ir-art-head {
  max-width: 860px;
  margin-top: 22px;
}

.ir-art-head:focus {
  outline: 0;
}

.ir-art-head__title {
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
}

.ir-art-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-top: 10px;
  font-size: 14px;
  color: #fff;
}

.ir-art-meta > span:not([hidden]) + span:not([hidden])::before {
  content: "·";
  margin-right: 14px;
}

.ir-art-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 28px;
  align-items: start;
}

/* conteúdo largo (imagens do editor) não alarga a coluna */
.ir-art-layout > * {
  min-width: 0;
}

.ir-art-card {
  padding: clamp(22px, 4vw, 48px);
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

/* corpo do artigo: conteúdo vem do editor do Zendesk, com estilos inline;
   por isso algumas regras usam !important para padronizar a leitura */
.ir-article {
  max-width: 72ch;
  font-size: 17px;
  line-height: 1.75;
  color: var(--ir-ink);
  overflow-wrap: anywhere;
}

.ir-page .ir-article p {
  margin: 0 0 1.1em;
}

/* texto justificado atrapalha a leitura (WCAG 1.4.8): vira alinhado à esquerda */
.ir-article p,
.ir-article li,
.ir-article [class*="wysiwyg-text-align-justify"] {
  text-align: left !important;
}

.ir-article [class*="wysiwyg-text-align-center"] {
  text-align: center !important;
}

.ir-page .ir-article h2 {
  margin: 2em 0 .7em !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--ir-line) !important;
  font: 700 23px/1.3 var(--ir-font-heading) !important;
  scroll-margin-top: 24px;
}

.ir-page .ir-article h3 {
  margin: 1.7em 0 .5em !important;
  font: 700 19px/1.35 var(--ir-font-heading) !important;
  scroll-margin-top: 24px;
}

.ir-page .ir-article h4 {
  margin: 1.5em 0 .4em;
  font: 700 17px/1.4 var(--ir-font-heading);
}

.ir-page .ir-article ul,
.ir-page .ir-article ol {
  margin: 0 0 1.1em;
  padding-left: 1.5em;
  list-style: disc;
}

.ir-page .ir-article ol {
  list-style: decimal;
}

.ir-article li {
  margin: .3em 0;
}

.ir-article a,
.ir-article a:visited {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-article strong,
.ir-article b {
  font-weight: 600;
}

.ir-article img {
  display: block;
  max-width: 100%;
  height: auto !important;
  margin: 1.2em 0;
  border: 1px solid var(--ir-line);
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(20, 20, 30, .06);
  cursor: zoom-in;
}

.ir-article [class*="wysiwyg-text-align-center"] img {
  margin-left: auto;
  margin-right: auto;
}

.ir-article figure {
  margin: 1.2em 0;
}

/* o Zendesk dá display: table às figuras do editor: imagens largas
   passavam da coluna do texto e ficavam cortadas */
.ir-article figure {
  display: block;
  max-width: 100%;
}

.ir-article iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 1.2em 0;
  border: 0;
  border-radius: 10px;
}

.ir-article table {
  width: 100%;
  margin: 1.2em 0;
  border-collapse: collapse;
  font-size: 15px;
}

.ir-article th,
.ir-article td {
  padding: 8px 12px;
  border: 1px solid var(--ir-line);
  text-align: left;
}

.ir-article hr {
  margin: 2em 0;
  border: 0;
  border-top: 1px solid var(--ir-line);
}

/* anexos */
.ir-attachments {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--ir-line);
}

.ir-attachments__title {
  margin-bottom: 8px;
  font-size: 18px;
  font-weight: 700;
}

.ir-attachments a {
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-attachments__size {
  color: var(--ir-ink-2);
  font-size: 14px;
}

/* "Este artigo foi útil?" */
.ir-feedback {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin-top: 36px;
  padding-top: 24px;
  border-top: 1px solid var(--ir-line);
}

.ir-feedback__title {
  font-size: 18px;
  font-weight: 700;
}

.ir-feedback__count {
  margin-top: 2px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-feedback__btns {
  display: flex;
  gap: 10px;
}

.ir-page .ir-vote {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  min-height: 44px;
  padding: 0 20px;
  border: 1.5px solid var(--ir-line);
  border-radius: 999px;
  background: var(--ir-surface);
  color: var(--ir-ink);
  font: 600 15px var(--ir-font-body);
  cursor: pointer;
  transition: background-color var(--ir-ease), border-color var(--ir-ease), color var(--ir-ease);
}

.ir-page .ir-vote:hover {
  border-color: var(--ir-red-200);
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-page .ir-vote--selected,
.ir-page .ir-vote[aria-pressed="true"] {
  border-color: var(--ir-red);
  background: var(--ir-red);
  color: #fff;
}

/* lateral: rolagem própria quando ficar mais alta que a tela */
.ir-art-aside {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 16px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 4px 8px;
  margin: -2px -4px 0;
  scrollbar-width: thin;
}

/* coluna principal: artigo + cartão do WhatsApp logo abaixo */
.ir-art-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  min-width: 0;
}

.ir-help-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  padding: 24px 28px;
  border-radius: var(--ir-radius);
  background: var(--ir-ink);
  color: #fff;
  box-shadow: var(--ir-shadow-sm);
}

.ir-help-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(80% 120% at 100% 0%, rgba(227, 0, 5, .45), rgba(227, 0, 5, 0) 70%);
  pointer-events: none;
}

.ir-help-card > * {
  position: relative;
}

.ir-help-card__title {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.ir-help-card__text {
  margin: 4px 0 0;
  font-size: 15px;
  line-height: 1.5;
  color: #D6D6DE;
}

.ir-help-card .ir-btn {
  flex: none;
}

.ir-btn__icon {
  width: 18px;
  height: 18px;
  margin-right: 8px;
  vertical-align: -3px;
}

.ir-box {
  padding: 16px 12px;
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-box[hidden] {
  display: none;
}

.ir-page .ir-box__title {
  margin: 0 8px 8px;
  font: 600 12px var(--ir-font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ir-ink-2);
}

.ir-box ul a,
.ir-box ul a:visited {
  display: block;
  padding: 7px 10px;
  border-radius: 8px;
  color: var(--ir-ink);
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
}

.ir-box ul a:hover {
  background: var(--ir-bg);
  color: var(--ir-ink);
}

.ir-box ul a[aria-current="true"],
.ir-box ul a[aria-current="page"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-box .ir-toc-l2 a {
  padding-left: 22px;
  font-size: 13.5px;
}

.ir-box__more,
.ir-box__more:visited {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  margin: 4px 10px 0;
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* relacionados e vistos recentemente (marcação gerada pelo Zendesk) */
.ir-after {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: 0 24px;
}

/* o Zendesk não gera nada quando não há itens; :empty falha com espaços em branco */
.ir-zd-list:not(:has(*)) {
  display: none;
}

.ir-zd-list :is(.related-articles, .recent-articles) {
  margin: 0;
  padding: 56px 0 0;
  border: 0;
}

.ir-zd-list :is(.related-articles-title, .recent-articles-title) {
  margin: 0 0 20px;
  padding: 0;
  font: 700 24px/1.25 var(--ir-font-heading);
  color: var(--ir-ink);
  text-transform: none;
}

.ir-zd-list :is(.related-articles, .recent-articles) ul {
  padding: 4px 20px;
  background: var(--ir-surface);
  border-radius: var(--ir-radius);
  box-shadow: var(--ir-shadow-sm);
}

.ir-zd-list :is(.related-articles, .recent-articles) li {
  margin: 0;
  padding: 0;
  border: 0;
}

.ir-zd-list :is(.related-articles, .recent-articles) li + li {
  border-top: 1px solid var(--ir-line);
}

.ir-zd-list :is(.related-articles, .recent-articles) a,
.ir-zd-list :is(.related-articles, .recent-articles) a:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 12px 0;
  color: var(--ir-ink);
  font-weight: 500;
  text-decoration: none;
}

.ir-zd-list :is(.related-articles, .recent-articles) a::after {
  content: "→";
  flex: none;
  color: var(--ir-red-text);
}

.ir-zd-list :is(.related-articles, .recent-articles) a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* visualizador de imagem */
.ir-lightbox {
  max-width: 96vw;
  max-height: 94vh;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
}

.ir-lightbox::backdrop {
  background: rgba(10, 10, 14, .85);
}

.ir-lightbox img {
  display: block;
  max-width: 96vw;
  max-height: 86vh;
  border-radius: 10px;
  background: #fff;
}

.ir-lightbox__close {
  position: fixed;
  top: 16px;
  right: 16px;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: var(--ir-ink);
  font: 600 14px var(--ir-font-body);
  cursor: pointer;
}

.ir-lightbox__close:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

@media (max-width: 1024px) {
  .ir-art-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-art-aside {
    position: static;
    max-height: none;
    overflow: visible;
    padding: 0;
    margin: 0;
  }
}

@media (max-width: 640px) {
  .ir-article {
    font-size: 16px;
  }

  .ir-help-card {
    padding: 20px;
  }

  .ir-help-card .ir-btn {
    width: 100%;
  }

  .ir-feedback__btns {
    width: 100%;
  }

  .ir-page .ir-vote {
    flex: 1;
  }
}

/* ---------------------------------------------------------- página de busca */
.ir-page .ir-results {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-result {
  padding: 22px 26px;
}

.ir-result + .ir-result {
  border-top: 1px solid var(--ir-line);
}

.ir-result__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
}

.ir-result__title a,
.ir-result__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-result__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* o título inteiro do resultado é a área de clique */
.ir-result {
  position: relative;
}

.ir-result__title a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.ir-result:hover {
  background: #FFFAFA;
}

.ir-result:first-child {
  border-radius: var(--ir-radius) var(--ir-radius) 0 0;
}

.ir-result:last-child {
  border-radius: 0 0 var(--ir-radius) var(--ir-radius);
}

.ir-result__path {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 6px;
  margin-top: 4px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ir-ink-2);
}

.ir-result__path span + span::before {
  content: "›";
  margin-right: 6px;
}

.ir-result__text {
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ir-ink);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* trecho encontrado, destacado pelo Zendesk com <em> */
.ir-result__text em {
  font-style: normal;
  font-weight: 600;
  background: var(--ir-red-50);
  border-radius: 3px;
  padding: 0 2px;
}

.ir-result__meta {
  margin-top: 8px;
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* busca sem resultado */
.ir-noresults {
  padding: 26px 28px 28px;
}

.ir-page .ir-noresults__tips {
  margin: 12px 0 0;
  padding-left: 1.3em;
  list-style: disc;
  color: var(--ir-ink-2);
}

.ir-noresults__tips li {
  margin: 4px 0;
}

.ir-noresults__label {
  margin-top: 20px;
  font-weight: 600;
}

.ir-page .ir-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.ir-chips a,
.ir-chips a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 6px 16px;
  border: 1px solid var(--ir-red-200);
  border-radius: 999px;
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.ir-chips a:hover {
  background: var(--ir-red-100);
  color: var(--ir-red-text);
}

.ir-toc-mobile a[aria-current="true"],
.ir-toc-mobile a[aria-current="page"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

@media (max-width: 640px) {
  .ir-result {
    padding: 18px;
  }

  .ir-noresults {
    padding: 20px;
  }
}

/* ---------------------------------------------------- busca instantânea */
.ir-has-ac {
  position: relative;
  z-index: 40;
}

.ir-page .ir-ac {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  max-height: min(70vh, 520px);
  overflow-y: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--ir-surface);
  border: 1px solid var(--ir-line);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(20, 20, 30, .22);
  color: var(--ir-ink);
  text-align: left;
}

.ir-page .ir-ac[hidden] {
  display: none;
}

.ir-ac__opt {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
}

.ir-ac__opt + .ir-ac__opt {
  margin-top: 2px;
}

.ir-ac__opt[aria-selected="true"] {
  background: var(--ir-red-50);
  box-shadow: inset 3px 0 0 var(--ir-red);
}

.ir-ac__title {
  font: 600 15px/1.4 var(--ir-font-body);
  color: var(--ir-ink);
}

.ir-ac__opt[aria-selected="true"] .ir-ac__title {
  color: var(--ir-red-text);
}

.ir-ac__snippet {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ir-ink-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ir-ac__snippet:empty {
  display: none;
}

.ir-ac__snippet em {
  font-style: normal;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-ac__all {
  flex-direction: row;
  align-items: center;
  min-height: 44px;
  margin-top: 4px;
  border-top: 1px solid var(--ir-line);
  border-radius: 0 0 10px 10px;
}

.ir-ac__all-text {
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-ac__all-text::after {
  content: " →";
  text-decoration: none;
}

.ir-ac__empty {
  padding: 12px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

@media (max-width: 640px) {
  .ir-page .ir-ac {
    max-height: 60vh;
  }
}

/* ---------------------------------------------- formulário de solicitação
   Os campos são gerados pelo Zendesk (React + Garden). Os seletores usam os
   atributos data-garden-id, que são estáveis entre versões. A borda dos
   campos precisa de 3:1 de contraste (WCAG 1.4.11): #85858F dá 3,65:1. */
.ir-request-form {
  --ir-field-border: #85858F;
  /* o CKEditor (campo Descrição) usa variáveis próprias para as bordas */
  --ck-color-base-border: #85858F;
  --ck-color-toolbar-border: #85858F;
  --ck-color-focus-border: #16161D;
}

.ir-request-form [data-garden-id] {
  font-family: var(--ir-font-body);
}

.ir-request-form [data-garden-id="forms.input_label"],
.ir-request-form [data-garden-id="dropdowns.combobox.label"] {
  font-size: 15px;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-request-form [data-garden-id="forms.input_hint"],
.ir-request-form [data-garden-id="dropdowns.combobox.hint"] {
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-request-form [data-garden-id="forms.input"],
.ir-request-form [data-garden-id="forms.textarea"],
.ir-request-form [data-garden-id="dropdowns.combobox.trigger"] {
  min-height: 44px;
  border-color: var(--ir-field-border);
  border-radius: 10px;
  font-size: 16px;
  color: var(--ir-ink);
}

.ir-request-form [data-garden-id="forms.input"]:hover,
.ir-request-form [data-garden-id="forms.textarea"]:hover,
.ir-request-form [data-garden-id="dropdowns.combobox.trigger"]:hover {
  border-color: var(--ir-ink-2);
}

/* editor de texto do campo Descrição (CKEditor) */
.ir-request-form .ck.ck-editor__top .ck-toolbar {
  border-color: var(--ir-field-border) !important;
  border-radius: 10px 10px 0 0 !important;
  background: #FAFAFB;
}

.ir-request-form .ck.ck-editor__main > .ck-editor__editable {
  min-height: 160px;
  border-color: var(--ir-field-border);
  border-radius: 0 0 10px 10px !important;
  font-family: var(--ir-font-body);
  font-size: 16px;
  line-height: 1.6;
}

/* área de anexos */
.ir-request-form [data-garden-id="forms.file_upload"] {
  min-height: 72px;
  border: 1.5px dashed var(--ir-field-border);
  border-radius: 12px;
  background: #FAFAFB;
  color: var(--ir-ink);
  font-size: 15px;
}

.ir-request-form [data-garden-id="forms.file_upload"]:hover {
  border-color: var(--ir-red);
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

/* botão Enviar */
.ir-request-form [data-garden-id="buttons.button"] {
  min-height: 48px;
  margin-top: 28px;
  padding: 0 32px;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 600;
}

/* lateral */
.ir-tip {
  padding: 20px;
}

.ir-tip__title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
}

.ir-tip__text {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ir-ink-2);
}

.ir-mini-search.ir-tip__search {
  max-width: none;
  margin-top: 12px;
  border: 1px solid var(--ir-field-border, #85858F);
}

.ir-tip__search:focus-within {
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ir-ink);
}

.ir-request-aside {
  --ir-field-border: #85858F;
  overflow: visible;
}

.ir-help-card--stack {
  flex-direction: column;
  align-items: stretch;
}

.ir-help-card--stack .ir-btn {
  width: 100%;
}

/* -------------------------------------------------------------- contato */
.ir-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 56px;
  padding: 32px clamp(20px, 4vw, 40px);
  border-radius: var(--ir-radius-lg);
  background: var(--ir-ink);
  color: #fff;
  position: relative;
  overflow: hidden;
}

.ir-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(60% 140% at 100% 0%, rgba(227, 0, 5, .35), rgba(227, 0, 5, 0) 70%);
  pointer-events: none;
}

.ir-cta > * {
  position: relative;
}

.ir-cta__title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
}

.ir-cta__text {
  margin-top: 6px;
  color: #D6D6DE;
  max-width: 560px;
}

/* ---------------------------------------------------------------- rodapé */
.ir-footer {
  margin-top: 64px;
  font-family: var(--ir-font-body);
  font-size: 14px;
  color: var(--ir-ink-2);
  background: var(--ir-surface);
  border-top: 1px solid var(--ir-line);
}

.ir-footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px 24px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.ir-footer__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
}

.ir-footer__brand img {
  display: block;
  width: 72px;
  height: auto;
}

.ir-footer ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ir-footer a,
.ir-footer a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--ir-ink-2);
  text-decoration: none;
}

.ir-footer a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ------------------------------------------------------------ responsivo */
@media (max-width: 1024px) {
  .ir-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .ir-hero__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-hero__art {
    display: none;
  }
}

@media (max-width: 600px) {
  .ir-header__inner {
    min-height: 64px;
  }

  .ir-header__logo img {
    width: 92px;
  }

  .ir-header .ir-btn {
    min-height: 40px;
    padding: 8px 14px;
    font-size: 14px;
  }

  .ir-hero__lead {
    font-size: 16px;
  }

  .ir-search {
    flex-wrap: wrap;
    padding: 6px;
  }

  .ir-search__icon {
    margin-left: 8px;
  }

  .ir-search__btn {
    width: 100%;
  }

  .ir-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .ir-cta {
    flex-direction: column;
    align-items: flex-start;
  }

  .ir-cta .ir-btn {
    width: 100%;
  }


}

@media (max-width: 380px) {
  .ir-header .ir-btn__long {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ir-page *,
  .ir-footer * {
    transition: none !important;
  }

  .ir-mod:hover {
    transform: none;
  }
}

/* ------------------------------------------------------- página de erro
   Um template para três casos (error): not_found, unauthorized, forbidden. */
.ir-error {
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(32px, 6vw, 56px) clamp(20px, 5vw, 56px);
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  text-align: center;
}

.ir-error:focus {
  outline: 0;
}

.ir-error__code {
  font: 800 clamp(88px, 18vw, 136px)/1 var(--ir-font-heading);
  letter-spacing: -0.04em;
  color: var(--ir-red);
  background: var(--ir-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ir-error__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-error__icon svg {
  width: 32px;
  height: 32px;
}

.ir-page .ir-error__title {
  margin-top: 20px;
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
}

.ir-error__text {
  max-width: 520px;
  margin: 12px auto 0;
  font-size: 17px;
  color: var(--ir-ink-2);
}

.ir-error__actions {
  margin-top: 24px;
}

.ir-search.ir-error__search {
  margin: 32px auto 0;
  border: 1px solid #85858F;
  box-shadow: none;
}

.ir-search.ir-error__search:focus-within {
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ir-ink);
}

.ir-error__label {
  margin-top: 24px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-error__chips {
  justify-content: center;
}

.ir-error__home,
.ir-error__home:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 28px;
  padding: 0 8px;
  color: var(--ir-red-text);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-error__home:hover {
  color: var(--ir-carmine);
}

.ir-error__home svg {
  width: 18px;
  height: 18px;
}

@media (max-width: 600px) {
  .ir-search.ir-error__search .ir-search__btn {
    padding: 10px 16px;
  }
}

/* ------------------------------------------------------------ minha conta
   Botão no cabeçalho escuro. Logado: abre o menu da conta; sem login: leva
   para a página de entrar. */
.ir-header__actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ir-account {
  position: relative;
  flex: none;
}

.ir-inner-nav .ir-account {
  margin-left: auto;
}

.ir-inner-nav .ir-btn ~ .ir-account {
  margin-left: 0;
}

.ir-account__btn,
.ir-account__btn:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 14px 6px 10px;
  border: 1.5px solid rgba(255, 255, 255, .75);
  border-radius: 999px;
  background: transparent;
  color: #fff;
  font: 600 15px/1.2 var(--ir-font-body);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ir-ease);
}

.ir-account__btn:hover {
  background: rgba(255, 255, 255, .14);
  color: #fff;
  text-decoration: none;
}

.ir-account__icon,
.ir-account__chevron {
  flex: none;
  width: 20px;
  height: 20px;
}

.ir-account__chevron {
  width: 16px;
  height: 16px;
  transition: transform var(--ir-ease);
}

.ir-account__btn[aria-expanded="true"] .ir-account__chevron {
  transform: rotate(180deg);
}

.ir-account__avatar {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
}

.ir-page .ir-account__menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 60;
  width: 248px;
  padding: 6px;
  background: var(--ir-surface);
  border: 1px solid var(--ir-line);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(20, 20, 30, .22);
  color: var(--ir-ink);
  text-align: left;
}

.ir-page .ir-account__menu[hidden] {
  display: none;
}

.ir-account__name {
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--ir-line);
  margin-bottom: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ir-ink-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ir-account__menu a,
.ir-account__menu a:visited {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: 10px;
  color: var(--ir-ink);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

.ir-account__menu a:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  text-decoration: none;
}

.ir-account__menu :focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: -3px;
}

.ir-account__sep {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--ir-line);
}

/* celular: só o ícone (o texto continua para leitores de tela) */
@media (max-width: 640px) {
  .ir-account__btn {
    min-width: 44px;
    justify-content: center;
    padding: 6px;
  }

  .ir-account__label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }

  .ir-account__chevron {
    display: none;
  }

  .ir-header__actions {
    gap: 8px;
  }
}

/* ------------------------------------------------------------ perfil */
.ir-profile {
  padding: clamp(20px, 4vw, 32px);
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-profile:focus {
  outline: 0;
}

.ir-profile__main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 24px;
  align-items: start;
}

.ir-profile__avatar {
  position: relative;
  width: 96px;
  height: 96px;
}

.ir-profile__avatar img {
  display: block;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--ir-red-50);
  box-shadow: 0 0 0 4px #fff, 0 0 0 5px var(--ir-line);
}

.ir-profile__agent {
  position: absolute;
  right: 0;
  bottom: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--ir-red);
  color: #fff;
}

.ir-profile__agent svg {
  width: 14px;
  height: 14px;
}

.ir-page .ir-profile__name {
  font-size: clamp(24px, 3.4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.ir-profile__name a,
.ir-profile__name a:visited {
  color: inherit;
  text-decoration: none;
}

.ir-profile__name a:hover {
  text-decoration: underline;
}

.ir-page .ir-profile__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.ir-page .ir-profile__tags:not(:has(li)) {
  display: none;
}

.ir-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  background: #EDEDF0;
  color: var(--ir-ink);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
}

.ir-chip svg {
  width: 14px;
  height: 14px;
}

.ir-chip--brand {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-chip--pending {
  background: #FFF4D6;
  color: #6B4A00;
}

.ir-chip--answered,
.ir-chip--completed {
  background: #E3F4EA;
  color: #1C5E36;
}

.ir-profile__meta {
  margin-top: 10px;
  font-size: 15px;
  color: var(--ir-ink-2);
}

.ir-profile__desc {
  max-width: 640px;
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.6;
}

.ir-page .ir-profile__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
}

.ir-page .ir-profile__badges:not(:has(li)) {
  display: none;
}

.ir-profile__badges img {
  display: block;
  width: 36px;
  height: 36px;
  padding: 6px;
  border-radius: 10px;
  background: var(--ir-red-50);
}

.ir-profile__badges-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  border-radius: 10px;
  background: #EDEDF0;
  font-size: 13px;
  font-weight: 700;
}

/* ações do Zendesk (editar perfil, seguir): botão contornado */
.ir-profile__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.ir-profile__actions button,
.ir-profile__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 20px;
  border: 1.5px solid var(--ir-red-text);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-red-text);
  font: 600 15px/1.2 var(--ir-font-body);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.ir-profile__actions button:hover,
.ir-profile__actions a:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-profile__actions button[aria-pressed="true"] {
  background: var(--ir-red);
  border-color: var(--ir-red);
  color: #fff;
}

.ir-profile__follow > div {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

.ir-profile__follow span {
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* números */
.ir-page .ir-profile__stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0 0;
  padding-top: 24px;
  border-top: 1px solid var(--ir-line);
}

.ir-stat {
  padding: 14px 16px;
  border-radius: var(--ir-radius);
  background: var(--ir-bg);
}

.ir-stat dt {
  font-size: 13px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-stat dd {
  margin: 2px 0 0;
  font: 700 24px/1.2 var(--ir-font-heading);
  color: var(--ir-ink);
}

/* conteúdo + lateral */
.ir-profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 24px;
  align-items: start;
  margin-top: 24px;
}

.ir-profile-layout > :only-child {
  grid-column: 1 / -1;
}

.ir-profile-aside {
  position: sticky;
  top: 24px;
}

.ir-shortcuts {
  padding: 18px 12px;
}

/* abas */
.ir-tabs {
  margin-bottom: 16px;
  overflow-x: auto;
  scrollbar-width: none;
}

.ir-page .ir-tabs ul {
  display: flex;
  gap: 8px;
  width: max-content;
}

.ir-tabs a,
.ir-tabs a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 18px;
  border: 1px solid var(--ir-line);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-ink);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.ir-tabs a:hover {
  border-color: var(--ir-red-200);
  color: var(--ir-red-text);
}

.ir-tabs a[aria-current="page"] {
  border-color: var(--ir-ink);
  background: var(--ir-ink);
  color: #fff;
}

.ir-profile-section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ir-page .ir-profile-section__title {
  margin-bottom: 12px;
  font-size: 20px;
  font-weight: 700;
}

.ir-profile-section__head .ir-profile-section__title {
  margin-bottom: 0;
}

.ir-sorters {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

.ir-sorters__label {
  color: var(--ir-ink-2);
}

.ir-page .ir-sorters ul {
  display: flex;
  gap: 4px;
}

.ir-sorters a,
.ir-sorters a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 4px 12px;
  border-radius: 999px;
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-sorters a:hover,
.ir-sorters a[aria-current="true"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-sorters a[aria-current="true"] {
  font-weight: 600;
}

.ir-profile-section__head + .ir-activity-list,
.ir-profile-section__head + .ir-empty {
  margin-top: 12px;
}

/* lista de atividades */
.ir-page .ir-activity-list {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-activity__label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-activity__dot {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ir-red);
}

.ir-activity__card {
  padding: 18px 20px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-page .ir-activity__title {
  font: 600 17px/1.4 var(--ir-font-body);
}

.ir-activity__title a,
.ir-activity__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-activity__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-page .ir-activity__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.ir-page .ir-activity__chips:not(:has(li)) {
  display: none;
}

.ir-activity__path {
  margin-top: 6px;
  font-size: 13px;
  color: var(--ir-ink-2);
}

.ir-activity__path a,
.ir-activity__path a:visited {
  color: var(--ir-ink-2);
}

.ir-activity__path a:hover {
  color: var(--ir-red-text);
}

.ir-activity__body {
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.6;
}

.ir-activity__meta {
  margin-top: 10px;
  font-size: 13px;
  color: var(--ir-ink-2);
}

.ir-activity__meta a,
.ir-activity__meta a:visited {
  color: var(--ir-red-text);
  font-weight: 600;
}

/* conquistas */
.ir-page .ir-badge-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}

.ir-badge-card {
  display: flex;
  gap: 14px;
  padding: 16px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-badge-card img {
  flex: none;
  width: 48px;
  height: 48px;
  padding: 8px;
  border-radius: 12px;
  background: var(--ir-red-50);
}

.ir-badge-card__name {
  font-weight: 700;
}

.ir-badge-card__desc {
  margin-top: 2px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-badge-card__date {
  margin-top: 6px;
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* estado vazio */
.ir-empty {
  padding: 36px 24px;
  border: 1.5px dashed #C9C9D1;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  text-align: center;
}

.ir-empty__icon {
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
  color: var(--ir-ink-2);
}

.ir-empty__title {
  font-size: 17px;
  font-weight: 700;
}

.ir-empty__text {
  margin-top: 4px;
  color: var(--ir-ink-2);
}

.ir-empty__link,
.ir-empty__link:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 8px;
  color: var(--ir-red-text);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 900px) {
  .ir-profile__main {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .ir-profile__actions {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }

  .ir-profile__follow > div {
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .ir-page .ir-profile__stats {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  .ir-profile-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-profile-aside {
    position: static;
  }
}

@media (max-width: 600px) {
  .ir-profile__main {
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
    gap: 16px;
  }

  .ir-profile__avatar,
  .ir-profile__avatar img {
    width: 80px;
    height: 80px;
  }

  .ir-page .ir-profile__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ir-activity__card {
    padding: 16px;
  }
}

/* ------------------------------------------------------- minhas solicitações
   Os campos do filtro são gerados pelo Zendesk ({{input}}, {{select}});
   o script.js envia o formulário ao trocar o status (ids mantidos). */
.ir-req-panel {
  padding: 18px 20px 20px;
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-req-panel .ir-tabs {
  margin: 0 -20px 18px;
  padding: 0 20px 16px;
  border-bottom: 1px solid var(--ir-line);
}

.ir-req-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px 20px;
}

.ir-req-toolbar__search {
  flex: 1 1 320px;
}

.ir-req-toolbar__label,
.ir-req-toolbar__field label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-req-toolbar__row {
  display: flex;
  gap: 8px;
}

.ir-req-toolbar__input {
  position: relative;
  flex: 1;
  min-width: 0;
}

.ir-req-toolbar__input .ir-search__icon {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  pointer-events: none;
}

.ir-page .ir-req-toolbar__input input {
  width: 100%;
  min-height: 44px;
  padding: 0 12px 0 40px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff;
  font: 400 16px var(--ir-font-body);
  color: var(--ir-ink);
}

.ir-req-toolbar__btn {
  border-radius: 10px;
}

.ir-req-toolbar__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px;
}

.ir-page .ir-req-toolbar__field select {
  min-width: 200px;
  min-height: 44px;
  padding: 0 40px 0 12px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316161D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 18px;
  font: 400 16px var(--ir-font-body);
  color: var(--ir-ink);
  -webkit-appearance: none;
  appearance: none;
}

.ir-page .ir-req-toolbar :is(input, select):focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 2px;
}

.ir-req-toolbar__follow button {
  min-height: 44px;
  padding: 8px 18px;
  border: 1.5px solid var(--ir-red-text);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-red-text);
  font: 600 15px var(--ir-font-body);
  cursor: pointer;
}

.ir-req-toolbar__follow span {
  display: none;
}

.ir-req-info {
  margin-top: 16px;
  font-weight: 600;
}

/* lista */
.ir-page .ir-req-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.ir-req {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  transition: box-shadow var(--ir-ease);
}

.ir-req:hover {
  box-shadow: var(--ir-shadow-red);
}

.ir-req__main {
  min-width: 0;
}

.ir-page .ir-req__title {
  font: 600 17px/1.4 var(--ir-font-body);
}

.ir-req__title a,
.ir-req__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-req__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-req__meta {
  margin-top: 4px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-req--closed .ir-req__title a {
  color: var(--ir-ink-2);
}

/* status: cor + texto (a cor nunca é a única informação) */
.ir-status {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  background: #EDEDF0;
  color: var(--ir-ink);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.ir-status::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.ir-status--new,
.ir-status--open {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-status--pending {
  background: #FFF4D6;
  color: #6B4A00;
}

.ir-status--solved {
  background: #E3F4EA;
  color: #1C5E36;
}

.ir-status--closed {
  color: var(--ir-ink-2);
}

.ir-requests .ir-empty {
  margin-top: 16px;
}

.ir-empty__btn {
  margin-top: 16px;
}

.ir-req-help {
  margin-top: 40px;
}

@media (max-width: 640px) {
  .ir-req-panel {
    padding: 16px;
  }

  .ir-req-panel .ir-tabs {
    margin: 0 -16px 16px;
    padding: 0 16px 14px;
  }

  .ir-req-toolbar__filters,
  .ir-req-toolbar__field {
    width: 100%;
  }

  .ir-page .ir-req-toolbar__field select {
    width: 100%;
  }

  .ir-req {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 16px;
  }
}

/* ---------------------------------------------------- detalhe da solicitação
   As classes request-container, request-main e comment-* ficam no HTML
   porque o script (adaptador Zendesk) abre o formulário de resposta por elas. */
.ir-reqd-meta {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.ir-page .request-container.ir-reqd {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 24px;
  align-items: start;
}

.ir-page .ir-reqd .request-main {
  flex: none;
  order: 0;
  min-width: 0;
}

/* conversa */
.ir-page .ir-comments {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-comment {
  padding: 20px 24px;
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-comment--agent {
  box-shadow: inset 4px 0 0 var(--ir-red), var(--ir-shadow-sm);
}

.ir-comment__head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ir-comment__avatar {
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--ir-red-50);
}

.ir-comment__name {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.ir-comment__name a,
.ir-comment__name a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-comment__name a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-comment__time {
  font-size: 13px;
  color: var(--ir-ink-2);
}

.ir-comment__body {
  margin-top: 14px;
  font-size: 16px;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.ir-comment__body > * + * {
  margin-top: 12px;
}

.ir-comment__body a,
.ir-comment__body a:visited {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-comment__body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.ir-comment__body pre,
.ir-comment__body table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
}

/* anexos */
.ir-page .ir-attach {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.ir-page .ir-attach--stack {
  flex-direction: column;
}

.ir-attach__file,
.ir-attach__file:visited {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  min-height: 40px;
  padding: 6px 14px;
  border: 1px solid var(--ir-line);
  border-radius: 10px;
  background: var(--ir-bg);
  color: var(--ir-ink);
  font-size: 14px;
  text-decoration: none;
}

.ir-attach__file:hover {
  border-color: var(--ir-red-200);
  color: var(--ir-red-text);
}

.ir-attach__file svg {
  flex: none;
  width: 16px;
  height: 16px;
}

.ir-attach__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}

.ir-attach__size {
  flex: none;
  color: var(--ir-ink-2);
  font-size: 13px;
}

.ir-reqd__followup:empty {
  display: none;
}

/* responder */
.ir-reply {
  margin-top: 24px;
  padding: 20px 24px 24px;
  border-radius: var(--ir-radius-lg);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
}

.ir-page .ir-reply__title {
  margin-bottom: 12px;
  font-size: 18px;
  font-weight: 700;
}

.ir-page .ir-reply .comment-show-container.ir-reply__open {
  width: 100%;
  min-height: 56px;
  padding: 12px 16px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff;
  color: #6E6E7A;
  font: 400 16px var(--ir-font-body);
  text-align: left;
  cursor: text;
}

.ir-page .ir-reply .comment-show-container.ir-reply__open:hover {
  border-color: var(--ir-ink-2);
}

.ir-page .ir-reply .comment-show-container.hidden {
  display: none;
}

.ir-page .ir-reply textarea,
.ir-page .ir-reply .comment-ccs input[type="text"] {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #85858F;
  border-radius: 10px;
  font: 400 16px/1.5 var(--ir-font-body);
  color: var(--ir-ink);
}

.ir-page .ir-reply textarea {
  min-height: 160px;
  resize: vertical;
}

.ir-page .ir-reply .comment-ccs {
  margin-bottom: 10px;
}

.ir-page .ir-reply .comment-attachments {
  margin-top: 12px;
}

.ir-page .ir-reply .upload-dropzone {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  padding: 12px;
  border: 1.5px dashed #85858F;
  border-radius: 12px;
  background: #FAFAFB;
  color: var(--ir-ink);
  font-size: 15px;
  text-align: center;
}

.ir-page .ir-reply .upload-dropzone:hover,
.ir-page .ir-reply .upload-dropzone:focus-within {
  border-color: var(--ir-red);
  background: var(--ir-red-50);
}

.ir-page .ir-reply .upload-dropzone input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.ir-page .ir-reply .ir-reply__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 16px;
  text-align: right;
}

.ir-page .ir-reply .ir-reply__controls input[type="submit"] {
  margin: 0;
}

.ir-reply__send {
  min-width: 140px;
  border: 0;
}

.ir-reply__solve,
.ir-reply__solve:visited {
  border-color: var(--ir-line);
  background: #fff;
  color: var(--ir-ink);
}

.ir-reply__solve:hover {
  border-color: #1C5E36;
  background: #E3F4EA;
  color: #1C5E36;
}

/* lateral */
.ir-reqd__aside {
  display: grid;
  gap: 16px;
  position: sticky;
  top: 24px;
}

.ir-details {
  padding: 18px 20px;
}

.ir-page .ir-details .ir-box__title {
  margin: 0 0 12px;
}

.ir-page .ir-details__list {
  display: grid;
  gap: 0;
  margin: 0;
}

.ir-details__list > div {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 8px;
  padding: 10px 0;
  border-top: 1px solid var(--ir-line);
}

.ir-details__list > div:first-child {
  border-top: 0;
  padding-top: 0;
}

.ir-details__list dt {
  font-size: 13px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-details__list dd {
  margin: 0;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.ir-details__list a,
.ir-details__list a:visited,
.ir-details__rating a,
.ir-details__rating a:visited {
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-page .ir-details__ccs {
  display: grid;
  gap: 2px;
}

.ir-details__org,
.ir-details__rating,
.ir-details__files {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--ir-line);
}

.ir-details__org:not(:has(select)) {
  display: none;
}

.ir-details__label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-details__org select {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff;
  font: 400 15px var(--ir-font-body);
}

.ir-details .ir-attach__file {
  width: 100%;
}

@media (max-width: 1024px) {
  .ir-page .request-container.ir-reqd {
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-reqd__aside {
    position: static;
  }
}

@media (max-width: 600px) {
  .ir-comment,
  .ir-reply {
    padding: 16px;
  }

  .ir-page .ir-reply .ir-reply__controls {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .ir-reply__send,
  .ir-reply__solve {
    width: 100%;
  }
}

.ir-page .ir-reply {
  display: block;
}

.ir-reqd .ir-pager:not(:has(li)) {
  display: none;
}

.ir-details__list .ir-status {
  white-space: normal;
}

.ir-page .ir-reply input.ir-reply__send {
  min-width: 140px;
  border-radius: 999px;
  padding: 10px 28px;
  font: 600 16px/1.2 var(--ir-font-body);
}

/* lista de solicitações do Zendesk ("Nova experiência", {{request_list}}):
   componente React + Garden. As cores vêm das configurações do tema
   (link_color etc.); aqui só fonte, campos, botões e rolagem no celular. */
.ir-requests-beta {
  padding: clamp(16px, 3vw, 28px);
}

.ir-requests-beta,
.ir-requests-beta [data-garden-id] {
  font-family: var(--ir-font-body);
}

.ir-requests-beta :is([data-garden-id="forms.input"], [data-garden-id="forms.faux_input"], [data-garden-id="forms.select"], [data-garden-id="dropdowns.combobox.trigger"], [data-garden-id="dropdowns.select"]) {
  min-height: 44px;
  border-color: #85858F;
  border-radius: 10px;
}

.ir-requests-beta [data-garden-id="buttons.button"] {
  min-height: 40px;
  border-radius: 999px;
  font-weight: 600;
}

.ir-requests-beta a:not([data-garden-id="buttons.button"]) {
  color: var(--ir-red-text);
}

/* paginação quebra linha no celular ("Último »" não sai da tela) */
.ir-pager .pagination > ul {
  flex-wrap: wrap;
  justify-content: center;
}

/* "Todos os módulos" é um formulário (o navegador codifica a busca na URL);
   o botão imita os links de filtro ao lado */
.ir-filter-all {
  margin: 0;
}

.ir-filter-all button {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 40px;
  padding: 6px 10px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: var(--ir-ink);
  font: 400 14px/1.35 var(--ir-font-body);
  text-align: left;
  cursor: pointer;
}

.ir-toc-mobile .ir-filter-all button {
  min-height: 44px;
  padding: 6px 8px;
  font-size: 15px;
}

.ir-filter-all button:hover {
  background: var(--ir-bg);
}

.ir-filter-all button[aria-current="true"] {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-weight: 600;
}

/* Botões que são links: a cor do texto não pode depender do estado do link.
   Sem isto, a cor de link visitado (a:visited) deixaria o texto do botão
   do WhatsApp vermelho sobre o fundo vermelho. */
.ir-page a.ir-btn--primary,
.ir-page a.ir-btn--primary:link,
.ir-page a.ir-btn--primary:visited,
.ir-page a.ir-btn--primary:hover,
.ir-page a.ir-btn--primary:focus,
.ir-page a.ir-btn--primary:active {
  color: #fff;
  text-decoration: none;
}

.ir-page a.ir-btn--light,
.ir-page a.ir-btn--light:link,
.ir-page a.ir-btn--light:visited,
.ir-page a.ir-btn--light:hover,
.ir-page a.ir-btn--light:focus,
.ir-page a.ir-btn--light:active {
  color: var(--ir-red-text);
  text-decoration: none;
}

.ir-page a.ir-btn :is(span, svg) {
  color: inherit;
}

/* ---------------------------------------------------------------- assinaturas
   O botão de seguir/deixar de seguir vem do Zendesk ({{subscribe}}); aqui só
   o visual. */
.ir-subs__panel {
  padding: 14px 20px;
}

.ir-subs__panel .ir-tabs {
  margin: 0;
  padding: 0;
  border-bottom: 0;
}

.ir-page .ir-subs__list {
  display: grid;
  gap: 10px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.ir-sub {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  transition: box-shadow var(--ir-ease);
}

.ir-sub:hover {
  box-shadow: var(--ir-shadow-red);
}

.ir-sub__icon,
.ir-sub__avatar {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 12px;
}

.ir-sub__icon {
  display: grid;
  place-items: center;
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-sub__icon svg {
  width: 22px;
  height: 22px;
}

.ir-sub__avatar {
  border-radius: 50%;
  object-fit: cover;
  background: var(--ir-red-50);
}

.ir-sub__main {
  flex: 1;
  min-width: 0;
}

.ir-page .ir-sub__title {
  margin: 0;
  font: 600 17px/1.4 var(--ir-font-body);
  overflow-wrap: anywhere;
}

.ir-sub__title a,
.ir-sub__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-sub__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-page .ir-sub__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-top: 6px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-sub__action {
  flex: none;
}

.ir-sub__action > div {
  position: relative;
}

.ir-page .ir-sub__action button {
  min-height: 44px;
  padding: 8px 18px;
  border: 1.5px solid var(--ir-red-text);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-red-text);
  font: 600 15px var(--ir-font-body);
  white-space: nowrap;
  cursor: pointer;
}

.ir-page .ir-sub__action button:hover {
  background: var(--ir-red-50);
}

.ir-page .ir-sub__action button:focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 2px;
}

/* texto auxiliar do Zendesk ("seguido por N pessoas"): só para leitores de tela */
.ir-sub__action span[id*="description"] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.ir-subs .ir-empty {
  margin-top: 16px;
}

@media (max-width: 640px) {
  .ir-sub {
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 16px;
  }

  .ir-sub__main {
    flex-basis: calc(100% - 60px);
  }

  .ir-sub__action {
    width: 100%;
    padding-left: 60px;
  }
}

/* ---------------------------------------------------------- minhas atividades
   Usa os cartões de assinaturas (.ir-sub); aqui só o que é próprio da tela. */
.ir-contribs__icon-post,
.ir-contribs--posts .ir-contribs__icon-comment {
  display: none;
}

.ir-contribs--posts .ir-contribs__icon-post {
  display: block;
}

.ir-contribs__votes {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-contribs__votes svg {
  width: 16px;
  height: 16px;
  color: var(--ir-ink-2);
}

.ir-page .ir-contribs__dates {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 16px;
  margin-top: 6px;
  font-size: 13px;
  color: var(--ir-ink-2);
}

/* ---------------------------------------------------------------- comunidade
   Votos, seguir, compartilhar, menus de moderação e os campos do formulário
   são gerados pelo Zendesk ({{vote}}, {{subscribe}}, {{share}}, {{actions}},
   {{input}}, {{select}}, {{wysiwyg}}...). Aqui só o visual. */

/* botão contornado (fundo claro) */
.ir-btn--outline,
.ir-page a.ir-btn--outline,
.ir-page a.ir-btn--outline:visited {
  border: 1.5px solid var(--ir-red-text);
  background: #fff;
  color: var(--ir-red-text);
  text-decoration: none;
}

.ir-btn--outline:hover,
.ir-page a.ir-btn--outline:hover {
  background: var(--ir-red-50);
  color: var(--ir-red-text);
}

.ir-count {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  margin-left: 6px;
  padding: 0 8px;
  border-radius: 999px;
  background: #EDEDF0;
  color: var(--ir-ink);
  font: 700 14px var(--ir-font-body);
  vertical-align: middle;
}

/* status das publicações */
.ir-chip--planned {
  background: #E4EEFB;
  color: #1B4A8A;
}

.ir-chip--not-planned {
  background: #EDEDF0;
  color: var(--ir-ink-2);
}

/* topo com ações */
.ir-comm-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px 24px;
  max-width: none;
}

.ir-comm-head > div:first-child {
  flex: 1 1 420px;
  max-width: 760px;
}

.ir-comm-head .ir-art-head__title .ir-chip {
  vertical-align: middle;
  margin-left: 8px;
}

.ir-comm-head__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

/* breadcrumbs do Zendesk ({{breadcrumbs}}) no visual do tema */
.ir-page .ir-crumbs--zd .breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  color: #fff;
}

.ir-page .ir-crumbs--zd .breadcrumbs li {
  max-width: none;
  color: #fff;
  font-size: 14px;
}

.ir-page .ir-crumbs--zd .breadcrumbs li + li::before {
  content: "›";
  margin: 0 6px 0 0;
  opacity: .85;
}

.ir-page .ir-crumbs--zd .breadcrumbs li a,
.ir-page .ir-crumbs--zd .breadcrumbs li a:visited {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* seguir (padrão claro; no topo escuro, botão branco) */
.ir-follow > div {
  position: relative;
}

.ir-page .ir-follow button {
  min-height: 44px;
  padding: 8px 18px;
  border: 1.5px solid var(--ir-red-text);
  border-radius: 999px;
  background: #fff;
  color: var(--ir-red-text);
  font: 600 15px var(--ir-font-body);
  white-space: nowrap;
  cursor: pointer;
}

.ir-page .ir-follow button:hover {
  background: var(--ir-red-50);
}

.ir-page .ir-on-dark .ir-follow button {
  border-color: #fff;
  background: transparent;
  color: #fff;
}

.ir-page .ir-on-dark .ir-follow button:hover {
  background: rgba(255, 255, 255, .14);
}

.ir-page .ir-follow button:focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 2px;
}

.ir-page .ir-on-dark .ir-follow button:focus-visible {
  outline-color: #fff;
}

.ir-follow span[id*="description"] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* painel de filtros */
.ir-comm-filters {
  display: grid;
  gap: 12px;
  padding: 16px 20px;
}

.ir-comm-filters .ir-tabs {
  margin: 0 -20px;
  padding: 0 20px 14px;
  border-bottom: 1px solid var(--ir-line);
}

.ir-page .ir-comm-filters .ir-sorters {
  margin: 0;
}

/* tópicos */
.ir-page .ir-topics {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.ir-topic,
.ir-topic:visited {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  padding: 22px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  color: var(--ir-ink);
  text-decoration: none;
  transition: box-shadow var(--ir-ease), transform var(--ir-ease);
}

.ir-topic:hover {
  box-shadow: var(--ir-shadow-red);
  transform: translateY(-2px);
  color: var(--ir-ink);
}

.ir-topic .ir-sub__icon {
  margin-bottom: 4px;
}

.ir-topic__name {
  font: 700 18px/1.35 var(--ir-font-heading);
}

.ir-topic:hover .ir-topic__name {
  color: var(--ir-red-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ir-topic__name .ir-chip {
  margin-left: 6px;
  vertical-align: middle;
}

.ir-topic__desc {
  color: var(--ir-ink-2);
  font-size: 15px;
  line-height: 1.55;
}

.ir-topic__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-top: auto;
  padding-top: 8px;
  color: var(--ir-ink-2);
  font-size: 13px;
  font-weight: 600;
}

.ir-topic__meta span + span::before {
  content: "·";
  margin-right: 14px;
}

/* destaques */
.ir-page .ir-featured {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-featured a,
.ir-featured a:visited {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-height: 56px;
  padding: 14px 18px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  color: var(--ir-ink);
  font-weight: 600;
  text-decoration: none;
}

.ir-featured a:hover {
  box-shadow: var(--ir-shadow-red);
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-featured svg {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  color: var(--ir-red);
}

/* lista de publicações */
.ir-page .ir-posts {
  display: grid;
  gap: 10px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.ir-post {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  border-radius: var(--ir-radius);
  background: var(--ir-surface);
  box-shadow: var(--ir-shadow-sm);
  transition: box-shadow var(--ir-ease);
}

.ir-post:hover {
  box-shadow: var(--ir-shadow-red);
}

.ir-post--featured {
  box-shadow: inset 4px 0 0 var(--ir-red), var(--ir-shadow-sm);
}

.ir-post__main {
  flex: 1;
  min-width: 0;
}

.ir-page .ir-post__title {
  margin: 0;
  font: 600 17px/1.4 var(--ir-font-body);
  overflow-wrap: anywhere;
}

.ir-post__title a,
.ir-post__title a:visited {
  color: var(--ir-ink);
  text-decoration: none;
}

.ir-post__title a:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-page .ir-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-top: 6px;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-post__by {
  font-weight: 600;
  color: var(--ir-ink);
}

.ir-page .ir-post__counts {
  flex: none;
  display: flex;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--ir-ink);
  font-weight: 600;
}

.ir-post__counts li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ir-post__counts svg {
  width: 18px;
  height: 18px;
  color: var(--ir-ink-2);
}

.ir-comm-empty {
  margin-top: 16px;
}

/* publicação */
.ir-cpost-head__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.ir-cpost-head__chips:not(:has(*)) {
  display: none;
}

.ir-cpost-head .ir-art-head__title .ir-chip {
  margin-left: 8px;
  vertical-align: middle;
}

.ir-cpost {
  padding: clamp(20px, 3vw, 32px);
}

.ir-cpost__author,
.ir-comment__head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ir-cpost__avatar {
  position: relative;
  flex: none;
  width: 48px;
  height: 48px;
}

.ir-cpost__avatar > img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--ir-red-50);
}

.ir-cpost__avatar--sm,
.ir-cpost__avatar--sm > img {
  width: 40px;
  height: 40px;
}

.ir-cpost__avatar .ir-profile__agent {
  right: -2px;
  bottom: -2px;
  width: 20px;
  height: 20px;
}

.ir-cpost__avatar .ir-profile__agent svg {
  width: 12px;
  height: 12px;
}

.ir-cpost__who {
  flex: 1;
  min-width: 0;
}

.ir-page .ir-cbadges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-page .ir-cbadges:not(:has(li)) {
  display: none;
}

.ir-cbadges img {
  display: block;
  width: 28px;
  height: 28px;
}

.ir-comment .ir-cbadges img {
  width: 24px;
  height: 24px;
}

.ir-cbadges__more,
.ir-cbadges__more:visited {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  padding: 0 6px;
  border-radius: 999px;
  background: #EDEDF0;
  color: var(--ir-ink);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.ir-cpost__body {
  margin-top: 20px;
  font-size: 17px;
}

.ir-cpost__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
}

.ir-page .ir-cpost__tags-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--ir-ink-2);
}

.ir-page .ir-cpost__tags ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-cpost__tags a,
.ir-cpost__tags a:visited {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 12px;
  border: 1px solid var(--ir-line);
  border-radius: 999px;
  color: var(--ir-ink);
  font-size: 14px;
  text-decoration: none;
}

.ir-cpost__tags a:hover {
  border-color: var(--ir-red-200);
  color: var(--ir-red-text);
}

.ir-cpost__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--ir-line);
}

.ir-cpost__count,
.ir-cpost__count:visited {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  color: var(--ir-ink);
  font-weight: 600;
  text-decoration: none;
}

.ir-cpost__count:hover {
  color: var(--ir-red-text);
  text-decoration: underline;
}

.ir-cpost__count svg {
  width: 18px;
  height: 18px;
}

.ir-cpost__tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

/* votos */
.ir-cvote {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--ir-line);
  border-radius: 999px;
  background: var(--ir-bg);
}

.ir-page .ir-cvote :is(a, button) {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ir-ink-2);
  cursor: pointer;
  text-decoration: none;
}

.ir-page .ir-cvote :is(a, button):hover {
  background: #fff;
  color: var(--ir-red-text);
}

.ir-page .ir-cvote .vote-voted,
.ir-page .ir-cvote [aria-checked="true"],
.ir-page .ir-cvote [aria-pressed="true"] {
  background: var(--ir-red);
  color: #fff;
}

.ir-page .ir-cvote :is(a, button):focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 1px;
}

.ir-cvote svg {
  width: 18px;
  height: 18px;
}

.ir-cvote__sum {
  min-width: 24px;
  color: var(--ir-ink);
  font-weight: 700;
  text-align: center;
}

.ir-page .ir-cvote--sm :is(a, button) {
  width: 32px;
  height: 32px;
}

/* compartilhar ({{share}}: lista de links das redes) */
.ir-page .ir-share .share,
.ir-page .ir-share ul {
  display: flex;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ir-page .ir-share a {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--ir-line);
  border-radius: 50%;
  color: var(--ir-ink-2);
}

.ir-page .ir-share a:hover {
  border-color: var(--ir-red-200);
  color: var(--ir-red-text);
}

/* menu de moderação ({{actions}}) */
.ir-page .ir-zd-actions:not(:has(*)) {
  display: none;
}

.ir-page .ir-zd-actions button,
.ir-page .ir-zd-actions [aria-haspopup] {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--ir-line);
  border-radius: 50%;
  background: #fff;
  color: var(--ir-ink-2);
  cursor: pointer;
}

.ir-page .ir-zd-actions button:hover {
  color: var(--ir-red-text);
  border-color: var(--ir-red-200);
}

.ir-zd-actions svg {
  width: 18px;
  height: 18px;
}

/* comentários */
.ir-cpost-comments {
  margin-top: 32px;
}

.ir-cpost-comments__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.ir-page .ir-cpost-comments__title {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
}

.ir-page .ir-cpost-comments__head .ir-sorters {
  margin: 0;
}

.ir-comment--official {
  box-shadow: inset 4px 0 0 #1C5E36, var(--ir-shadow-sm);
}

.ir-comment__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.ir-comment__bar .ir-zd-actions {
  margin-left: auto;
}

.ir-comment__bar:not(:has(.ir-cvote, .ir-zd-actions *)) {
  display: none;
}

/* responder */
.ir-cpost-reply {
  margin-top: 24px;
}

.ir-page .ir-cpost-reply .comment-form {
  display: block;
}

.ir-page .ir-cpost-reply .comment-form:not(:has(*)) + .ir-cpost-reply__callout {
  margin-top: 0;
}

.ir-page .ir-cpost-reply textarea {
  width: 100%;
  min-height: 160px;
  padding: 10px 12px;
  border: 1px solid #85858F;
  border-radius: 10px;
  font: 400 16px/1.5 var(--ir-font-body);
  color: var(--ir-ink);
  resize: vertical;
}

.ir-page .ir-cpost-reply .ck.ck-editor__main > .ck-editor__editable {
  min-height: 160px;
}

.ir-page .ir-cpost-reply .ir-reply__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 16px;
}

.ir-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  font-size: 15px;
}

.ir-check:not(:has(input)) {
  display: none;
}

.ir-check input {
  width: 20px;
  height: 20px;
  accent-color: var(--ir-red);
}

.ir-cpost-reply__callout {
  color: var(--ir-ink-2);
}

.ir-cpost-reply__callout a,
.ir-cpost-reply__callout a:visited {
  color: var(--ir-red-text);
  font-weight: 600;
}

/* lateral */
.ir-cpost-aside {
  display: grid;
  gap: 16px;
}

.ir-cpost-box .ir-btn {
  width: 100%;
  margin-top: 14px;
}

.ir-page .ir-cpost-box__text {
  margin-top: 4px;
  color: var(--ir-ink-2);
  font-size: 15px;
}

.ir-cpost-box ul {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

/* formulário de nova publicação */
.ir-form-card {
  padding: clamp(20px, 3vw, 36px);
}

.ir-page .ir-form {
  display: grid;
  gap: 22px;
}

.ir-field {
  display: grid;
  gap: 8px;
}

.ir-page .ir-field label {
  font-size: 15px;
  font-weight: 700;
  color: var(--ir-ink);
}

.ir-field .optional {
  font-weight: 400;
  color: var(--ir-ink-2);
}

.ir-page .ir-field__hint {
  margin: -4px 0 0;
  font-size: 14px;
  color: var(--ir-ink-2);
}

.ir-page .ir-field :is(input[type="text"], input:not([type]), select, textarea) {
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid #85858F;
  border-radius: 10px;
  background: #fff;
  color: var(--ir-ink);
  font: 400 16px/1.5 var(--ir-font-body);
}

.ir-page .ir-field select[multiple] {
  min-height: 120px;
}

.ir-page .ir-field textarea {
  min-height: 200px;
  resize: vertical;
}

.ir-page .ir-field :is(input, select, textarea):hover {
  border-color: var(--ir-ink-2);
}

.ir-page .ir-field :is(input, select, textarea):focus-visible {
  outline: 3px solid var(--ir-ink);
  outline-offset: 2px;
}

.ir-page .ir-field .ck.ck-editor__main > .ck-editor__editable {
  min-height: 220px;
  border-color: #85858F;
  border-radius: 0 0 10px 10px;
}

.ir-page .ir-field .ck.ck-editor__top .ck-toolbar {
  border-color: #85858F;
  border-radius: 10px 10px 0 0;
}

.ir-page .ir-field__error {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--ir-red-50);
  color: var(--ir-red-text);
  font-size: 14px;
  font-weight: 600;
}

.ir-page .ir-field__error::before {
  content: "!";
  flex: none;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--ir-red-text);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}

.ir-field:has(.ir-field__error) :is(input, select, textarea) {
  border-color: var(--ir-red-text);
}

/* sugestões enquanto digita o título ({{suggestion_list}}) */
.ir-page .ir-suggestions:empty {
  display: none;
}

.ir-page .ir-suggestions {
  padding: 14px 18px;
  border-radius: var(--ir-radius);
  background: var(--ir-bg);
}

.ir-page .ir-suggestions ul {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.ir-page .ir-suggestions a,
.ir-page .ir-suggestions a:visited {
  color: var(--ir-red-text);
  font-weight: 600;
}

.ir-form__footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 8px;
  border-top: 1px solid var(--ir-line);
}

.ir-page .ir-form__footer input[type="submit"] {
  min-width: 180px;
  margin: 0;
  border: 0;
  cursor: pointer;
}

.ir-page .ir-tip__list {
  display: grid;
  gap: 10px;
  margin: 10px 0 0;
  padding-left: 20px;
  list-style: disc;
  color: var(--ir-ink-2);
  font-size: 15px;
}

@media (max-width: 640px) {
  .ir-comm-head__actions,
  .ir-comm-head__actions .ir-btn {
    width: 100%;
  }

  .ir-post {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 16px;
  }

  .ir-cpost__author {
    flex-wrap: wrap;
  }

  .ir-cpost__bar {
    align-items: flex-start;
  }

  .ir-cpost__tools {
    width: 100%;
    margin-left: 0;
  }

  .ir-page .ir-cpost-reply .ir-reply__controls {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .ir-form__footer input[type="submit"],
  .ir-page .ir-form__footer input[type="submit"] {
    width: 100%;
  }
}

.ir-page .ir-share:not(:has(*)) {
  display: none;
}

/* ajustes da comunidade */
.ir-page .ir-form__footer input[type="submit"] {
  min-height: 48px;
  border-radius: 999px;
  font: 700 16px var(--ir-font-body);
}

.ir-page .ir-field:has(.ir-field__error) :is(input, select, textarea) {
  border-color: var(--ir-red-text);
}

.ir-cpost-box {
  padding: 20px;
}

.ir-cpost-box ul a {
  padding-left: 0;
  padding-right: 0;
}

/* filtros "Mostrar/Ordenar" quebram linha no celular em vez de sair da tela */
.ir-page .ir-sorters {
  flex-wrap: wrap;
}

.ir-page .ir-sorters ul {
  flex-wrap: wrap;
}

.ir-page .ir-crumbs--zd .breadcrumbs li + li::before {
  color: #fff;
  font-size: 14px;
}

/* ==========================================================================
   ADAPTADOR ZENDESK
   Regras para a marcação que o próprio Zendesk gera (helpers {{pagination}},
   {{recent_activity}}, {{breadcrumbs}}, {{vote}}, formulários) e para o
   comportamento dos formulários do tema. Em outra plataforma, este bloco
   pode ser descartado ou adaptado à marcação equivalente.
   ========================================================================== */

/* resposta da solicitação: os campos só aparecem depois de clicar em
   "Escreva uma resposta" (o script adiciona .shown / .hidden) */
.request-main .comment-fields,
.request-main .request-submit-comment {
  display: none;
}

.request-main .comment-fields.shown {
  display: block;
}

.request-main .request-submit-comment.shown {
  display: inline;
}

.request-main .comment-show-container.hidden {
  display: none;
}

.ir-reqd__followup {
  padding-top: 20px;
}

.request-container.ir-reqd {
  flex-wrap: wrap;
  justify-content: space-between;
}

/* votos da comunidade ({{vote}}): alvo de toque mínimo de 35px */
.ir-page .ir-cvote :is(a, button) {
  min-width: 35px;
  min-height: 35px;
}

.ir-cvote__sum {
  margin: 3px 0;
}

/* seletor de tópico da nova publicação: seta do tema no lugar da nativa */
.ir-page .ir-field select:not([multiple]) {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 44px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B30004' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center;
}

/* campos gerados por {{input}} / {{textarea}} nos formulários do Zendesk */
.hbs-form input:not([type="submit"], [type="button"]),
.hbs-form textarea {
  color: #000;
  font-size: 14px;
}

.hbs-form input {
  max-width: 100%;
}

.comment-form-controls input[type="checkbox"] {
  margin-right: 5px;
}

/* texto da área de anexos ({{upload}}) */
.upload-dropzone span {
  color: #424257;
}

/* formulário de solicitação: o assunto é só um campo de texto — esconde os
   "Artigos sugeridos" que o formulário do Zendesk lista enquanto se digita */
.ir-request-form [data-test-id="suggested-articles"] {
  display: none;
}
