/* ===========================================================
   umlitrodeazeite — estilos compartilhados
   Títulos: Libre Bodoni · Textos: Barlow (Google Fonts)
   Os valores do layout (fontes, tamanhos, cores) estão na
   parte 1. Os componentes novos de usabilidade estão na parte 2.
   =========================================================== */

:root {
  --amarelo: #F2E111;     /* medido no layout */
  --laranja: #F15B05;     /* medido no layout */
  --verde: #04BE89;       /* tag "passeie" — medido no layout */
  --verde-id: #038C73;    /* datas e subtítulos (verde da ID visual) — medido no layout */
  --azul-id: #079ABC;     /* asterisco do menu — medido no layout */
  --preto: #000000;
  --texto: #1d1d1d;
  --branco: #ffffff;
  --rodape: #161616;

  --container: 1080px;
  --gap: 18px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
html.sem-scroll { overflow: hidden; }

body {
  background: var(--branco);
  color: var(--texto);
  font-family: "Barlow", sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
:focus-visible { outline: 2px solid var(--verde-id); outline-offset: 3px; }

.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 16px;
}

/* ===========================================================
   PARTE 1 — LAYOUT DO CLIENTE
   =========================================================== */

/* ---------- Header ---------- */
.site-header { padding: 58px 0 34px; }
.site-header .container {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.logo {
  position: relative;
  display: inline-block;
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: 34px;
  letter-spacing: -0.5px;
  color: var(--preto);
  line-height: 1;
  padding-bottom: 6px;
}
.logo .logo-txt { position: relative; z-index: 2; }
.logo .logo-blob {
  position: absolute;
  z-index: 1;
  right: -14px;
  top: -40px;
  width: 108px;
  height: 104px;
  background: var(--amarelo);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

/* Menu — correção do cliente: Barlow Bold, separador "|",
   sublinhado amarelo ondulado ao passar o mouse */
.main-nav {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: var(--preto);
  padding-bottom: 4px;
}
.main-nav a {
  position: relative;
  padding: 4px 0;
  text-decoration: underline wavy transparent;
  text-decoration-thickness: 2px;
  text-underline-offset: 9px;
  transition: text-decoration-color .2s;
}
.main-nav a:hover,
.main-nav a.is-active { text-decoration-color: var(--amarelo); }
.main-nav .nav-sep { font-weight: 700; line-height: 1; transform: translateY(-1px); }

/* ---------- Imagens estáticas (série, banner, matéria) ---------- */
.serie-player, .banner-media, .materia-media {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #000;
}
.serie-player .poster, .materia-media img, .banner-media img {
  width: 100%;
  aspect-ratio: 748 / 381;
  object-fit: cover;
}
.banner-media img { aspect-ratio: 1086 / 605; }

/* ---------- Tags ----------
   Aplicadas automaticamente pela categoria da matéria.
   Correção do cliente: a palavra ocupa todo o espaço da mancha. */
.card-capa, .materia-media { container-type: inline-size; }
.tag {
  position: absolute;
  z-index: 4;
  top: 2%;
  right: 2%;
  width: 26%;
  aspect-ratio: 370 / 357;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 4%;
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: 5.5cqw;
  line-height: 1;
  letter-spacing: -.02em;
  pointer-events: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.tag-aprenda { background: var(--amarelo); color: var(--preto); }
.tag-cozinhe { background: var(--laranja); color: var(--branco); }
.tag-passeie { background: var(--verde);   color: var(--preto); }

/* ---------- Série ---------- */
.serie { margin-bottom: 30px; }
.serie-titulo {
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: 19px;
  color: var(--preto);
  margin: 10px 0 2px 2px;
}

/* ---------- Grid ---------- */
.grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px var(--gap);
}
.card-titulo {
  font-family: "Barlow", sans-serif;
  font-weight: 700;        /* layout: "Os títulos das matérias são em Barlow bold" */
  font-size: 22px;          /* correção do cliente: chamadas em 22 */
  line-height: 1.2;
  color: var(--preto);
  margin-top: 12px;
}
.card-data {
  display: block;
  font-size: 10.5px;
  color: var(--verde-id);
  margin-top: 2px;
}

/* ---------- Banner ---------- */
.banner { margin-top: 44px; }

/* ---------- Texto corrido ---------- */
.texto { font-size: 11.6px; line-height: 1.42; color: var(--texto); }
.banner .texto { margin-top: 16px; }
.texto-sandro { font-size: 22px; line-height: 1.45; }   /* correção do cliente: tamanho 22 */
.texto-sandro p + p { margin-top: .5em; }
.texto-sandro strong { font-weight: 700; color: var(--preto); }

/* ---------- Na imprensa ----------
   Logos padronizados num retângulo; cada um pode ter link externo.
   A lista fica em js/data.js (IMPRENSA). */
.parceiros { padding: 80px 0 70px; }
.imprensa {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.imprensa li { flex: 0 0 158px; }
.imprensa-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 17 / 9;          /* retângulo padrão: 170 × 90 */
  padding: 14px 16px;
  border-radius: 6px;
  transition: background-color .2s, transform .2s;
}
.imprensa-item img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
a.imprensa-item:hover { background: #f4f4f4; transform: translateY(-2px); }
@media (max-width: 520px) { .imprensa li { flex-basis: calc(50% - 8px); } }

/* ---------- Matéria ---------- */
.materia-head { text-align: center; margin: 12px 0 30px; }
.materia-data { font-size: 10.5px; color: var(--verde-id); }
.materia-titulo {
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: 25px;
  line-height: 1.2;
  color: var(--preto);
  max-width: 560px;
  margin: 6px auto 0;
}
.materia-media .tag { width: 15%; top: 4%; right: 2%; font-size: 3.15cqw; }
.materia-corpo { margin-top: 20px; }
.materia-sub {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-size: 11.6px;
  text-transform: uppercase;
  letter-spacing: -0.1px;
  color: var(--verde-id);
  margin-top: 16px;
}
.relacionadas { margin-top: 26px; }

/* ===========================================================
   PARTE 2 — USABILIDADE
   =========================================================== */

/* ---------- Player da série (topo da home) ---------- */
.serie-player .poster { transition: opacity .3s; }
.serie-video { position: absolute; inset: 0; z-index: 3; }
.serie-video iframe { width: 100%; height: 100%; border: 0; display: block; }
.serie-player:not(.is-playing) .serie-video { display: none; }

.serie-play {                       /* capa clicável antes de tocar */
  position: absolute; inset: 0;
  z-index: 2;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(to top, rgba(0,0,0,.45), rgba(0,0,0,0) 45%);
}
.serie-play-btn {
  width: 84px; height: 84px;
  border-radius: 50%;
  background: var(--amarelo);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  transition: transform .2s;
}
.serie-play-btn svg { width: 34px; height: 34px; fill: var(--preto); margin-left: 5px; }
.serie-play:hover .serie-play-btn { transform: scale(1.08); }
.serie-play-rotulo {
  position: absolute;
  left: 20px; bottom: 16px;
  font-size: 15px; font-weight: 600;
  color: #fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.6);
}
.serie-player.is-playing .serie-play { display: none; }

/* linha abaixo do player: título + episódios + setas */
.serie-linha { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.serie-setas { display: flex; gap: 6px; flex: none; padding-bottom: 2px; }
.serie-seta {
  width: 30px; height: 30px;
  border: 1px solid #d0d0d0;
  border-radius: 50%;
  font-size: 16px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: border-color .2s, color .2s, background-color .2s;
}
.serie-seta:hover:not(:disabled) { border-color: var(--verde-id); color: var(--verde-id); }
.serie-seta:disabled { opacity: .3; cursor: default; }

.serie-eps {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 15px;
  color: var(--preto);
  margin-left: 4px;
}
.serie-eps .ep {
  display: inline-flex;
  align-items: center;
  padding: 3px 0;
  font-size: 15px;
  transition: color .2s;
}
.serie-eps .ep + .ep::before { content: "|"; color: var(--preto); padding: 0 9px; }
.serie-eps .ep-ico {
  display: inline-flex; width: 0; overflow: hidden; opacity: 0;
  transition: width .2s, opacity .2s, margin .2s;
}
.serie-eps .ep-ico svg { width: 11px; height: 11px; fill: currentColor; }
.serie-eps .ep:hover, .serie-eps .ep.is-atual { color: var(--verde-id); }
.serie-eps .ep.is-atual { font-weight: 600; }
.serie-eps .ep:hover .ep-ico,
.serie-eps .ep.is-atual .ep-ico { width: 11px; opacity: 1; margin-right: 3px; }
.serie-eps .ep.is-visto { color: #8a8a8a; }
.serie-eps .ep.is-visto:hover { color: var(--verde-id); }

/* ---------- Série: episódios ainda não lançados ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.serie-eps .ep.is-breve { color: #9b9b9b; }
.serie-eps .ep.is-breve .ep-ico { width: 10px; opacity: .75; margin-right: 3px; }
.serie-eps .ep.is-breve .ep-ico svg { width: 10px; height: 10px; }
.serie-eps .ep.is-breve:hover, .serie-eps .ep.is-breve.is-atual { color: var(--verde-id); }
.serie-eps .ep.is-proximo { color: var(--preto); }
.serie-eps .ep.is-proximo .ep-txt { background: linear-gradient(transparent 58%, var(--amarelo) 58%, var(--amarelo) 92%, transparent 92%); padding: 0 2px; }

/* ---------- Tela "Em breve" dentro do player ---------- */
.serie-player.is-breve .poster { display: none; }
.serie-player.is-breve .serie-video { position: relative; }
.breve {
  --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E");
  position: relative;
  isolation: isolate;
  aspect-ratio: 748 / 381;          /* mesma proporção da foto; cresce se o texto pedir */
  display: flex; flex-direction: column;
  padding: clamp(20px, 3.6vw, 42px) clamp(18px, 4.4vw, 52px) clamp(16px, 2.6vw, 28px);
  background: #0e0e0b;
  color: #fff;
  animation: breve-entra .5s ease both;
}
.breve-fundo {
  position: absolute; inset: -4%;
  z-index: -2;
  background: center / cover no-repeat;
  filter: grayscale(.55) brightness(.34) blur(1.5px);
  animation: breve-zoom 26s ease-in-out infinite alternate;
}
.breve::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(60% 90% at 18% 50%, rgba(242,225,17,.16), transparent 70%),
    linear-gradient(90deg, rgba(0,0,0,.25), rgba(0,0,0,.55));
}
.breve-grade {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.7fr);
  gap: clamp(18px, 4vw, 48px);
  align-items: center;
}
.breve-selo { position: relative; width: 100%; max-width: 270px; aspect-ratio: 370 / 357; justify-self: center; }
.breve-mancha {
  position: absolute; inset: 0;
  background: var(--amarelo);
  -webkit-mask: var(--m) center / 100% 100% no-repeat;
          mask: var(--m) center / 100% 100% no-repeat;
  animation: breve-respira 7s ease-in-out infinite;
  box-shadow: 0 0 0 1px transparent;
}
.breve-num {
  position: relative;
  height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding-top: 6%;
  color: var(--preto);
  font-family: "Libre Bodoni", serif;
}
.breve-num small {
  font-family: "Barlow", sans-serif;
  font-weight: 600; font-size: clamp(11px, 1.3vw, 15px);
  letter-spacing: .22em; text-transform: uppercase;
  margin-bottom: .2em;
}
.breve-num b { font-weight: 700; font-size: clamp(58px, 10.5vw, 128px); line-height: .82; letter-spacing: -.045em; }
.breve-num .breve-palavra { font-size: clamp(22px, 3.6vw, 40px); letter-spacing: -.02em; }

.breve-kicker {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: var(--amarelo);
}
.breve-serie { color: rgba(255,255,255,.6); }
.breve-serie::before { content: "·"; margin-right: 8px; color: rgba(255,255,255,.4); }
.breve-pulso {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--amarelo);
  box-shadow: 0 0 0 0 rgba(242,225,17,.6);
  animation: breve-pulso 1.8s ease-out infinite;
}
.breve-titulo {
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: clamp(24px, 3.3vw, 40px);
  line-height: 1.08;
  letter-spacing: -.01em;
  margin: 10px 0 10px;
  text-wrap: balance;
}
.breve-chamada { font-size: clamp(15px, 1.6vw, 18px); line-height: 1.45; color: rgba(255,255,255,.82); max-width: 46ch; }

.breve-relogio { display: flex; gap: 8px; margin: 20px 0 8px; }
.breve-relogio div {
  min-width: 66px;
  padding: 10px 8px 8px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-radius: 6px;
  text-align: center;
  overflow: hidden;
}
.breve-relogio b {
  display: block;
  font-family: "Libre Bodoni", serif; font-weight: 700;
  font-size: clamp(24px, 2.7vw, 32px); line-height: 1.05;
  font-variant-numeric: tabular-nums;
}
.breve-relogio b.vira { animation: breve-vira .35s ease; }
.breve-relogio div:last-child b { color: var(--amarelo); }
.breve-relogio span { display: block; margin-top: 2px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.breve-data-linha { font-size: 14px; color: rgba(255,255,255,.72); }
.breve-data-linha::first-letter { text-transform: uppercase; }
.breve-data {
  display: inline-flex; flex-direction: column;
  margin: 20px 0 4px;
  padding-left: 12px;
  border-left: 3px solid var(--amarelo);
}
.breve-data span { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.breve-data strong { font-family: "Libre Bodoni", serif; font-size: 22px; font-weight: 700; }

.breve-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.breve-btn {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0 18px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 999px;
  font-size: 15px; font-weight: 600; color: #fff;
  transition: background-color .2s, border-color .2s, color .2s, transform .2s;
}
.breve-btn svg { width: 18px; height: 18px; flex: none; }
.breve-btn svg path[d^="M8 5"] { fill: currentColor; }
.breve-btn:hover { border-color: var(--amarelo); color: var(--amarelo); }
.breve-btn-forte { background: var(--amarelo); border-color: var(--amarelo); color: var(--preto); }
.breve-btn-forte:hover { background: #fff; border-color: #fff; color: var(--preto); transform: translateY(-1px); }
.breve-btn-forte:hover svg { animation: breve-sino .6s ease; transform-origin: 50% 10%; }

.breve-progresso {
  position: relative;
  display: flex; align-items: center; gap: 14px;
  margin-top: clamp(14px, 2.4vw, 24px);
  font-size: 13px; color: rgba(255,255,255,.7);
  white-space: nowrap;
}
.breve-progresso b { color: var(--amarelo); font-weight: 700; }
.breve-progresso ol { flex: 1; display: flex; gap: 4px; list-style: none; }
.breve-progresso li { flex: 1; height: 4px; border-radius: 2px; background: rgba(255,255,255,.16); }
.breve-progresso li.is-no-ar { background: var(--amarelo); }
.breve-progresso li.is-este { background: rgba(255,255,255,.75); animation: breve-pisca 1.6s ease-in-out infinite; }

@keyframes breve-entra { from { opacity: 0; } to { opacity: 1; } }
@keyframes breve-zoom { from { transform: scale(1); } to { transform: scale(1.08) translateX(-1.5%); } }
@keyframes breve-respira { 0%, 100% { transform: scale(1) rotate(-2deg); } 50% { transform: scale(1.035) rotate(2deg); } }
@keyframes breve-pulso { 0% { box-shadow: 0 0 0 0 rgba(242,225,17,.6); } 100% { box-shadow: 0 0 0 10px rgba(242,225,17,0); } }
@keyframes breve-vira { from { transform: translateY(-40%); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes breve-pisca { 50% { opacity: .35; } }
@keyframes breve-sino { 20% { transform: rotate(14deg); } 40% { transform: rotate(-12deg); } 60% { transform: rotate(8deg); } 80% { transform: rotate(-4deg); } }

@media (max-width: 720px) {
  .breve { padding: 22px 18px 16px; }
  .breve-grade { grid-template-columns: 1fr; gap: 14px; align-items: start; }
  .breve-selo { max-width: 104px; justify-self: start; }
  .breve-num b { font-size: 48px; }
  .breve-num small { font-size: 10px; }
  .breve-kicker { font-size: 11px; }
  .breve-relogio { gap: 6px; margin-top: 16px; }
  .breve-relogio div { flex: 1; min-width: 0; padding: 8px 4px 6px; }
  .breve-relogio b { font-size: 22px; }
  .breve-relogio span { font-size: 10px; letter-spacing: .08em; }
  .breve-acoes { margin-top: 16px; }
  .breve-btn { flex: 1 1 auto; justify-content: center; font-size: 14px; }
  .breve-progresso { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .breve, .breve-fundo, .breve-mancha, .breve-pulso, .breve-relogio b.vira, .breve-progresso li.is-este, .breve-btn-forte:hover svg { animation: none; }
}

/* ---------- Card de notícia (capa) ---------- */
.card-link { display: block; }
.card-capa {
  position: relative;
  aspect-ratio: 240 / 198;
  overflow: hidden;
  background: #222;
}
.card-capa img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.card-link:hover .card-capa img { transform: scale(1.04); }
.card-link:hover .card-titulo { color: var(--verde-id); }
.card-resumo { font-size: 13px; line-height: 1.4; color: #555; margin-top: 6px; }

.ver-todas { display: flex; justify-content: flex-end; margin-top: 22px; }
.link-seta { font-size: 15px; font-weight: 600; color: var(--verde-id); }
.link-seta:hover { text-decoration: underline; }

/* ---------- Páginas de lista (Notícias / categorias) ---------- */
.lista-head { text-align: center; margin: 12px 0 30px; }
.lista-blob {
  display: inline-flex; align-items: center; justify-content: center;
  width: 150px; height: 140px;
  margin: 4px 0 12px;
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: 26px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.lista-desc { font-size: 15px; color: #444; margin-top: 6px; }
.lista-qtd { display: block; font-size: 10.5px; color: var(--verde-id); margin-top: 6px; }
.abas { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: -6px 0 30px; }
.abas button {
  padding: 7px 16px;
  border: 1px solid #d9d9d9;
  border-radius: 999px;
  font-size: 14px;
  transition: border-color .2s, background-color .2s, color .2s;
}
.abas button:hover { border-color: var(--verde-id); color: var(--verde-id); }
.abas button.is-active { background: var(--preto); border-color: var(--preto); color: #fff; }
.abas button[data-aba="aprenda"].is-active { background: var(--amarelo); border-color: var(--amarelo); color: var(--preto); }
.abas button[data-aba="cozinhe"].is-active { background: var(--laranja); border-color: var(--laranja); color: #fff; }
.abas button[data-aba="passeie"].is-active { background: var(--verde); border-color: var(--verde); color: var(--preto); }
.outras-cats { text-align: center; margin-top: 44px; font-size: 14px; color: #555; }
.outras-cats a { font-weight: 600; color: var(--verde-id); margin: 0 6px; }
.outras-cats a:hover { text-decoration: underline; }
.mais-wrap { text-align: center; margin-top: 36px; }
.btn-mais {
  padding: 11px 26px;
  border: 1px solid var(--preto);
  border-radius: 999px;
  font-size: 14px; font-weight: 600;
  transition: background-color .2s, color .2s;
}
.btn-mais:hover { background: var(--preto); color: #fff; }
.btn-mais[hidden] { display: none; }
.vazio { grid-column: 1 / -1; text-align: center; color: #777; padding: 40px 0; }

/* ---------- Matéria ---------- */
.migalha { font-size: 12px; color: #777; margin-bottom: 6px; }
.migalha a { color: var(--verde-id); }
.migalha a:hover { text-decoration: underline; }
#m-cat { text-transform: capitalize; }
.bloco-titulo { margin-top: 34px; }
.m-nav {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
  margin-top: 34px; padding-top: 22px;
  border-top: 1px solid #e6e6e6;
}
.m-nav-item {
  display: block;
  font-family: "Libre Bodoni", serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.3;
  color: var(--preto);
}
.m-nav-item span {
  display: block;
  font-family: "Barlow", sans-serif;
  font-weight: 600;
  font-size: 12px;
  color: var(--verde-id);
  margin-bottom: 4px;
}
.m-nav-item:hover { color: var(--verde-id); }
.m-nav-prox { text-align: right; }

/* ---------- Rodapé (amarelo e preto) ---------- */
.site-footer {
  background: var(--amarelo);
  color: var(--preto);
  font-size: 14px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1.3fr;
  gap: 40px;
  padding: 64px 16px 48px;
}
.site-footer .logo { font-size: 30px; color: var(--preto); }
.site-footer .logo .logo-blob { display: none; }
.site-footer .logo .az { position: relative; color: var(--amarelo); }
.site-footer .logo .az::before {              /* mancha branca atrás de "azeite" (correção do cliente) */
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%; top: 50%;
  width: 108px;
  aspect-ratio: 370 / 357;
  transform: translate(-41%, -58%);
  background: var(--branco);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 370 357' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M208.9 6.0 L221.0 6.6 L233.0 8.4 L244.8 11.1 L256.4 14.9 L267.7 19.5 L278.6 25.1 L289.1 31.4 L299.2 38.5 L308.7 46.2 L317.6 54.7 L326.0 63.7 L333.6 73.3 L340.5 83.4 L346.6 94.0 L351.9 105.0 L356.2 116.4 L359.6 128.0 L361.9 139.9 L363.3 151.9 L363.6 164.0 L362.8 176.1 L361.1 188.2 L358.5 200.1 L355.0 211.8 L350.6 223.4 L345.5 234.6 L339.7 245.5 L333.2 256.1 L326.1 266.3 L318.5 276.1 L310.4 285.5 L301.7 294.3 L292.6 302.7 L283.0 310.5 L273.0 317.8 L262.5 324.4 L251.7 330.3 L240.6 335.6 L229.1 340.2 L217.4 344.1 L205.4 347.3 L193.3 349.8 L181.0 351.7 L168.7 352.9 L156.3 353.3 L143.9 353.1 L131.5 352.1 L119.3 350.4 L107.2 347.9 L95.4 344.6 L83.9 340.4 L72.9 335.4 L62.4 329.5 L52.5 322.6 L43.3 314.9 L35.0 306.4 L27.6 297.0 L21.2 287.0 L15.8 276.4 L11.4 265.2 L8.1 253.7 L5.8 241.8 L4.6 229.7 L4.3 217.5 L4.9 205.2 L6.4 193.0 L8.6 180.8 L11.7 168.8 L15.4 157.0 L19.9 145.5 L25.1 134.3 L30.9 123.4 L37.4 112.8 L44.4 102.7 L52.0 92.9 L60.1 83.5 L68.7 74.4 L77.7 65.8 L87.0 57.5 L96.7 49.6 L106.8 42.2 L117.1 35.2 L127.8 28.8 L138.8 23.0 L150.0 17.9 L161.4 13.6 L173.1 10.2 L184.9 7.8 L196.9 6.4Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.footer-sobre { margin-top: 26px; line-height: 1.55; max-width: 300px; }
.footer-titulo {
  font-size: 12px; font-weight: 700;
  letter-spacing: 1.5px; text-transform: uppercase;
  margin-bottom: 16px;
}
.footer-links { list-style: none; display: grid; gap: 9px; }
.footer-links a { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; transition: text-decoration-color .2s; }
.footer-links a:hover { text-decoration-color: currentColor; }
.footer-contato a { display: inline-flex; align-items: center; gap: 10px; }
.footer-contato svg { width: 18px; height: 18px; flex: none; }
.footer-base { border-top: 1px solid rgba(0,0,0,.18); }
.footer-base .container {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;
  padding-top: 18px; padding-bottom: 18px;
  font-size: 12px;
}
.fziz { display: block; height: 22px; width: auto; color: var(--preto); }
.fziz-link { display: block; flex: none; transition: opacity .2s; }
.fziz-link:hover { opacity: .6; }

/* ===========================================================
   RESPONSIVO
   =========================================================== */
@media (max-width: 820px) {
  .site-header .container { flex-direction: column; align-items: flex-start; gap: 34px; }
  .main-nav { font-size: 20px; }
  .grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  .site-header { padding-top: 50px; }
  .logo { font-size: 28px; }
  .logo .logo-blob { width: 90px; height: 86px; top: -34px; }
  .main-nav { font-size: 17px; gap: 10px; }
  .card-titulo { font-size: 20px; }
  .texto-sandro { font-size: 18px; }
  .grid { grid-template-columns: 1fr; }
  .serie-linha { align-items: flex-start; }
  .serie-eps { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
  .serie-eps::-webkit-scrollbar { display: none; }
  .serie-eps .ep { flex: none; font-size: 14px; }
  .serie-play-btn { width: 60px; height: 60px; }
  .serie-play-btn svg { width: 26px; height: 26px; }
  .serie-play-rotulo { left: 12px; bottom: 10px; font-size: 13px; }
  .materia-titulo { font-size: 21px; }
  .m-nav { grid-template-columns: 1fr; }
  .m-nav-prox { text-align: left; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
}


/* ===========================================================
   MATÉRIA — leitura confortável (correção do cliente)
   Coluna estreita, letra grande e bastante respiro,
   como nas referências (Olive Oil Professor / New Yorker).
   =========================================================== */
.materia-corpo.texto {
  max-width: 720px;
  margin: 44px auto 0;
  font-size: 20px;
  line-height: 1.7;
  color: #1a1a1a;
}
.materia-corpo p { margin: 0 0 1.1em; }
.materia-corpo .materia-sub {
  font-size: 15px;
  letter-spacing: 1.2px;
  margin: 2em 0 .8em;
}
.m-figura { margin: 2em 0; }
.m-figura img { width: 100%; height: auto; display: block; }
.m-figura figcaption { margin-top: 10px; font-size: 14px; line-height: 1.45; color: #666; }
.m-legenda { display: block; }
.m-credito {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #888;
}
@media (min-width: 900px) {      /* imagem um pouco mais larga que o texto, como na referência */
  .m-figura { margin-left: -60px; margin-right: -60px; }
}
body[data-page="materia"] .materia-titulo { max-width: 760px; font-size: 38px; line-height: 1.15; }
body[data-page="materia"] .materia-data { font-size: 13px; }
@media (max-width: 520px) { body[data-page="materia"] .materia-titulo { font-size: 27px; } }
@media (max-width: 520px) {
  .materia-corpo.texto { font-size: 18px; margin-top: 30px; }
}

/* ===========================================================
   PARTE 3 — conteúdo vindo do painel (PHP)
   =========================================================== */
/* subtítulos, listas, citações e links dentro da matéria */
.materia-corpo h2, .materia-corpo h3, .materia-corpo h4 {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--verde-id);
  margin: 2em 0 .8em;
}
.materia-corpo a { color: var(--verde-id); text-decoration: underline; text-underline-offset: 3px; }
.materia-corpo ul, .materia-corpo ol { margin: 0 0 1.1em 1.3em; }
.materia-corpo li { margin-bottom: .35em; }
.materia-corpo blockquote {
  margin: 1.6em 0;
  padding-left: 22px;
  border-left: 4px solid var(--amarelo);
  font-family: "Libre Bodoni", serif;
  font-size: 1.15em;
  line-height: 1.5;
}
.materia-corpo img { max-width: 100%; height: auto; }
.materia-corpo .m-figura figcaption .m-credito { display: block; }

/* vídeo do YouTube no meio da matéria */
.m-video { position: relative; aspect-ratio: 16 / 9; margin: 2em 0; background: #000; }
.m-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (min-width: 900px) { .m-video { margin-left: -60px; margin-right: -60px; } }

/* paginação das categorias */
.paginacao { display: flex; justify-content: center; align-items: center; gap: 18px; margin-top: 40px; flex-wrap: wrap; }
.paginacao .btn-mais { display: inline-block; }
.paginacao-info { font-size: 13px; color: #777; }

/* aviso de pré-visualização (rascunho) */
.aviso-preview {
  margin: 0 0 20px;
  padding: 12px 16px;
  background: #fff7c2;
  border: 1px solid #e8d65a;
  border-radius: 6px;
  font-size: 14px;
}
.aviso-preview a { font-weight: 600; text-decoration: underline; }
h1.lista-blob { margin-top: 4px; }