/* ============================================================
   B9 — ALÉM DO FEED · sistema visual premium (escopo .tag-alemdofeed)
   Edição da newsletter B9+ na web. Carrega depois de b9-article.css.
   O conteúdo é montado no editor (Koenig); as classes .adfe-sec--*
   são aplicadas por b9-alemdofeed.js (marca H2/H3 por texto).
   Cor de divisória quente: --adfe-rule.
   ============================================================ */
.tag-alemdofeed { --adfe-rule: #E0DACE; --adfe-paper: #F6F3EC; }

/* ── largura de leitura confortável (não ocupa a tela toda) ── */
.tag-alemdofeed .art-head__inner,
.tag-alemdofeed .prose { max-width: 720px; }
.tag-alemdofeed .art-media-wide { max-width: 860px; margin-left: auto; margin-right: auto; }

/* ── título + dek com hierarquia de newsletter ── */
.tag-alemdofeed .art-title {
  font-size: clamp(34px, 4.4vw, 60px); line-height: 1.04; letter-spacing: -0.028em; max-width: 16ch;
}
.tag-alemdofeed .art-dek {
  font-family: var(--serif); font-style: italic; color: var(--fg-soft);
  font-size: clamp(19px, 1.7vw, 24px); line-height: 1.5; max-width: 46ch;
}
/* eyebrow funcional: label vermelho + secundário cinza */
.tag-alemdofeed .adfe-eyebrow { color: var(--red); }
.tag-alemdofeed .art-kicker .art-date { color: var(--fg-muted); }

/* ── autor: "por" em serif italic vermelho + nome ── */
.tag-alemdofeed .art-byline__by { font-family: var(--serif); font-style: italic; color: var(--red); }
.tag-alemdofeed .art-byline__name { font-weight: 700; }

/* ── corpo: drop-cap SÓ no 1º parágrafo real (nunca em lista/heading/box) ── */
.tag-alemdofeed .prose > p:first-child::first-letter,
.tag-alemdofeed .prose > p.has-dropcap::first-letter {
  float: left; font-family: var(--display); font-weight: 800;
  font-size: 4.6em; line-height: 0.82; padding: 6px 12px 0 0; color: var(--ink);
}
/* desliga drop-cap se o 1º bloco não for parágrafo (segurança extra) */
.tag-alemdofeed .prose > *:first-child:not(p)::first-letter { font: inherit; float: none; }

/* ── headings internos: H2 = capítulo, H3 = mini-editoria ── */
.tag-alemdofeed .prose h2 {
  font-family: var(--display); font-weight: 800; letter-spacing: -0.02em;
  font-size: clamp(26px, 2.6vw, 36px); line-height: 1.1; color: var(--ink);
  margin: clamp(40px, 5vw, 64px) 0 16px; padding-top: clamp(22px, 2.6vw, 30px);
  border-top: 1px solid var(--adfe-rule); position: relative;
}
.tag-alemdofeed .prose h2::before {
  content: ""; position: absolute; top: -1px; left: 0; width: 46px; height: 3px; background: var(--red);
}
.tag-alemdofeed .prose h3 {
  font-family: var(--mono); font-weight: 700; font-size: 13px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--red); margin: clamp(26px,3vw,34px) 0 8px;
}

/* ── blockquote = frase/tese da edição ── */
.tag-alemdofeed .prose blockquote {
  font-family: var(--serif); font-style: italic; font-weight: 500;
  font-size: clamp(23px, 2.4vw, 32px); line-height: 1.34; color: var(--ink);
  margin: clamp(34px,4vw,52px) 0; padding: 4px 0 4px 26px; border-left: 3px solid var(--red); max-width: 30ch;
}
.tag-alemdofeed .prose blockquote p { margin: 0; }

/* ── divisórias discretas (quente, sem vermelho) ── */
.tag-alemdofeed .prose hr { border: 0; height: 1px; background: var(--adfe-rule); margin: clamp(34px,4vw,52px) 0; }

/* ── imagens: retas (sem rounded), respiro, legenda discreta ── */
.tag-alemdofeed .prose img,
.tag-alemdofeed .prose figure img { border-radius: 0; display: block; }
.tag-alemdofeed .prose figure { margin: clamp(28px,3.4vw,44px) 0; }
.tag-alemdofeed .prose figcaption {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.04em; color: var(--fg-muted);
  margin-top: 10px; text-align: left;
}

/* ============================================================
   BLOCOS ESPECIAIS — marcados por b9-alemdofeed.js a partir do texto
   do heading (H2/H3). Envolvem o heading + o conteúdo até o próximo H2.
   ============================================================ */

/* "Nessa edição" — índice de abertura, elegante (off-white + borda) */
.tag-alemdofeed .adfe-index {
  background: var(--adfe-paper); border: 1px solid var(--adfe-rule);
  padding: clamp(22px, 2.8vw, 32px) clamp(24px,3vw,36px); margin: 0 0 clamp(34px,4vw,48px);
}
.tag-alemdofeed .adfe-index > h2 {
  border: 0; padding: 0; margin: 0 0 16px; font-family: var(--mono); font-weight: 700;
  font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink);
}
.tag-alemdofeed .adfe-index > h2::before { display: none; }
.tag-alemdofeed .adfe-index ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.tag-alemdofeed .adfe-index li {
  position: relative; padding-left: 24px; font-family: var(--serif); font-size: 17px; line-height: 1.4; color: var(--ink);
}
.tag-alemdofeed .adfe-index li::before {
  content: ""; position: absolute; left: 0; top: 9px; width: 11px; height: 8px;
  background: var(--red); clip-path: polygon(0 0, 100% 0, 72% 100%, 0 100%);
}

/* "Por que importa" — box off-white com topo preto */
.tag-alemdofeed .adfe-sec--importa {
  background: var(--adfe-paper); border-top: 3px solid var(--ink);
  padding: clamp(24px,3vw,34px) clamp(24px,3vw,36px); margin: clamp(34px,4vw,52px) 0;
}
.tag-alemdofeed .adfe-sec--importa > h2,
.tag-alemdofeed .adfe-sec--real > h2 {
  margin-top: 0; padding-top: 0; border-top: 0; font-size: clamp(15px,1.5vw,18px);
  font-family: var(--mono); font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
}
.tag-alemdofeed .adfe-sec--importa > h2::before { display: none; }
.tag-alemdofeed .adfe-sec--importa > h2 { color: var(--ink); }

/* "A real" — fechamento crítico, topo vermelho + título vermelho */
.tag-alemdofeed .adfe-sec--real {
  background: var(--adfe-paper); border-top: 3px solid var(--red);
  padding: clamp(24px,3vw,34px) clamp(24px,3vw,36px); margin: clamp(34px,4vw,52px) 0;
}
.tag-alemdofeed .adfe-sec--real > h2 { color: var(--red); }
.tag-alemdofeed .adfe-sec--real > h2::before { display: none; }

/* "Também passou pelo feed" — curadoria editorial em bloco escuro.
   Sem amarelo (reservado a botões/B9+): labels em vermelho, lead branco,
   texto #E8E2D8, links vermelhos sublinhados, itens bem espaçados. */
.tag-alemdofeed .adfe-sec--feed {
  background: #11100E; color: #E8E2D8; margin: clamp(40px,5vw,64px) 0;
  padding: clamp(30px,3.6vw,48px) clamp(24px,3vw,40px);
}
.tag-alemdofeed .adfe-sec--feed > h2 {
  color: #fff; border-top: 0; padding-top: 0; margin: 0 0 clamp(18px,2.2vw,26px);
  font-family: var(--mono); font-weight: 700; font-size: 13px; letter-spacing: 0.22em; text-transform: uppercase;
}
.tag-alemdofeed .adfe-sec--feed > h2::before { display: none; }
.tag-alemdofeed .adfe-sec--feed h3 {
  color: var(--red); margin: clamp(30px,3.4vw,44px) 0 7px;
  font-family: var(--mono); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
}
.tag-alemdofeed .adfe-sec--feed h3::before { display: none; }
.tag-alemdofeed .adfe-sec--feed p {
  color: #E8E2D8; font-family: var(--serif); font-size: clamp(17px,1.5vw,19px); line-height: 1.52; margin: 0;
}
.tag-alemdofeed .adfe-sec--feed p strong,
.tag-alemdofeed .adfe-sec--feed p b { color: #fff; font-weight: 700; }
.tag-alemdofeed .adfe-sec--feed a { color: var(--red); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.tag-alemdofeed .adfe-sec--feed a:hover { color: #fff; }
.tag-alemdofeed .adfe-sec--feed hr { background: rgba(255,255,255,0.12); }

/* ============================================================
   CTA FINAL + ARQUIVO + ASSINATURA (no partial, .adfe-foot-*)
   ============================================================ */
.tag-alemdofeed .adfe-cta {
  background: var(--ink); color: #F4F1EA; text-align: left;
  padding: clamp(34px,4vw,52px); margin: clamp(40px,5vw,64px) 0 0; max-width: 720px;
}
.tag-alemdofeed .adfe-cta__title { font-family: var(--display); font-weight: 800; font-size: clamp(24px,2.6vw,34px); line-height: 1.08; margin: 0 0 10px; color: #fff; }
.tag-alemdofeed .adfe-cta__text { font-family: var(--serif); color: rgba(255,255,255,0.78); margin: 0 0 22px; max-width: 46ch; }
.tag-alemdofeed .adfe-cta__row { display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: center; }
.tag-alemdofeed .adfe-btn {
  display: inline-flex; align-items: center; gap: 9px; font-family: var(--mono); font-weight: 700;
  font-size: 13px; letter-spacing: 0.04em; background: var(--yellow); color: #1a1505;
  padding: 13px 22px; text-decoration: none; transition: background .16s, transform .16s;
}
.tag-alemdofeed .adfe-btn:hover { background: var(--yellow-deep, #F2D200); transform: translateY(-1px); }
.tag-alemdofeed .adfe-link { font-family: var(--mono); font-size: 12.5px; font-weight: 700; color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,0.4); padding-bottom: 2px; }
.tag-alemdofeed .adfe-link:hover { color: var(--yellow); border-color: var(--yellow); }

/* assinatura editorial (carta) */
.tag-alemdofeed .adfe-sign { margin: clamp(36px,4vw,52px) 0 0; max-width: 720px; }
.tag-alemdofeed .adfe-sign__name { font-family: var(--display); font-weight: 700; font-size: 20px; color: var(--ink); margin: 0; }
.tag-alemdofeed .adfe-sign__role { font-family: var(--serif); font-style: italic; color: var(--fg-soft); margin: 4px 0 0; }

/* arquivo de edições — linguagem editorial */
.tag-alemdofeed .adfe-arch { border-top: 1px solid var(--adfe-rule); margin: clamp(40px,5vw,64px) 0 0; padding-top: clamp(28px,3vw,40px); max-width: 720px; }
.tag-alemdofeed .adfe-arch__title { font-family: var(--display); font-weight: 700; font-size: clamp(22px,2.2vw,28px); margin: 0 0 8px; color: var(--ink); }
.tag-alemdofeed .adfe-arch__text { font-family: var(--serif); color: var(--fg-soft); margin: 0 0 20px; }

/* ── MOBILE ── */
@media (max-width: 767px) {
  .tag-alemdofeed .art-title { font-size: clamp(28px, 8vw, 38px); }
  .tag-alemdofeed .prose > p:first-child::first-letter,
  .tag-alemdofeed .prose > p.has-dropcap::first-letter { font-size: 3.8em; padding-right: 9px; }
  .tag-alemdofeed .adfe-cta__row { gap: 12px; }
  .tag-alemdofeed .adfe-btn { width: 100%; justify-content: center; }
  .tag-alemdofeed .prose blockquote { font-size: 21px; }
}
