/* ============================================================
   Anglo Lauro — Notícias
   Listagem (/noticias/) e notícia individual (/noticias/<slug>).
   Depende de tokens.css e site.css (cabeçalho, rodapé, .btn,
   .stripes, .photo-slot, .validar já vivem lá).

   Regras do design system respeitadas aqui:
   canto reto sempre · sem sombra · sem blur · módulos que se tocam
   com 2px de fresta · textura diagonal 45° só sobre azul e roxo ·
   duas famílias apenas (Obviously Condensed no display, Lufga no resto).
   ============================================================ */

/* ============================================================
   CAPA DA SEÇÃO — vale para as duas páginas
   ============================================================ */
.nt-capa{background:var(--campaign-blue-dark);color:#fff}
.nt-capa__inner{
  display:flex;flex-direction:column;gap:16px;
  padding-top:clamp(36px,5vw,72px);padding-bottom:clamp(28px,4vw,56px);
}
.nt-capa__kicker{
  font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--campaign-yellow);
}
.nt-capa__titulo{
  padding-top:.22em;
  font-family:var(--font-display);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(56px,10vw,132px);line-height:.84;letter-spacing:var(--ls-display);
}
/* "Acontece no Anglo." tem o dobro dos caracteres de "Notícias." — no tamanho
   cheio do display ele atravessaria a faixa. Corpo menor, mesma presença. */
.nt-capa__titulo--longo{font-size:clamp(38px,6.6vw,92px);max-width:14ch}

.nt-capa__lead{
  font-size:clamp(16px,1.4vw,20px);line-height:1.55;max-width:52ch;
  color:var(--text-on-blue-dark);
}

/* ============================================================
   BARRA DE EDITORIAS
   ============================================================ */
.nt-editorias{background:var(--campaign-charcoal);color:#fff}
.nt-editorias__inner{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:clamp(12px,2.4vw,28px);
  padding-top:clamp(14px,2vw,20px);padding-bottom:clamp(14px,2vw,20px);
  font-size:14px;font-weight:600;
}
.nt-editorias__rotulo{
  color:#b9b6ae;font-size:12px;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
}
.nt-editorias span[data-editoria]{display:flex;align-items:center;gap:8px}
.nt-editorias i{width:12px;height:12px;display:block}
.nt-editorias i.ed-vida-escolar{background:var(--campaign-yellow)}

/* Cores por editoria — a mesma cor identifica a editoria em toda a seção */
.ed-conquistas{background:var(--campaign-coral);color:#fff}
.ed-eventos{background:var(--campaign-blue-light);color:#fff}
.ed-projetos{background:var(--campaign-purple);color:#fff}
.ed-vida-escolar{background:var(--campaign-charcoal);color:var(--campaign-yellow)}

/* ============================================================
   ETIQUETA DE EDITORIA — canto superior esquerdo da foto
   ============================================================ */
.nt-tag{
  position:absolute;left:0;top:0;
  font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:7px 11px;
}
.nt-tag--g{font-size:12px;padding:9px 14px}
/* Duas classes (0-2-0) para vencer o `.photo-slot span` do site.css, que
   pintaria o texto da etiqueta da cor da legenda do bloco listrado. */
.nt-tag.ed-conquistas,.nt-tag.ed-eventos,.nt-tag.ed-projetos{color:#fff}
.nt-tag.ed-vida-escolar{color:var(--campaign-yellow)}
.nt-tag{font-family:var(--font-core);max-width:none}

/* ============================================================
   DESTAQUE
   ============================================================ */
.nt-destaque-wrap{padding-top:clamp(28px,4vw,56px);padding-bottom:clamp(20px,3vw,32px)}
.nt-destaque{
  display:grid;grid-template-columns:1.15fr 1fr;gap:var(--module-gap);
  color:inherit;
}
.nt-destaque:hover{opacity:.94;color:inherit}
.nt-destaque__foto{
  position:relative;min-height:clamp(300px,34vw,440px);overflow:hidden;
}
/* Só pinta de roxo quando há foto: com o bloco listrado, quem manda é o
   .photo-slot--* (senão o roxo chapado cobre a textura da campanha). */
.nt-destaque__foto:not(.photo-slot){background:var(--campaign-purple-kv)}
.nt-destaque__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.nt-destaque__copy{
  background:var(--campaign-purple-kv);color:#fff;
  padding:clamp(24px,3vw,40px);
  display:flex;flex-direction:column;gap:16px;justify-content:center;
}
.nt-destaque__meta{font-size:13px;font-weight:600;color:var(--campaign-yellow)}
.nt-destaque__titulo{
  font-family:var(--font-display);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(32px,3.8vw,58px);line-height:.88;letter-spacing:var(--ls-display);
  text-wrap:balance;
}
.nt-destaque__chamada{font-size:clamp(15.5px,1.3vw,18px);line-height:1.6;color:#e6e2ff;text-wrap:pretty}
.nt-destaque__link{font-weight:700;font-size:16px;color:var(--campaign-yellow)}

/* ============================================================
   GRADE
   ============================================================ */
.nt-lista{
  display:flex;flex-direction:column;gap:clamp(20px,2.6vw,32px);
  padding-top:clamp(16px,2vw,24px);padding-bottom:clamp(48px,6vw,88px);
}
.nt-lista__head{
  display:flex;align-items:baseline;gap:16px;
  border-bottom:3px solid var(--campaign-purple-kv);padding-bottom:12px;
}
.nt-lista__head h2{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(26px,3vw,40px);line-height:1;letter-spacing:var(--ls-display);
  color:var(--campaign-purple-kv);
}
.nt-lista__head span{font-size:13px;color:var(--text-muted)}

.nt-grade{display:grid;gap:var(--module-gap);grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}

.nt-card{background:#fff;display:flex;flex-direction:column}
.nt-card__media{position:relative;height:200px;overflow:hidden}
.nt-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.nt-card__corpo{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.nt-card__data{font-size:13px;color:var(--text-muted);font-weight:500}
.nt-card__titulo{font-size:20px;font-weight:700;line-height:1.25;color:var(--campaign-purple-kv);text-wrap:pretty}
.nt-card__titulo a{color:inherit}
.nt-card__titulo a:hover{color:var(--campaign-coral)}
.nt-card__chamada{font-size:15px;line-height:1.6;text-wrap:pretty}
.nt-card__segmento{
  margin-top:auto;padding-top:10px;
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--campaign-blue);
}

.nt-lista__rodape{
  display:flex;flex-wrap:wrap;gap:12px;
  align-items:center;justify-content:space-between;padding-top:8px;
}

/* ============================================================
   ESTADOS — carregando, vazio e erro
   ============================================================ */
.nt-estado{
  background:#fff;padding:clamp(28px,4vw,48px);
  display:flex;flex-direction:column;gap:12px;align-items:flex-start;
  border-left:6px solid var(--campaign-blue-light);
}
.nt-estado h3{font-size:20px;font-weight:700;color:var(--campaign-purple-kv)}
.nt-estado p{font-size:16px;line-height:1.6;max-width:54ch}
.nt-estado--erro{border-left-color:var(--campaign-coral)}

/* Esqueleto de carregamento: bloco chapado, sem animação chamativa */
.nt-esqueleto{background:#fff;display:flex;flex-direction:column}
.nt-esqueleto__media{height:200px;background:rgba(44,34,123,.08)}
.nt-esqueleto__linha{height:14px;background:rgba(44,34,123,.08);margin:0 22px}
.nt-esqueleto__linha:first-of-type{margin-top:22px;width:38%}
.nt-esqueleto__linha:nth-of-type(2){margin-top:14px;height:22px;width:86%}
.nt-esqueleto__linha:nth-of-type(3){margin-top:14px;width:96%}
.nt-esqueleto__linha:last-of-type{margin-bottom:28px;width:64%;margin-top:8px}
@media(prefers-reduced-motion:no-preference){
  .nt-esqueleto__media,.nt-esqueleto__linha{animation:nt-pulso 1.4s var(--ease-block) infinite}
}
@keyframes nt-pulso{0%,100%{opacity:1}50%{opacity:.55}}

/* ============================================================
   NOTÍCIA — capa e cabeçalho
   ============================================================ */
.nt-artigo-capa .nt-capa__inner{
  max-width:940px;gap:clamp(16px,2vw,22px);
  padding-top:clamp(24px,3vw,40px);padding-bottom:clamp(32px,4vw,56px);
}
.nt-migalhas{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:#a9c4dd}
.nt-migalhas a{color:#a9c4dd}
.nt-migalhas a:hover{color:#fff}
.nt-migalhas [aria-current]{color:#fff}
.nt-etiquetas{display:flex;flex-wrap:wrap;gap:var(--module-gap);align-items:stretch}
.nt-etiquetas span{
  font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:9px 14px;
}
.nt-etiquetas .nt-etiqueta--segmento{background:var(--campaign-yellow);color:var(--campaign-purple-kv)}
.nt-artigo__titulo{
  padding-top:.18em;
  font-family:var(--font-display);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(40px,6.4vw,92px);line-height:.86;letter-spacing:var(--ls-display);
  text-wrap:balance;
}
.nt-artigo__lead{
  font-size:clamp(17px,1.6vw,22px);line-height:1.5;max-width:48ch;
  color:var(--text-on-blue-dark);text-wrap:pretty;
}
.nt-artigo__data{font-size:14px;color:#a9c4dd}

.nt-artigo__cover{position:relative;height:clamp(240px,38vw,540px);overflow:hidden}
.nt-artigo__cover:not(.photo-slot){background:var(--campaign-purple-kv)}
.nt-artigo__cover.photo-slot{height:clamp(160px,22vw,300px)}
.nt-artigo__cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nt-artigo__cover figcaption{
  position:absolute;left:0;bottom:0;max-width:52ch;
  background:rgba(38,38,38,.86);color:#fff;
  font-size:13px;line-height:1.5;padding:12px 16px;
}

/* ============================================================
   NOTÍCIA — corpo editorial
   ============================================================ */
.nt-corpo{
  max-width:760px;margin:0 auto;
  padding:clamp(36px,5vw,72px) var(--pad-x);
  display:flex;flex-direction:column;gap:24px;
  font-size:clamp(16.5px,1.4vw,19px);line-height:1.7;
}
.nt-corpo p{text-wrap:pretty}
.nt-corpo h2{
  margin-top:8px;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(26px,3vw,38px);line-height:1;letter-spacing:var(--ls-display);
  color:var(--campaign-purple-kv);
}
.nt-corpo h3{font-size:clamp(20px,2vw,24px);font-weight:700;line-height:1.25;color:var(--campaign-purple-kv);margin-top:4px}
.nt-corpo a{text-decoration:underline;text-underline-offset:3px}
.nt-corpo ul,.nt-corpo ol{display:grid;gap:var(--module-gap);list-style:none;padding:0}
.nt-corpo li{background:#fff;padding:16px 20px;border-left:6px solid var(--campaign-blue-light)}
.nt-corpo li:nth-child(2){border-left-color:var(--campaign-blue)}
.nt-corpo li:nth-child(3){border-left-color:var(--campaign-purple)}
.nt-corpo li:nth-child(4){border-left-color:var(--campaign-coral)}
.nt-corpo li:nth-child(5){border-left-color:var(--campaign-blue-dark)}
.nt-corpo ol{counter-reset:nt}
.nt-corpo ol li{counter-increment:nt;display:flex;gap:14px;align-items:baseline}
.nt-corpo ol li::before{
  content:counter(nt);font-family:var(--font-display);font-weight:900;font-style:italic;
  font-size:26px;line-height:1;color:var(--campaign-blue);
}

.nt-citacao{
  background:var(--campaign-purple-kv);color:#fff;
  padding:clamp(24px,3vw,36px);
  display:flex;flex-direction:column;gap:14px;
}
.nt-citacao p{font-size:clamp(18px,1.7vw,23px);line-height:1.45}
.nt-citacao footer{font-size:14px;line-height:1.6;color:#c9c2ef}

.nt-numeros{display:grid;gap:var(--module-gap);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.nt-numeros div{background:#fff;padding:20px;display:flex;flex-direction:column;gap:6px}
.nt-numeros b{font-family:var(--font-display);font-weight:900;font-style:italic;font-size:46px;line-height:.85;color:var(--campaign-coral)}
.nt-numeros div:nth-child(2) b{color:var(--campaign-blue)}
.nt-numeros div:nth-child(3) b{color:var(--campaign-purple)}
.nt-numeros span{font-size:14px;line-height:1.5}

.nt-figura{display:flex;flex-direction:column;gap:8px}
.nt-figura img{width:100%;height:auto;display:block}
.nt-figura figcaption{font-size:14px;line-height:1.5;color:var(--text-muted)}

.nt-galeria{display:grid;gap:var(--module-gap);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-top:8px}
.nt-galeria figure{margin:0;position:relative;height:180px;overflow:hidden}
.nt-galeria img{width:100%;height:100%;object-fit:cover;display:block}

/* ============================================================
   COMPARTILHAR
   ============================================================ */
.nt-share{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  border-top:3px solid var(--campaign-purple-kv);padding-top:22px;margin-top:8px;
}
.nt-share__rotulo{
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--campaign-purple-kv);margin-right:6px;
}
.nt-share .btn--ghost-purple{min-height:48px;font-size:15px;padding:0 20px}

/* ============================================================
   RELACIONADAS
   ============================================================ */
.nt-relacionadas{background:#fff}
.nt-relacionadas__inner{display:flex;flex-direction:column;gap:clamp(20px,2.6vw,32px)}
.nt-relacionadas h2{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(26px,3vw,42px);line-height:1;letter-spacing:var(--ls-display);
  color:var(--campaign-purple-kv);
  border-bottom:3px solid var(--campaign-purple-kv);padding-bottom:12px;
}
.nt-relacionadas .btn{align-self:flex-start}
.nt-relacionadas .nt-grade{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.nt-relacionadas .nt-card{background:var(--campaign-cream)}
.nt-relacionadas .nt-card__media{height:170px}
.nt-relacionadas .nt-card__corpo{padding:20px;gap:8px}
.nt-relacionadas .nt-card__titulo{font-size:18px;line-height:1.3}

/* ============================================================
   FAIXA DE MATRÍCULAS
   ============================================================ */
.nt-faixa{background:var(--campaign-purple-kv);color:#fff}
.nt-faixa__inner{
  display:grid;gap:clamp(24px,4vw,48px);
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:center;
  padding-top:clamp(40px,5vw,80px);padding-bottom:clamp(40px,5vw,80px);
}
.nt-faixa__copy{display:flex;flex-direction:column;gap:16px}
.nt-faixa__selo{
  align-self:flex-start;background:var(--campaign-yellow);color:var(--campaign-purple-kv);
  font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;padding:9px 14px;
}
.nt-faixa__titulo{
  font-family:var(--font-display);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(34px,4.8vw,68px);line-height:.88;letter-spacing:var(--ls-display);text-wrap:balance;
}
.nt-faixa__copy p{font-size:clamp(16px,1.4vw,19px);line-height:1.6;max-width:44ch;color:#e6e2ff}
.nt-faixa__acoes{display:flex;flex-wrap:wrap;gap:12px}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media(max-width:900px){
  .nt-destaque{grid-template-columns:1fr}
  .nt-destaque__foto{min-height:280px}
}
@media(max-width:560px){
  .nt-grade{grid-template-columns:1fr}
  .nt-lista__head{flex-direction:column;align-items:flex-start;gap:6px}
  .nt-lista__rodape .btn{width:100%}
  .nt-editorias__inner{gap:10px 18px;font-size:13px}
}

/* Botões dentro do corpo editorial não levam sublinhado de link. */
.nt-corpo a.btn{text-decoration:none}
