/* /conteudos — hub editorial. Conceito: índice de revista.
   Ritmo: hero tipográfico (título largo, frase-conceito no rodapé do hero) → índice das sete trilhas (branco, linhas finas,
   cada trilha leva à página de produto relacionada) → publicados (só dados reais; vazio = nota editorial discreta)
   → fechamento escuro com "Conhecer a plataforma". Sem motion decorativo. */

/* ---------- Hero ---------- */
.ct-hero{padding-block:clamp(48px,6vw,104px) clamp(56px,6vw,96px)}
.ct-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:28px clamp(40px,6vw,96px);align-items:end}
.ct-eyebrow{grid-column:1 / -1}
.ct-h1{grid-column:1 / -1;max-width:21ch}
.ct-hero-side{grid-column:2;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.ct-hero-side .lead{max-width:36ch}
.ct-kicker{grid-column:1;grid-row:3;align-self:end;font-size:var(--fs-label);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);font-weight:500;padding-top:18px;border-top:1px solid var(--line-2);max-width:40ch}
@media (max-width:900px){
  .ct-hero-grid{grid-template-columns:minmax(0,1fr)}
  .ct-hero-side{grid-column:1}
  .ct-kicker{grid-row:auto;margin-top:16px}
}

/* ---------- Cabeçalho de seção ---------- */
.ct-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px clamp(40px,6vw,96px);align-items:end;margin-bottom:var(--space-head)}
.ct-head .eyebrow{display:block}
@media (max-width:900px){.ct-head{grid-template-columns:minmax(0,1fr);align-items:start}}

/* ---------- Índice de trilhas ---------- */
.ct-index{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.ct-track{display:grid;grid-template-columns:72px minmax(0,1fr) minmax(0,1.15fr) 220px;gap:8px 32px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--line-2)}
.ct-n{font-family:var(--f-ui);font-size:12.5px;font-weight:500;color:var(--ink-3);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.ct-track-t{font-size:clamp(1.3rem,1.05rem + .8vw,1.85rem);line-height:1.2;letter-spacing:-.022em}
.ct-track-d{color:var(--ink-2);max-width:46ch}
.ct-track-l{justify-self:end;font-size:.9rem;min-height:36px;align-items:center}
.ct-track-l:not(:hover){color:var(--ink-2)}
@media (max-width:1080px){
  .ct-track{grid-template-columns:56px minmax(0,1fr) auto;row-gap:10px}
  .ct-track-d{grid-column:2 / 3}
  .ct-track-l{grid-column:3;grid-row:1}
}
@media (max-width:640px){
  .ct-track{grid-template-columns:40px minmax(0,1fr);padding:24px 0}
  .ct-track-d{grid-column:2}
  .ct-track-l{grid-column:2;grid-row:auto;justify-self:start}
}

/* ---------- Publicados ---------- */
.ct-pub{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr);gap:24px clamp(40px,6vw,96px);align-items:start}
.ct-pub-head{display:flex;flex-direction:column;gap:14px}
.ct-empty{display:flex;flex-direction:column;gap:8px;padding:28px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.ct-empty-t{font-size:1.15rem;letter-spacing:-.012em}
.ct-empty-d{color:var(--ink-2);max-width:54ch}
@media (max-width:900px){.ct-pub{grid-template-columns:minmax(0,1fr)}}

/* Itens reais (renderizados pelo JS a partir de content/blog) */
.ct-feature{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding-bottom:32px;border-bottom:1px solid var(--line-2);text-decoration:none}
.ct-feature.has-cover{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:32px}
.ct-feature img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:16px;background:#E6E6EA}
.ct-feature-t{font-size:var(--fs-h3);line-height:1.2;letter-spacing:-.02em}
.ct-cat{font-size:var(--fs-label);letter-spacing:.09em;text-transform:uppercase;color:var(--blue-text);font-weight:500}
.ct-meta{font-family:var(--f-ui);font-size:12.5px;color:var(--ink-3)}
.ct-sum{color:var(--ink-2);max-width:60ch}
.ct-list{list-style:none;margin:0;padding:0}
.ct-list li a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;padding:20px 0;border-bottom:1px solid var(--line-2);text-decoration:none}
.ct-list .ct-cat{grid-column:1 / -1}
.ct-list-t{font-size:1.1rem;letter-spacing:-.012em;line-height:1.35}
.ct-feature:hover .ct-feature-t,.ct-list a:hover .ct-list-t{color:var(--blue-text)}
.ct-more{margin-top:28px}
@media (max-width:640px){.ct-feature.has-cover{grid-template-columns:minmax(0,1fr)}.ct-list li a{grid-template-columns:minmax(0,1fr)}}

/* ---------- Fechamento ---------- */
.ct-close-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:32px clamp(40px,6vw,96px);align-items:end}
.ct-close-side{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
@media (max-width:900px){.ct-close-grid{grid-template-columns:minmax(0,1fr);align-items:start}}
.ct-pub-sec{padding-block:clamp(64px,4rem + 3vw,120px)}

/* ================= MOBILE (≤720) — desktop/tablet intocados =================
   Hub escaneável: hero curto; sete trilhas como índice editorial compacto (número | nome, descrição e link na mesma
   coluna, sem cards); nomes das trilhas completos, descrição só mais compacta; link com alvo de toque ≥ 44px. */
@media (max-width:720px){
  .ct-hero{padding-block:40px 48px}
  .ct-hero-grid{row-gap:20px}
  .ct-hero-side{gap:20px}
  .ct-kicker{margin-top:8px;padding-top:14px}
  .ct-head{row-gap:16px}
  .ct-track{grid-template-columns:32px minmax(0,1fr);row-gap:4px;column-gap:8px;padding:18px 0 10px}
  .ct-track-t{font-size:1.22rem}
  .ct-track-d{font-size:.95rem;line-height:1.5}
  .ct-track-l{min-height:44px;font-size:.88rem}
  .ct-pub-sec{padding-block:var(--space-section)}
  .ct-empty{padding:22px 0}
  .ct-feature{padding-bottom:24px}
  .ct-list li a{padding:16px 0}
}
