/* =========================================================
   chatPro blog — estilos do tema (tema filho do Astra)
   Base: site.css do layout original. Tokens em :root; componentes
   com as mesmas classes do layout. Ajustes para WordPress/Astra no fim.
   ========================================================= */

/* ---------- Fontes (hospedadas no tema) ---------- */
@font-face { font-family: "Paytone One"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/paytone-one-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Paytone One"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/paytone-one-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap; src: url(../fonts/space-grotesk-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap; src: url(../fonts/space-grotesk-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* ---------- Cores institucionais (Manual de Marca, p. 30) ---------- */
  --color-verde: #25D066;          /* Verde principal */
  --color-verde-2: #1BAD53;        /* Verde 2 */
  --color-verde-3: #24FF72;        /* Verde 3 */
  --color-verde-4: #EEFCF3;        /* Verde 4 */
  --color-preto: #000000;          /* Preto institucional */
  --color-cinza-1: #D1D1D5;
  --color-cinza-2: #E6E5E8;
  --color-cinza-3: #F1F0F2;
  --color-branco: #FFFFFF;

  /* ---------- Cores de interface (site oficial) ---------- */
  --color-ink: #0B0E0C;            /* texto e fundos escuros do chatpro.com.br */
  --color-ink-2: #1D2320;          /* superfície elevada sobre ink */
  --color-texto-suave: #4A514D;    /* texto secundário sobre branco / verde-4 */
  --color-texto-inverso: #FFFFFF;
  --color-texto-inverso-suave: #B9C0BC; /* texto secundário sobre ink */
  --color-linha: #D1D1D5;          /* hairlines sobre branco */
  --color-linha-escura: #2E3531;   /* hairlines sobre ink */
  --color-header-bg: rgba(255, 255, 255, 0.94);
  --color-foco: #1BAD53;
  --color-youtube: #FF0000; /* hover do botão de lives */

  /* ---------- Tipografia ---------- */
  --font-titulo: "Paytone One", "Space Grotesk", "Arial";
  --font-texto: "Space Grotesk", "Arial";

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --title-xl: 64px;     /* h1 de página */
  --title-lg: 48px;     /* h2 de seção */
  --title-md: 32px;     /* títulos de card destaque */
  --title-sm: 24px;     /* títulos de card */
  --text-xl: 22px;      /* subtítulo / título de linha de artigo */
  --text-lg: 20px;      /* lead */
  --text-md: 17px;      /* corpo */
  --text-sm: 15px;      /* apoio */
  --text-xs: 13px;      /* metadados e tags */

  --leading-tight: 1.02;
  --leading-snug: 1.25;
  --leading-body: 1.55;
  --tracking-caps: 0.06em;

  /* ---------- Espaçamento ---------- */
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* ---------- Bordas e raios ---------- */
  --border-hairline: 1px;
  --border-strong: 2px;
  --radius-none: 0px;       /* botões: cantos retos, como no site oficial */
  --radius-card: 16px;      /* cards e painéis */
  --radius-thumb: 12px;
  --radius-pill: 999px;     /* tags e o selo "blog" */
  --radius-round: 50%;

  /* ---------- Medidas de componentes ---------- */
  --size-full: 100%;
  --container-max: 1200px;
  --gutter: 32px;
  --header-h: 96px;
  --logo-h: 58px;
  --logo-footer-h: 44px;
  --icon-sm: 18px;
  --icon-md: 24px;
  --icon-lg: 32px;
  --icon-xl: 44px;
  --badge-sm: 40px;
  --badge-md: 56px;
  --badge-lg: 88px;
  --cover-h: 208px;
  --thumb-w: 232px;
  --thumb-h: 148px;
  --live-thumb-w: 620px;
  --live-logo-w: 520px;
  --live-logo-thumb-h: 22px;
  --text-max: 640px;
  --lead-max: 720px;
  --date-col: 168px;
  --notch-w: 80px;
  --notch-h: 40px;
  --button-pad-y: 14px;
  --button-pad-x: 22px;
  --button-lg-pad-y: 20px;
  --button-lg-pad-x: 36px;
  --menu-col: 280px;
  --z-header: 10;
  --article-max: 760px;
  --title-article: 48px;
  --text-article: 19px;
  --leading-article: 1.7;
  --speed: 160ms;
}

/* Tablet */
@media (max-width: 1099px) {
  :root {
    --title-xl: 52px;
    --title-lg: 40px;
    --title-md: 28px;
    --gutter: 32px;
    --header-h: 84px;
    --logo-h: 53px;
    --cover-h: 176px;
    --thumb-w: 200px;
    --thumb-h: 132px;
    --space-9: 80px;
    --title-article: 40px;
  }
}

/* Mobile */
@media (max-width: 699px) {
  :root {
    --title-xl: 40px;
    --title-lg: 32px;
    --title-md: 24px;
    --title-sm: 20px;
    --text-xl: 18px;
    --text-lg: 18px;
    --text-md: 16px;
    --gutter: 20px;
    --header-h: 72px;
    --logo-h: 46px;
    --badge-lg: 64px;
    --icon-xl: 32px;
    --thumb-w: 88px;
    --thumb-h: 88px;
    --space-9: 64px;
    --space-8: 48px;
    --title-article: 30px;
    --text-article: 17px;
  }
}

/* ---------- Base ---------- */
:where(.chatpro-theme) *, :where(.chatpro-theme) *::before, :where(.chatpro-theme) *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.chatpro-theme {
  margin: var(--space-0);
  background: var(--color-branco);
  color: var(--color-ink);
  font-family: var(--font-texto);
  font-size: var(--text-md);
  font-weight: var(--weight-regular);
  line-height: var(--leading-body);
}

.site-main { display: flex; flex-direction: column; }

:where(.chatpro-theme) img { max-width: var(--size-full); height: auto; }
:where(.site-header, .site-main, .site-footer) img { display: block; }

:where(.chatpro-theme) a, :where(.chatpro-theme) a:hover, :where(.chatpro-theme) a:focus { color: inherit; }

.chatpro-theme :where(h1, h2, h3, h4, p) { margin: var(--space-0); }

:where(.chatpro-theme) button { font-family: var(--font-texto); }

.chatpro-theme :focus-visible { outline: var(--border-strong) solid var(--color-foco); outline-offset: var(--border-strong); }

.icon { width: var(--icon-md); height: var(--icon-md); flex: 0 0 auto; display: block; }
.icon-sm { width: var(--icon-sm); height: var(--icon-sm); flex: 0 0 auto; display: block; }

/* ---------- Estrutura ---------- */
.container {
  width: var(--size-full);
  max-width: calc(var(--container-max) + var(--gutter) * 2);
  margin: var(--space-0) auto;
  padding: var(--space-0) var(--gutter);
  display: flex;
  flex-direction: column;
}

.section { display: flex; flex-direction: column; padding: var(--space-9) var(--space-0); }
.section-tight { display: flex; flex-direction: column; padding: var(--space-7) var(--space-0) var(--space-9); }
.section-verde { background: var(--color-verde-4); }
.section-live { background: var(--color-verde); color: var(--color-texto-inverso); }
.section-live .lead { color: var(--color-texto-inverso); }
.section-live .link-arrow:hover { color: var(--color-verde-4); }
.section-ink { background: var(--color-ink); color: var(--color-texto-inverso); }

.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-5);
  margin-bottom: var(--space-7);
  flex-wrap: wrap;
}
.section-head-text { display: flex; flex-direction: column; gap: var(--space-3); max-width: var(--lead-max); }


.title-display { font-family: var(--font-titulo); font-weight: var(--weight-regular); font-size: var(--title-xl); line-height: var(--leading-tight); }
.title-section { font-family: var(--font-titulo); font-weight: var(--weight-regular); font-size: var(--title-lg); line-height: var(--leading-tight); }
.title-card { font-family: var(--font-titulo); font-weight: var(--weight-regular); font-size: var(--title-sm); line-height: var(--leading-snug); }
.subtitle { font-family: var(--font-texto); font-weight: var(--weight-bold); font-size: var(--text-xl); line-height: var(--leading-snug); }
.lead { font-size: var(--text-lg); line-height: var(--leading-body); color: var(--color-texto-suave); max-width: var(--lead-max); }
.muted { color: var(--color-texto-suave); }

/* ---------- Botões (base: chatpro.com.br — cantos retos, borda 2px, bold) ---------- */
.button-primary,
.button-youtube,
.button-secondary,
.button-green,
.button-light {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--button-pad-y) var(--button-pad-x);
  border: var(--border-strong) solid var(--color-ink);
  border-radius: var(--radius-none);
  font-family: var(--font-texto);
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  line-height: var(--leading-snug);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--speed), color var(--speed), border-color var(--speed);
  white-space: nowrap;
}
.button-primary { background: var(--color-ink); color: var(--color-texto-inverso); }
.button-primary:hover { background: var(--color-verde-2); border-color: var(--color-verde-2); color: var(--color-texto-inverso); }
.button-secondary { background: var(--color-branco); color: var(--color-ink); }
.button-secondary:hover { background: var(--color-ink); color: var(--color-texto-inverso); }
.button-green { background: var(--color-verde-2); border-color: var(--color-verde-2); color: var(--color-texto-inverso); }
.button-green:hover { background: var(--color-verde); border-color: var(--color-verde); }
.button-youtube { background: var(--color-ink); color: var(--color-texto-inverso); }
.button-youtube:hover { background: var(--color-youtube); border-color: var(--color-youtube); }
.button-light { background: transparent; border-color: var(--color-branco); color: var(--color-texto-inverso); }
.button-light:hover { background: var(--color-branco); color: var(--color-ink); }

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-weight: var(--weight-bold);
  text-decoration: underline;
  text-underline-offset: var(--space-1);
  text-decoration-thickness: var(--border-strong);
  white-space: nowrap;
}
.link-arrow:hover { color: var(--color-verde-2); }

/* ---------- Tags ---------- */
.tag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  line-height: var(--leading-snug);
  background: var(--color-cinza-3);
  color: var(--color-ink);
  white-space: nowrap;
}
.tag-artigos { background: var(--color-verde); color: var(--color-texto-inverso); }
.tag-tutoriais { background: var(--color-ink); color: var(--color-texto-inverso); }
.tag-novidades { background: var(--color-verde-3); }
.tag-materiais { background: var(--color-verde-4); border: var(--border-hairline) solid var(--color-verde-2); }
.tag-outline { background: transparent; border: var(--border-hairline) solid currentColor; color: inherit; }

.meta { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; font-size: var(--text-xs); color: var(--color-texto-suave); }
.meta-item { display: inline-flex; align-items: center; gap: var(--space-1); }
.meta-sep { width: var(--space-1); height: var(--space-1); border-radius: var(--radius-round); background: var(--color-cinza-1); flex: 0 0 auto; }

/* ---------- Selos de ícone (Manual p. 37: ícone em negativo no círculo preto) ---------- */
.icon-badge {
  width: var(--badge-md);
  height: var(--badge-md);
  border-radius: var(--radius-round);
  background: var(--color-ink);
  color: var(--color-branco);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.icon-badge-light { background: var(--color-branco); color: var(--color-ink); }
.icon-badge-lg { width: var(--badge-lg); height: var(--badge-lg); }
.icon-badge-lg .icon { width: var(--icon-xl); height: var(--icon-xl); }
.icon-badge-sm { width: var(--badge-sm); height: var(--badge-sm); }
.icon-badge-sm .icon { width: var(--icon-sm); height: var(--icon-sm); }

/* =========================================================
   HEADER (componente único — renderizado por components.js)
   ========================================================= */
.site-header {
  position: sticky;
  top: var(--space-0);
  z-index: var(--z-header);
  background: var(--color-header-bg);
  border-bottom: var(--border-hairline) solid var(--color-cinza-2);
  display: flex;
  flex-direction: column;
}
.header-bar { flex-direction: row; align-items: center; justify-content: space-between; height: var(--header-h); gap: var(--space-5); }
.header-logo { display: flex; align-items: center; flex: 0 0 auto; }
.header-logo img { height: var(--logo-h); width: auto; }
.header-nav { display: flex; align-items: center; gap: var(--space-5); }
.header-nav .nav-link { margin-right: var(--space-3); }

.nav-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-2) var(--space-0);
  background: transparent;
  border: var(--space-0);
  border-bottom: var(--border-strong) solid transparent;
  color: var(--color-ink);
  font-family: var(--font-texto);
  font-size: var(--text-md);
  font-weight: var(--weight-regular);
  text-decoration: none;
  cursor: pointer;
}
.nav-link:hover { border-bottom-color: var(--color-ink); }
.nav-link[aria-current="page"],
.nav-link.is-active { font-weight: var(--weight-bold); border-bottom-color: var(--color-verde); }
.nav-link .icon-sm { transition: transform var(--speed); }
.nav-link[aria-expanded="true"] .icon-sm { transform: rotate(180deg); }

.header-menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: var(--badge-md);
  height: var(--badge-md);
  background: transparent;
  border: var(--border-strong) solid var(--color-ink);
  border-radius: var(--radius-none);
  color: var(--color-ink);
  cursor: pointer;
}

/* Menu "Seções" — faixa em fluxo dentro do header fixo (sem absolute) */
.header-sections { background: var(--color-verde-4); border-top: var(--border-hairline) solid var(--color-cinza-2); }
.header-sections[hidden], .header-mobile[hidden] { display: none; }
.menu-row { flex-direction: row; gap: var(--space-5); padding-top: var(--space-6); padding-bottom: var(--space-6); }
.menu-item {
  flex: 1 1 0;
  display: flex;
  gap: var(--space-4);
  align-items: flex-start;
  padding: var(--space-4);
  border-radius: var(--radius-card);
  text-decoration: none;
  transition: background var(--speed);
}
.menu-item:hover { background: var(--color-branco); }
.menu-item-text { display: flex; flex-direction: column; gap: var(--space-1); }
.menu-item-title { font-weight: var(--weight-bold); font-size: var(--text-md); }
.menu-item-desc { font-size: var(--text-sm); color: var(--color-texto-suave); line-height: var(--leading-snug); }

/* Menu mobile */
.header-mobile { background: var(--color-branco); border-top: var(--border-hairline) solid var(--color-cinza-2); }
.mobile-list { display: flex; flex-direction: column; padding-top: var(--space-3); padding-bottom: var(--space-5); gap: var(--space-4); }
.mobile-label { font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--color-texto-suave); padding-top: var(--space-3); }
.mobile-link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-0);
  border-bottom: var(--border-hairline) solid var(--color-cinza-2);
  font-weight: var(--weight-bold);
  font-size: var(--text-lg);
  text-decoration: none;
}
.mobile-link-text { flex: 1 1 auto; }
.mobile-list .button-green, .mobile-list .button-secondary { width: var(--size-full); }

@media (max-width: 699px) {
  .header-nav { display: none; }
  .header-menu-toggle { display: flex; }
}
@media (max-width: 1099px) {
  .menu-item { flex-direction: column; }
}

/* =========================================================
   FOOTER (componente único — renderizado por components.js)
   ========================================================= */
.site-footer { background: var(--color-ink); color: var(--color-texto-inverso); display: flex; flex-direction: column; }
.footer-notch { display: flex; justify-content: center; margin-top: calc(var(--border-hairline) * -1); }
.footer-notch svg { width: var(--notch-w); height: calc(var(--notch-h) + var(--border-hairline)); display: block; }
.notch-branco { fill: var(--color-branco); }
.notch-verde { fill: var(--color-verde-4); }
.notch-verde2 { fill: var(--color-verde-2); }
.notch-principal { fill: var(--color-verde); }

.footer-contact { align-items: center; text-align: center; gap: var(--space-6); padding-top: var(--space-8); padding-bottom: var(--space-8); }
.footer-title { font-family: var(--font-titulo); font-weight: var(--weight-regular); font-size: var(--title-lg); line-height: var(--leading-tight); max-width: var(--lead-max); }
.footer-actions { display: flex; gap: var(--space-4); flex-wrap: wrap; justify-content: center; }
.footer-actions .button-green, .footer-actions .button-light, .live-actions .button-youtube { padding: var(--button-lg-pad-y) var(--button-lg-pad-x); font-size: var(--text-lg); }
.footer-phone { display: flex; flex-direction: column; align-items: center; gap: var(--space-1); }
.footer-phone-label { font-size: var(--text-lg); }
.footer-phone-number { font-family: var(--font-texto); font-weight: var(--weight-medium); font-size: var(--title-md); color: var(--color-verde); text-decoration: none; line-height: var(--leading-snug); }

.footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; gap: var(--space-6); padding-top: var(--space-6); padding-bottom: var(--space-6); border-top: var(--border-hairline) solid var(--color-linha-escura); flex-wrap: wrap; }
.footer-logo img { height: var(--logo-footer-h); width: auto; }
.footer-social { display: flex; align-items: center; gap: var(--space-3); }
.footer-social-label { font-size: var(--text-sm); color: var(--color-texto-inverso-suave); margin-right: var(--space-2); }
.social-link {
  width: var(--badge-sm);
  height: var(--badge-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-round);
  border: var(--border-hairline) solid var(--color-linha-escura);
  color: var(--color-texto-inverso);
  transition: background var(--speed), color var(--speed);
}
.social-link:hover { background: var(--color-verde); color: var(--color-texto-inverso); border-color: var(--color-verde); }
.footer-links { display: flex; gap: var(--space-5); flex-wrap: wrap; }
.footer-link { font-size: var(--text-sm); text-decoration: none; color: var(--color-texto-inverso); }
.footer-link:hover { color: var(--color-verde); }
.footer-legal { padding-bottom: var(--space-6); font-size: var(--text-xs); color: var(--color-texto-inverso-suave); }

@media (max-width: 699px) {
  .footer-actions { flex-direction: column; width: var(--size-full); }
  .footer-actions .button-green, .footer-actions .button-light { width: var(--size-full); }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .footer-links { flex-direction: column; gap: var(--space-3); }
}

/* =========================================================
   HOME — Comece por aqui
   ========================================================= */
.intro { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-8); max-width: var(--lead-max); }

/* Cards de seção com capa */
.section-cards { display: flex; gap: var(--space-5); }
.card-section {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  border: var(--border-strong) solid var(--color-ink);
  border-radius: var(--radius-card);
  overflow: hidden;
  text-decoration: none;
  background: var(--color-branco);
  transition: transform var(--speed);
}
.card-section:hover { transform: translateY(calc(var(--space-1) * -1)); }
.card-cover {
  height: var(--cover-h);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--space-5);
  border-bottom: var(--border-strong) solid var(--color-ink);
}
.cover-artigos { background: var(--color-verde); color: var(--color-texto-inverso); }
.cover-tutoriais { background: var(--color-ink); color: var(--color-texto-inverso); }
.cover-novidades { background: var(--color-verde-3); color: var(--color-ink); }
.cover-materiais { background: var(--color-verde-4); color: var(--color-ink); }
.cover-top { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.cover-count { font-family: var(--font-titulo); font-size: var(--title-md); line-height: var(--leading-tight); }
.cover-count-label { font-size: var(--text-sm); font-weight: var(--weight-bold); }
.cover-bottom { display: flex; flex-direction: column; }
.cover-bubbles { display: flex; flex-direction: column; gap: var(--space-1); align-items: flex-end; }
.bubble { height: var(--space-3); border-radius: var(--radius-pill); background: currentColor; opacity: 0.22; }
.bubble-lg { width: var(--space-9); }
.bubble-md { width: var(--space-8); }
.bubble-sm { width: var(--space-7); }

.card-body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); flex: 1 1 auto; }
.card-desc { font-size: var(--text-sm); color: var(--color-texto-suave); flex: 1 1 auto; }
.card-foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding-top: var(--space-2); }
.card-foot-link { display: inline-flex; align-items: center; gap: var(--space-1); font-weight: var(--weight-bold); font-size: var(--text-sm); }

@media (max-width: 1099px) {
  .section-cards { flex-wrap: wrap; }
  .card-section { flex: 1 1 calc(50% - var(--space-5)); }
}
@media (max-width: 699px) {
  .section-cards { flex-direction: column; gap: var(--space-3); }
  .card-section { flex: 1 1 auto; flex-direction: row; }
  .card-cover { height: auto; width: var(--thumb-w); flex: 0 0 auto; border-bottom: var(--space-0); border-right: var(--border-strong) solid var(--color-ink); padding: var(--space-3); justify-content: center; align-items: center; }
  .cover-bottom, .cover-bubbles, .cover-top .tag { display: none; }
  .card-cover .icon-badge-lg { width: var(--badge-md); height: var(--badge-md); }
  .card-body { padding: var(--space-4); gap: var(--space-2); }
  .card-desc { display: none; }
  .card-foot { padding-top: var(--space-0); }
}

/* Linhas de artigo */
.article-list { display: flex; flex-direction: column; border-top: var(--border-hairline) solid var(--color-linha); }
.article-row {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-5) var(--space-0);
  border-bottom: var(--border-hairline) solid var(--color-linha);
  text-decoration: none;
}
.article-row:hover .article-title { text-decoration: underline; text-decoration-thickness: var(--border-strong); text-underline-offset: var(--space-1); }
.article-row:hover .row-arrow { background: var(--color-verde); border-color: var(--color-verde); }
.article-thumb {
  width: var(--thumb-w);
  height: var(--thumb-h);
  flex: 0 0 auto;
  border-radius: var(--radius-thumb);
  display: flex;
  align-items: center;
  justify-content: center;
}
.thumb-artigos { background: var(--color-verde); }
.thumb-tutoriais { background: var(--color-ink); }
.thumb-novidades { background: var(--color-verde-3); }
.thumb-materiais { background: var(--color-verde-4); border: var(--border-hairline) solid var(--color-verde-2); }
.article-main { flex: 1 1 auto; display: flex; flex-direction: column; gap: var(--space-2); }
.article-title { font-family: var(--font-texto); font-weight: var(--weight-bold); font-size: var(--text-xl); line-height: var(--leading-snug); }
.article-excerpt { font-size: var(--text-sm); color: var(--color-texto-suave); max-width: var(--text-max); }
.row-arrow {
  width: var(--badge-md);
  height: var(--badge-md);
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border: var(--border-strong) solid var(--color-ink);
  transition: background var(--speed);
}
@media (max-width: 1099px) {
  .article-row { gap: var(--space-5); }
  .row-arrow { display: none; }
}
@media (max-width: 699px) {
  .article-row { align-items: flex-start; gap: var(--space-4); padding: var(--space-4) var(--space-0); }
  .article-thumb .icon-badge { width: var(--badge-sm); height: var(--badge-sm); }
  .article-thumb .icon-badge .icon { width: var(--icon-sm); height: var(--icon-sm); }
  .article-excerpt { display: none; }
}

/* Ao vivo */
.live { display: flex; flex-direction: row; align-items: stretch; gap: var(--space-8); }
.live-text { flex: 1 1 0; display: flex; flex-direction: column; gap: var(--space-5); }
.live-text .live-actions { margin-top: auto; }
.live-actions { display: flex; gap: var(--space-4); align-items: center; flex-wrap: wrap; padding-top: var(--space-2); }
.live-title { display: flex; margin: var(--space-0); }
.live-logo { width: var(--size-full); max-width: var(--live-logo-w); height: auto; }
.live-thumb-logo { height: var(--live-logo-thumb-h); width: auto; }
.live-media { flex: 0 1 var(--live-thumb-w); display: flex; flex-direction: column; gap: var(--space-3); text-decoration: none; }
.live-thumb {
  width: var(--size-full);
  aspect-ratio: 16 / 9;
  background: var(--color-ink);
  color: var(--color-texto-inverso);
  border-radius: var(--radius-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--space-6);
  border: var(--border-strong) solid var(--color-ink);
}
.live-thumb-top { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); }
.live-badge { display: inline-flex; align-items: center; gap: var(--space-2); background: var(--color-verde); color: var(--color-texto-inverso); padding: var(--space-1) var(--space-3); border-radius: var(--radius-pill); font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-caps); text-transform: uppercase; }
.live-badge-dot { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-round); background: var(--color-branco); }
.live-duration { font-size: var(--text-xs); font-weight: var(--weight-bold); background: var(--color-ink-2); padding: var(--space-1) var(--space-2); }
.live-thumb-center { display: flex; align-items: center; gap: var(--space-5); }
.live-play { width: var(--badge-lg); height: var(--badge-lg); border-radius: var(--radius-round); background: var(--color-verde); color: var(--color-texto-inverso); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; transition: transform var(--speed); }
.live-media:hover .live-play { transform: scale(1.06); }
.live-thumb-title { font-family: var(--font-titulo); font-size: var(--title-sm); line-height: var(--leading-snug); }
.live-thumb-foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); color: var(--color-texto-inverso-suave); font-size: var(--text-sm); }

@media (max-width: 1099px) {
  .live { flex-direction: column; align-items: stretch; gap: var(--space-7); }
  .live-media { flex: 1 1 auto; }
}
@media (max-width: 699px) {
  .live-thumb { padding: var(--space-4); }
  .live-thumb-title { font-size: var(--text-md); }
  .live-play { width: var(--badge-md); height: var(--badge-md); }
  .live-thumb-foot { display: none; }
  .live-actions { flex-direction: column; align-items: stretch; }
}

/* =========================================================
   PÁGINAS DE SEÇÃO
   ========================================================= */
.page-hero { display: flex; flex-direction: column; padding: var(--space-8) var(--space-0) var(--space-8); }
.hero-artigos { background: var(--color-verde); color: var(--color-texto-inverso); }
.hero-tutoriais { background: var(--color-ink); color: var(--color-texto-inverso); }
.hero-novidades { background: var(--color-verde-3); }
.hero-materiais { background: var(--color-verde-4); }
.hero-row { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: var(--space-7); }
.hero-text { display: flex; flex-direction: column; gap: var(--space-4); max-width: var(--lead-max); }
.hero-lead { font-size: var(--text-lg); }
.hero-tutoriais .hero-lead { color: var(--color-texto-inverso-suave); }


/* Filtros */
.filters { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-bottom: var(--space-7); }
.chip {
  padding: var(--space-2) var(--space-4);
  border: var(--border-strong) solid var(--color-ink);
  border-radius: var(--radius-pill);
  background: transparent;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-ink);
  cursor: pointer;
  white-space: nowrap;
}
.chip:hover { background: var(--color-verde-4); }
.chip.is-active { background: var(--color-ink); color: var(--color-texto-inverso); }
@media (max-width: 699px) {
  .filters { flex-wrap: nowrap; overflow-x: auto; margin-right: calc(var(--gutter) * -1); padding-right: var(--gutter); padding-bottom: var(--space-2); margin-bottom: var(--space-6); }
}

/* Destaque */
.featured {
  display: flex;
  gap: var(--space-7);
  align-items: stretch;
  border: var(--border-strong) solid var(--color-ink);
  border-radius: var(--radius-card);
  overflow: hidden;
  text-decoration: none;
  margin-bottom: var(--space-8);
}
.featured-cover { flex: 1 1 0; min-height: calc(var(--cover-h) * 1.6); display: flex; flex-direction: column; justify-content: space-between; padding: var(--space-6); }
.featured-body { flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; gap: var(--space-4); padding: var(--space-7) var(--space-7) var(--space-7) var(--space-0); }
.featured-title { font-family: var(--font-titulo); font-weight: var(--weight-regular); font-size: var(--title-md); line-height: var(--leading-snug); }
.featured-kicker { font-family: var(--font-titulo); font-size: var(--title-lg); line-height: var(--leading-tight); max-width: var(--menu-col); }
@media (max-width: 1099px) {
  .featured { flex-direction: column; gap: var(--space-0); }
  .featured-cover { flex: 0 0 auto; min-height: var(--cover-h); gap: var(--space-6); }
  .featured-body { flex: 0 0 auto; }
  .featured-body { padding: var(--space-6); }
}
@media (max-width: 699px) {
  .featured-cover { min-height: auto; padding: var(--space-5); gap: var(--space-6); }
  .featured-kicker { font-size: var(--title-md); }
  .featured-body { padding: var(--space-5); }
}

/* Cards de artigo (lista em colunas via flex-wrap) */
.card-list { display: flex; flex-wrap: wrap; gap: var(--space-7) var(--space-5); }
.card-article { flex: 0 1 calc((var(--size-full) - var(--space-5) * 2) / 3); display: flex; flex-direction: column; gap: var(--space-4); text-decoration: none; }
.card-article .article-thumb { width: var(--size-full); height: auto; aspect-ratio: 16 / 10; }
.card-article:hover .article-title { text-decoration: underline; text-decoration-thickness: var(--border-strong); text-underline-offset: var(--space-1); }
@media (max-width: 1099px) {
  .card-article { flex-basis: calc((var(--size-full) - var(--space-5)) / 2); }
}
@media (max-width: 699px) {
  .card-list { flex-direction: column; gap: var(--space-0); border-top: var(--border-hairline) solid var(--color-linha); }
  .card-article { flex-direction: row; align-items: flex-start; flex-basis: auto; padding: var(--space-4) var(--space-0); border-bottom: var(--border-hairline) solid var(--color-linha); }
  .card-article .article-thumb { width: var(--thumb-w); height: var(--thumb-h); aspect-ratio: auto; }
}

.load-more { display: flex; justify-content: center; padding-top: var(--space-8); }
.link-button { background: transparent; border: var(--space-0); padding: var(--space-0); color: var(--color-ink); font-family: var(--font-texto); font-size: var(--text-md); cursor: pointer; }
.link-button .icon-sm { transition: transform var(--speed); }
.link-button[aria-expanded="true"] .icon-sm { transform: rotate(180deg); }
.material-list.is-collapsed .card-material:nth-child(n+5) { display: none; }

/* Tutoriais: trilhas */
.track-list { display: flex; flex-direction: column; gap: var(--space-8); }
.track { display: flex; gap: var(--space-7); align-items: flex-start; }
.track-head { flex: 0 0 var(--menu-col); display: flex; flex-direction: column; gap: var(--space-3); }
.track-desc { font-size: var(--text-sm); color: var(--color-texto-suave); }
.track-body { flex: 1 1 auto; display: flex; flex-direction: column; }
.level { display: inline-flex; align-items: center; gap: var(--space-1); font-size: var(--text-xs); font-weight: var(--weight-bold); }
.level-bars { display: flex; gap: var(--space-1); align-items: flex-end; }
.level-bar { width: var(--space-1); height: var(--space-3); background: var(--color-cinza-1); }
.level-bar.is-on { background: var(--color-ink); }
@media (max-width: 1099px) {
  .track { flex-direction: column; gap: var(--space-5); }
  .track-head { flex: 0 0 auto; }
}

/* Novidades: linha do tempo */
.news-month { display: flex; gap: var(--space-7); padding: var(--space-6) var(--space-0); border-top: var(--border-strong) solid var(--color-ink); }
.news-date { flex: 0 0 var(--date-col); display: flex; flex-direction: column; gap: var(--space-1); }
.news-month-name { font-family: var(--font-titulo); font-size: var(--title-sm); line-height: var(--leading-snug); }
.news-year { font-size: var(--text-sm); color: var(--color-texto-suave); }
.news-entries { flex: 1 1 auto; display: flex; flex-direction: column; gap: var(--space-4); }
.news-item {
  display: flex;
  gap: var(--space-5);
  align-items: flex-start;
  padding: var(--space-5);
  border-radius: var(--radius-card);
  background: var(--color-cinza-3);
  text-decoration: none;
  transition: background var(--speed);
}
.news-item:hover { background: var(--color-verde-4); }
.news-item-main { flex: 1 1 auto; display: flex; flex-direction: column; gap: var(--space-2); }
.news-item-head { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; }
.news-day { font-size: var(--text-xs); color: var(--color-texto-suave); font-weight: var(--weight-bold); }
@media (max-width: 699px) {
  .news-month { flex-direction: column; gap: var(--space-4); }
  .news-date { flex-direction: row; align-items: baseline; gap: var(--space-2); flex: 0 0 auto; }
  .news-item { padding: var(--space-4); gap: var(--space-4); }
  .news-item .icon-badge { display: none; }
}

/* Materiais */
.material-banner {
  display: flex;
  align-items: center;
  gap: var(--space-7);
  padding: var(--space-7);
  border-radius: var(--radius-card);
  background: var(--color-ink);
  color: var(--color-texto-inverso);
  margin-bottom: var(--space-8);
}
.material-banner-text { flex: 1 1 auto; display: flex; flex-direction: column; gap: var(--space-4); }
.material-banner-text .muted { color: var(--color-texto-inverso-suave); }
.material-book {
  flex: 0 0 auto;
  width: var(--thumb-w);
  aspect-ratio: 3 / 4;
  background: var(--color-verde);
  color: var(--color-texto-inverso);
  border-radius: var(--radius-thumb);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.material-book-title { font-family: var(--font-titulo); font-size: var(--text-xl); line-height: var(--leading-snug); }
.material-list { display: flex; flex-wrap: wrap; gap: var(--space-5); }
.card-material {
  flex: 0 1 calc((var(--size-full) - var(--space-5) * 3) / 4);
  display: flex;
  flex-direction: column;
  border: var(--border-strong) solid var(--color-ink);
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--color-branco);
}
.material-cover { aspect-ratio: 4 / 3; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: var(--space-5); border-bottom: var(--border-strong) solid var(--color-ink); }
.material-body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); flex: 1 1 auto; }
.material-body .button-secondary { margin-top: auto; width: var(--size-full); }
.material-info { font-size: var(--text-xs); color: var(--color-texto-suave); font-weight: var(--weight-bold); }
@media (max-width: 1099px) {
  .card-material { flex-basis: calc((var(--size-full) - var(--space-5)) / 2); }
  .material-list.is-collapsed .card-material:nth-child(n+3) { display: none; }
  .material-banner { padding: var(--space-6); }
  .material-book { width: calc(var(--thumb-w) * 0.9); }
}
@media (max-width: 699px) {
  .material-banner { flex-direction: column; align-items: stretch; padding: var(--space-5); gap: var(--space-5); }
  .material-book { width: var(--size-full); aspect-ratio: auto; gap: var(--space-6); }
  .material-banner .button-green { width: var(--size-full); }
  .material-list { flex-direction: column; gap: var(--space-4); }
  .card-material { flex-direction: row; flex-basis: auto; }
  .material-list.is-collapsed .card-material:nth-child(n+3) { display: flex; }
  .material-list.is-collapsed .card-material:nth-child(n+4) { display: none; }
  .material-cover { aspect-ratio: auto; width: var(--thumb-w); flex: 0 0 auto; border-bottom: var(--space-0); border-right: var(--border-strong) solid var(--color-ink); padding: var(--space-3); align-items: center; justify-content: center; }
  .material-cover .tag { display: none; }
  .material-body { padding: var(--space-4); gap: var(--space-2); }
  .material-body .muted { display: none; }
  .material-body .button-secondary { width: auto; align-self: flex-start; padding: var(--space-2) var(--space-3); font-size: var(--text-sm); }
}

/* Continue explorando (reaproveita card-section em versão compacta) */
.explore .section-cards { flex-wrap: nowrap; }
@media (max-width: 1099px) {
  .explore .card-section { flex: 1 1 0; }
  .explore .card-desc { display: none; }
}
@media (max-width: 699px) {
  .explore .card-section { flex: 1 1 auto; }
}

/* =========================================================
   MODELO DE ARTIGO (Artigos, Tutoriais e Novidades)
   ========================================================= */
.article-page { display: flex; flex-direction: column; padding: var(--space-8) var(--space-0) var(--space-9); }
.article-head { max-width: calc(var(--article-max) + var(--gutter) * 2); gap: var(--space-4); margin-bottom: var(--space-7); }
.article-heading { font-family: var(--font-titulo); font-weight: var(--weight-regular); font-size: var(--title-article); line-height: var(--leading-tight); }
.article-banner-wrap { margin-bottom: var(--space-8); }
.article-banner { width: var(--size-full); aspect-ratio: 2 / 1; object-fit: cover; border-radius: var(--radius-card); background: var(--color-verde-4); }
.article-body { max-width: calc(var(--article-max) + var(--gutter) * 2); gap: var(--space-5); font-size: var(--text-article); line-height: var(--leading-article); }
.article-h2 { font-family: var(--font-texto); font-weight: var(--weight-bold); font-size: var(--title-md); line-height: var(--leading-snug); margin-top: var(--space-6); }
.article-bullets { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-0); margin: var(--space-0); list-style: none; }
.article-bullet { display: flex; gap: var(--space-3); align-items: flex-start; }
.bullet-dot { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-round); background: var(--color-verde-2); flex: 0 0 auto; margin-top: calc(var(--text-article) * 0.65); }
.article-figure { display: flex; flex-direction: column; gap: var(--space-3); margin: var(--space-4) var(--space-0); }
.article-figure img { width: var(--size-full); border-radius: var(--radius-thumb); }
.article-caption { font-size: var(--text-sm); color: var(--color-texto-suave); line-height: var(--leading-body); }
.article-quote { background: var(--color-verde-4); border-radius: var(--radius-card); padding: var(--space-6); margin: var(--space-4) var(--space-0); font-weight: var(--weight-bold); font-size: var(--text-xl); line-height: var(--leading-snug); }
.article-link { font-weight: var(--weight-bold); text-decoration-thickness: var(--border-strong); text-underline-offset: var(--space-1); }
.article-link:hover { color: var(--color-verde-2); }
.article-end { display: flex; padding-top: var(--space-6); margin-top: var(--space-4); border-top: var(--border-hairline) solid var(--color-linha); }
@media (max-width: 699px) {
  .article-page { padding-top: var(--space-6); }
  .article-head { margin-bottom: var(--space-5); }
  .article-banner-wrap { margin-bottom: var(--space-6); }
  .article-banner { aspect-ratio: 4 / 3; }
  .article-h2 { font-size: var(--title-sm); margin-top: var(--space-4); }
  .article-quote { padding: var(--space-5); font-size: var(--text-lg); }
}

/* =========================================================
   AJUSTES PARA WORDPRESS / ASTRA
   ========================================================= */

/* Contêineres do Astra: páginas do blog e posts ocupam a largura toda */
.chatpro-full .site-content { padding: var(--space-0); }
.chatpro-full .site-content > .ast-container { max-width: none; width: var(--size-full); padding: var(--space-0); margin: var(--space-0); display: block; }
.chatpro-theme:not(.chatpro-full) .site-content > .ast-container { max-width: calc(var(--container-max) + var(--gutter) * 2); padding-left: var(--gutter); padding-right: var(--gutter); }
.chatpro-theme #page { overflow: visible; }
.chatpro-page > :not(section):not(.wp-block-group.alignfull) { width: var(--size-full); max-width: calc(var(--article-max) + var(--gutter) * 2); margin: var(--space-6) auto; padding: var(--space-0) var(--gutter); }

/* Botões do Astra não podem vazar para os botões do layout */
.chatpro-theme .nav-link,
.chatpro-theme .nav-link:hover,
.chatpro-theme .nav-link:focus,
.chatpro-theme .header-menu-toggle,
.chatpro-theme .header-menu-toggle:hover,
.chatpro-theme .header-menu-toggle:focus,
.chatpro-theme .link-button,
.chatpro-theme .link-button:hover,
.chatpro-theme .link-button:focus { background: transparent; box-shadow: none; border-radius: var(--radius-none); letter-spacing: normal; text-transform: none; }
.chatpro-theme .nav-link:hover, .chatpro-theme .nav-link:focus { color: var(--color-ink); }
.chatpro-theme .header-menu-toggle:hover, .chatpro-theme .header-menu-toggle:focus { color: var(--color-ink); border-color: var(--color-ink); }
.chatpro-theme .link-button { color: var(--color-ink); border: var(--space-0); padding: var(--space-0); line-height: var(--leading-body); font-weight: var(--weight-bold); }
.chatpro-theme .link-button:hover { color: var(--color-verde-2); }
.chatpro-theme :is(.button-primary, .button-secondary, .button-green, .button-light, .button-youtube, .chip, .tag) { text-decoration: none; }
.chatpro-theme .button-secondary:hover, .chatpro-theme .button-secondary:focus-visible { color: var(--color-texto-inverso); }
.chatpro-theme .button-green:hover, .chatpro-theme .button-green:focus-visible,
.chatpro-theme .button-youtube:hover, .chatpro-theme .button-youtube:focus-visible { color: var(--color-texto-inverso); }
.chatpro-theme .button-light:hover, .chatpro-theme .button-light:focus-visible { color: var(--color-ink); }
.chatpro-theme .is-disabled { opacity: 0.5; cursor: default; pointer-events: none; }

/* Header fixo (abaixo da barra de administração quando logado) */
.site-header { top: var(--wp-admin--admin-bar--height, 0px); }
.site-header .header-logo img { width: auto; }
.header-menu-toggle .icon-close { display: none; }
.header-menu-toggle[aria-expanded="true"] .icon-open { display: none; }
.header-menu-toggle[aria-expanded="true"] .icon-close { display: block; }
.menu-item.is-active { background: var(--color-branco); }
.mobile-link.is-active .mobile-link-text { color: var(--color-verde-2); }
.header-nav .button-secondary, .header-nav .button-green { margin: var(--space-0); }
@media (max-width: 699px) {
  .header-sections { display: none; }
}

/* Links: sem sublinhado herdado do Astra */
.chatpro-theme :is(.article-row, .card-article, .card-section, .featured, .news-item, .menu-item, .mobile-link, .footer-link, .footer-phone-number, .header-logo, .footer-logo, .live-media) { text-decoration: none; }
.chatpro-theme .link-arrow { text-decoration: underline; text-decoration-thickness: var(--border-strong); text-underline-offset: var(--space-1); }
.chatpro-theme .link-arrow:hover { color: var(--color-verde-2); }
.section-live .link-arrow:hover { color: var(--color-verde-4); }
.chatpro-theme .footer-link:hover, .chatpro-theme .footer-legal-link:hover { color: var(--color-verde); }
.footer-legal-link { color: var(--color-texto-inverso-suave); margin-left: var(--space-2); }

/* Títulos com cor e fonte explícitas (o Astra define as dos h1–h6) */
.chatpro-theme :is(.title-display, .title-section, .title-card, .featured-title, .article-heading, .footer-title, .live-title) { font-family: var(--font-titulo); font-weight: var(--weight-regular); }
.chatpro-theme :is(.title-display, .title-section, .title-card, .featured-title, .article-heading) { color: var(--color-ink); }
.chatpro-theme .hero-artigos .title-display,
.chatpro-theme .hero-tutoriais .title-display,
.chatpro-theme .material-banner .title-section,
.chatpro-theme .footer-title { color: var(--color-texto-inverso); }
.chatpro-theme .article-title { font-family: var(--font-texto); color: var(--color-ink); }
.material-banner .muted { color: var(--color-texto-inverso-suave); }

/* Filtros como links */
.chatpro-theme .chip { display: inline-block; flex: 0 0 auto; line-height: var(--leading-body); }
.chatpro-theme .chip.is-active, .chatpro-theme .chip.is-active:hover { color: var(--color-texto-inverso); background: var(--color-ink); }

/* Miniaturas com imagem destacada */
.article-thumb.has-image { overflow: hidden; border: var(--space-0); }
.article-thumb.has-image img { width: var(--size-full); height: var(--size-full); object-fit: cover; }

/* Trilhas: link para a trilha completa */
.track-head .link-arrow { align-self: flex-start; font-size: var(--text-sm); }

/* Materiais: segunda opção de link e "Mostrar todos" só quando há itens escondidos */
.material-body .material-alt { font-size: var(--text-sm); align-self: flex-start; }
.material-body .button-secondary { text-align: center; }
.load-more-toggle { display: none; }
.load-more-toggle.more-d { display: flex; }
@media (max-width: 1099px) {
  .load-more-toggle { display: none; }
  .load-more-toggle.more-t { display: flex; }
}
@media (max-width: 699px) {
  .load-more-toggle, .load-more-toggle.more-t { display: none; }
  .load-more-toggle.more-m { display: flex; }
}
.material-list:not(.is-collapsed) + .load-more-toggle { display: flex; }

/* Estado vazio */
.empty-state { padding: var(--space-6) var(--space-0); }

/* =========================================================
   CORPO DO POST (blocos do editor)
   ========================================================= */
.article-body { display: flex; flex-direction: column; }
.article-body > * { margin: var(--space-0); max-width: var(--size-full); }
.article-body > :where(h2) { font-family: var(--font-texto); font-weight: var(--weight-bold); font-size: var(--title-md); line-height: var(--leading-snug); color: var(--color-ink); margin-top: var(--space-6); }
.article-body > :where(h3) { font-family: var(--font-texto); font-weight: var(--weight-bold); font-size: var(--text-xl); line-height: var(--leading-snug); color: var(--color-ink); margin-top: var(--space-4); }
.article-body > :where(h4, h5, h6) { font-family: var(--font-texto); font-weight: var(--weight-bold); font-size: var(--text-lg); color: var(--color-ink); }
.article-body :where(ul) { list-style: none; padding: var(--space-0); display: flex; flex-direction: column; gap: var(--space-3); }
.article-body :where(ul) > li { position: relative; padding-left: calc(var(--space-2) + var(--space-3)); }
.article-body :where(ul) > li::before { content: ""; position: absolute; left: var(--space-0); top: calc(var(--text-article) * 0.65); width: var(--space-2); height: var(--space-2); border-radius: var(--radius-round); background: var(--color-verde-2); }
.article-body :where(ol) { padding-left: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.article-body :where(ol) > li::marker { font-weight: var(--weight-bold); color: var(--color-verde-2); }
.article-body :where(figure) { margin: var(--space-4) var(--space-0); display: flex; flex-direction: column; gap: var(--space-3); }
.article-body :where(figure) img { width: var(--size-full); height: auto; border-radius: var(--radius-thumb); }
.article-body :where(figcaption), .article-body .wp-element-caption { font-size: var(--text-sm); color: var(--color-texto-suave); line-height: var(--leading-body); margin: var(--space-0); text-align: left; }
.article-body :where(blockquote), .article-body .wp-block-quote, .article-body .wp-block-pullquote { background: var(--color-verde-4); border: var(--space-0); border-radius: var(--radius-card); padding: var(--space-6); margin: var(--space-4) var(--space-0); font-style: normal; font-weight: var(--weight-bold); font-size: var(--text-xl); line-height: var(--leading-snug); color: var(--color-ink); text-align: left; }
.article-body :where(blockquote) p { margin: var(--space-0); }
.article-body :where(blockquote) cite { display: block; margin-top: var(--space-3); font-size: var(--text-sm); font-weight: var(--weight-regular); font-style: normal; color: var(--color-texto-suave); }
.article-body a:not([class]) { font-weight: var(--weight-bold); color: var(--color-ink); text-decoration: underline; text-decoration-thickness: var(--border-strong); text-underline-offset: var(--space-1); }
.article-body a:not([class]):hover { color: var(--color-verde-2); }
.article-body :where(hr) { border: var(--space-0); border-top: var(--border-hairline) solid var(--color-linha); margin: var(--space-4) var(--space-0); }
.article-body :where(pre, code) { font-size: 0.9em; background: var(--color-cinza-3); border-radius: var(--radius-thumb); }
.article-body :where(code) { padding: 2px 6px; }
.article-body :where(pre) { padding: var(--space-4); overflow-x: auto; }
.article-body :where(table) { width: var(--size-full); border-collapse: collapse; font-size: var(--text-sm); }
.article-body :where(th, td) { border-bottom: var(--border-hairline) solid var(--color-linha); padding: var(--space-3); text-align: left; }
.article-body .wp-block-button__link { display: inline-flex; padding: var(--button-pad-y) var(--button-pad-x); border: var(--border-strong) solid var(--color-verde-2); border-radius: var(--radius-none); background: var(--color-verde-2); color: var(--color-texto-inverso); font-weight: var(--weight-bold); text-decoration: none; }
.article-body .wp-block-button__link:hover { background: var(--color-verde); border-color: var(--color-verde); color: var(--color-texto-inverso); }
.article-body .wp-block-embed iframe { width: var(--size-full); border-radius: var(--radius-card); }
.article-banner { height: auto; }
.article-head .tag { text-decoration: none; }
@media (max-width: 699px) {
  .article-body > :where(h2) { font-size: var(--title-sm); margin-top: var(--space-4); }
  .article-body :where(blockquote), .article-body .wp-block-quote { padding: var(--space-5); font-size: var(--text-lg); }
}

/* =========================================================
   CAPA DOS CARDS DE SEÇÃO (imagem opcional, ícone pequeno no canto)
   ========================================================= */
.card-cover { position: relative; overflow: hidden; }
@media (min-width: 700px) {
  .card-cover { padding: var(--space-4) var(--space-4) var(--space-3); }
}
.icon-badge-cover { width: var(--space-7); height: var(--space-7); }
.icon-badge-cover .icon { width: var(--icon-md); height: var(--icon-md); }
.card-cover-img { position: absolute; inset: 0; width: var(--size-full); height: var(--size-full); max-width: none; object-fit: cover; z-index: 0; }
.card-cover.has-image { color: var(--color-texto-inverso); }
.card-cover.has-image::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(11, 14, 12, 0.45) 0%, rgba(11, 14, 12, 0.12) 45%, rgba(11, 14, 12, 0) 70%); }
.card-cover > .cover-top, .card-cover > .cover-bottom { position: relative; z-index: 2; }
@media (max-width: 699px) {
  .card-cover.has-image::after { background: rgba(11, 14, 12, 0.15); }
}

/* =========================================================
   ÚLTIMA LIVE: miniatura do YouTube e player carregado no clique
   ========================================================= */
.chatpro-theme .live-thumb { position: relative; text-decoration: none; }
.live-thumb-img { position: absolute; inset: 0; width: var(--size-full); height: var(--size-full); max-width: none; object-fit: cover; z-index: 0; }
.live-thumb.has-thumb::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(11, 14, 12, 0.88) 0%, rgba(11, 14, 12, 0.55) 50%, rgba(11, 14, 12, 0.4) 100%); }
.live-thumb > :not(.live-thumb-img) { position: relative; z-index: 2; }
.live-player { position: relative; width: var(--size-full); aspect-ratio: 16 / 9; border: var(--border-strong) solid var(--color-ink); border-radius: var(--radius-card); overflow: hidden; background: var(--color-ink); }
.live-player iframe { position: absolute; inset: 0; width: var(--size-full); height: var(--size-full); border: 0; }
.live-thumb.has-thumb::after { background: linear-gradient(to top, rgba(11, 14, 12, 0.7) 0%, rgba(11, 14, 12, 0.2) 35%, rgba(11, 14, 12, 0.1) 100%); }
.live-thumb.has-thumb .live-thumb-center { justify-content: center; }
.live-thumb.has-thumb .live-thumb-foot { justify-content: flex-start; color: var(--color-texto-inverso); }
.live-caption { font-family: var(--font-titulo); font-size: var(--title-sm); line-height: var(--leading-snug); color: var(--color-texto-inverso); margin: var(--space-0); }
@media (max-width: 699px) {
  .live-caption { font-size: var(--text-lg); }
}
.live-thumb.has-thumb { padding: var(--space-4); }
.live-caption { font-family: var(--font-texto); font-weight: var(--weight-medium); font-size: var(--text-xl); }
@media (max-width: 699px) {
  .live-thumb.has-thumb { padding: var(--space-3); }
  .live-caption { font-size: var(--text-lg); }
}

/* Home: "Comece por aqui" sem título visível, mais perto do header */
.section-comece.is-compact { padding-top: var(--space-7); }
.section-comece.is-compact .intro { margin-bottom: var(--space-6); }
@media (max-width: 1099px) {
  .section-comece.is-compact { padding-top: var(--space-6); }
}
@media (max-width: 699px) {
  .section-comece.is-compact { padding-top: var(--space-5); }
  .section-comece.is-compact .intro { margin-bottom: var(--space-5); }
}
.chatpro-theme .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* =========================================================
   POST: banner com a imagem destacada e o título (h1) por cima
   ========================================================= */
.article-page { padding-top: var(--space-6); }
.article-hero-wrap { margin: 0 auto var(--space-8) auto; }
.article-hero { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; aspect-ratio: 2 / 1; min-height: 360px; border-radius: var(--radius-card); background: var(--color-ink); color: var(--color-texto-inverso); }
.article-hero.cover-novidades:not(.has-image) { color: var(--color-ink); }
.article-hero-img { position: absolute; inset: 0; width: var(--size-full); height: var(--size-full); max-width: none; object-fit: cover; z-index: 0; }
.article-hero.has-image::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(11, 14, 12, 0.88) 0%, rgba(11, 14, 12, 0.55) 45%, rgba(11, 14, 12, 0.15) 100%); }
.article-hero-content { position: relative; z-index: 2; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-7); max-width: calc(var(--article-max) + var(--space-7) * 2); }
.chatpro-theme .article-hero .article-heading { color: inherit; }
.article-hero .meta { color: inherit; opacity: 0.9; }
.article-hero .meta-sep { background: currentColor; opacity: 0.5; }
.article-hero .level-bar { background: currentColor; opacity: 0.35; }
.article-hero .level-bar.is-on { opacity: 1; }
@media (max-width: 1099px) {
  .article-hero { aspect-ratio: 16 / 9; }
  .article-hero-content { padding: var(--space-6); }
}
@media (max-width: 699px) {
  .article-page { padding-top: var(--space-4); }
  .article-hero-wrap { margin-bottom: var(--space-6); padding-left: var(--space-3); padding-right: var(--space-3); }
  .article-hero { aspect-ratio: auto; min-height: 420px; }
  .article-hero-content { padding: var(--space-5); gap: var(--space-3); }
}

/* Materiais com imagem de capa: só a imagem */
.material-cover.has-image, .material-book.has-image { position: relative; padding: 0; overflow: hidden; }
.material-cover-img, .material-book-img { position: absolute; inset: 0; width: var(--size-full); height: var(--size-full); max-width: none; object-fit: cover; }
@media (max-width: 699px) {
  .material-book.has-image { width: 60%; max-width: 240px; aspect-ratio: 3 / 4; align-self: center; }
  .material-cover.has-image { min-height: 88px; }
}
.article-hero.has-image .tag-tutoriais, .article-hero.cover-tutoriais .tag-tutoriais { background: var(--color-branco); color: var(--color-ink); }

/* =========================================================
   CORREÇÕES 1
   ========================================================= */
/* #3 Botão "Conheça a plataforma": contorno verde principal; hover preenchido */
.chatpro-theme .button-outline-green,
.chatpro-theme .button-outline-aura { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); padding: var(--button-pad-y) var(--button-pad-x); border: var(--border-strong) solid; border-radius: var(--radius-none); background: transparent; font-family: var(--font-texto); font-size: var(--text-md); font-weight: var(--weight-bold); line-height: var(--leading-snug); text-decoration: none; white-space: nowrap; cursor: pointer; transition: background var(--speed), color var(--speed), border-color var(--speed); }
.chatpro-theme .button-outline-green { border-color: var(--color-verde); color: var(--color-verde); }
.chatpro-theme .button-outline-green:hover, .chatpro-theme .button-outline-green:focus-visible { background: var(--color-verde); border-color: var(--color-verde); color: var(--color-texto-inverso); }
/* #4 Botão "Falar no WhatsApp" (rodapé): contorno verde aura; hover preenchido com texto preto */
.chatpro-theme .button-outline-aura { border-color: var(--color-verde-3); color: var(--color-verde-3); }
.chatpro-theme .button-outline-aura:hover, .chatpro-theme .button-outline-aura:focus-visible { background: var(--color-verde-3); border-color: var(--color-verde-3); color: var(--color-ink); }
.footer-actions .button-outline-aura { padding: var(--button-lg-pad-y) var(--button-lg-pad-x); font-size: var(--text-lg); }
.mobile-list .button-outline-green { width: var(--size-full); }
@media (max-width: 699px) {
  .footer-actions .button-outline-aura { width: var(--size-full); }
}

/* #7 Botão de play: menor, vermelho, triângulo preenchido; mantém o aumento no hover */
.live-play { width: var(--badge-md); height: var(--badge-md); background: var(--color-youtube); color: var(--color-branco); }
.live-play .icon { width: var(--icon-md); height: var(--icon-md); margin-left: 3px; }
@media (max-width: 699px) {
  .live-play { width: var(--badge-sm); height: var(--badge-sm); }
  .live-play .icon { width: var(--icon-sm); height: var(--icon-sm); }
}

/* #9 Redes sociais: hover preenchido na cor de cada rede, ícone preenchido branco */
.social-link .icon-fill { display: none; }
.social-link:hover .icon-line, .social-link:focus-visible .icon-line { display: none; }
.social-link:hover .icon-fill, .social-link:focus-visible .icon-fill { display: block; }
.chatpro-theme .social-link:hover, .chatpro-theme .social-link:focus-visible { color: var(--color-branco); }
.social-link.social-instagram:hover, .social-link.social-instagram:focus-visible { background: radial-gradient(circle at 30% 107%, #FDF497 0%, #FD5949 45%, #D6249F 60%, #285AEB 90%); border-color: #D6249F; }
.social-link.social-youtube:hover, .social-link.social-youtube:focus-visible { background: var(--color-youtube); border-color: var(--color-youtube); }
.social-link.social-linkedin:hover, .social-link.social-linkedin:focus-visible { background: #0A66C2; border-color: #0A66C2; }
.social-link.social-facebook:hover, .social-link.social-facebook:focus-visible { background: #1877F2; border-color: #1877F2; }

/* #12 "Seções": sem linha embaixo (ativo e hover); hover verde como os links com seta */
.chatpro-theme .nav-link,
.chatpro-theme .nav-link:hover,
.chatpro-theme .nav-link.is-active,
.chatpro-theme .nav-link[aria-current="page"] { border-bottom-color: transparent; font-weight: var(--weight-regular); }
.chatpro-theme .nav-link:hover, .chatpro-theme .nav-link:focus-visible, .chatpro-theme .nav-link[aria-expanded="true"] { color: var(--color-verde-2); }

/* #13 Links com seta: sem sublinhado em todo o blog */
.chatpro-theme .link-arrow, .chatpro-theme .link-arrow:hover { text-decoration: none; }

/* #15 Novidades: miniatura com imagem no lugar do ícone */
.news-item .news-thumb { width: var(--thumb-w); height: var(--thumb-h); }
@media (max-width: 1099px) {
  .news-item .news-thumb { width: 160px; height: 100px; }
}
@media (max-width: 699px) {
  .news-item .news-thumb { width: var(--thumb-w); height: var(--thumb-h); }
}

/* #18 Cards de seção: sobe e aproxima no hover; "Abrir seção" fica verde */
.card-section { transition: transform var(--speed), box-shadow var(--speed); }
.card-section:hover, .card-section:focus-visible { transform: translateY(calc(var(--space-1) * -1)) scale(1.03); }
.chatpro-theme .card-section:hover .card-foot-link, .chatpro-theme .card-section:focus-visible .card-foot-link { color: var(--color-verde); }
.card-foot-link { transition: color var(--speed); }
@media (max-width: 699px) {
  .news-item .news-thumb .icon-badge { display: flex; width: var(--badge-sm); height: var(--badge-sm); }
}
