/* ══════════════════════════════════════════════════════════════════
   portal-cidade.css — Capa do portal editorial da cidade (v1.5 Fase B "capricho")
   Bento adaptativo + cor por seção (estilo Guardian, dose editorial).
   Usa as variáveis do design system (style.css); só adiciona o que é do portal.
   ══════════════════════════════════════════════════════════════════ */
:root{
  --pc-bg:#FAF7F2;
  --pc-card:#FFFFFF;
  --pc-ink:#221D2E;
  --pc-ink-2:#6E6680;
  --pc-linha:#EFEAE2;
  --pc-radius:18px;
  --pc-sombra:0 1px 2px rgba(34,29,46,.05),0 6px 18px rgba(34,29,46,.06);
  --pc-sombra-hover:0 2px 4px rgba(34,29,46,.07),0 14px 34px rgba(34,29,46,.12);
  /* Cores por seção: acento forte + tinta pastel */
  --c-cidade:#7C3AED;      --t-cidade:#F3EEFE;
  --c-esporte:#0E9F6E;     --t-esporte:#E6F7F0;
  --c-cultura:#DB2777;     --t-cultura:#FDEEF6;
  --c-economia:#0E7490;    --t-economia:#E7F5F8;
  --c-eventos:#D97706;     --t-eventos:#FEF3E2;
  --c-comunicados:#2563EB; --t-comunicados:#EBF1FE;
}

/* A capa do portal pinta o fundo da página inteira */
body.pagina-portal-cidade{background:var(--pc-bg)}
.portal-cidade{color:var(--pc-ink);font-family:inherit}
.portal-cidade a{text-decoration:none;color:inherit}
.portal-cidade img{display:block;max-width:100%}
.portal-cidade .container{max-width:1200px;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}


/* ── Faixa principal do portal: "PORTAL DE {cidade}" · data · hora · clima ── */
.pc-barra-cidade{display:flex;align-items:center;justify-content:space-between;gap:.75rem 1.5rem;flex-wrap:wrap;
  padding:1rem 0 .7rem}
.pc-bc-marca{margin:0;font-size:1.15rem;font-weight:800;letter-spacing:.02em;
  display:flex;align-items:center;gap:.5rem;text-transform:none}
.pc-bc-marca-link{display:inline-flex;align-items:center;gap:.45rem;color:var(--pc-ink-2)}
.pc-bc-marca-link:hover{color:var(--pc-ink)}
.pc-bc-marca-link i{color:var(--c-cidade);font-size:1.05rem}
.pc-bc-marca strong{color:var(--pc-ink);font-weight:800;letter-spacing:.01em}
.pc-bc-uf{font-size:.7rem;font-weight:800;color:#fff;background:var(--c-cidade);border-radius:6px;padding:.12rem .4rem;letter-spacing:.03em}
.pc-bc-info{display:flex;align-items:center;gap:.55rem;font-size:.92rem;font-weight:700;color:var(--pc-ink);flex-wrap:wrap}
.pc-bc-data{color:var(--pc-ink-2);font-weight:600}
.pc-bc-sep{color:var(--pc-linha);font-weight:400}
.pc-bc-relogio{font-variant-numeric:tabular-nums;letter-spacing:.02em}
.pc-bc-clima{display:inline-flex;align-items:center;gap:.35rem;color:var(--pc-ink)}
.pc-bc-clima i{color:#d97706}
.pc-bc-clima.indisponivel{display:none}
@media(max-width:600px){
  .pc-bc-marca{font-size:1rem}
  .pc-bc-info{font-size:.85rem;width:100%}
  .pc-bc-data{display:none} /* no celular, data por extenso some; fica hora+temp */
}

/* Separador abaixo das barras do topo */
.pc-hr{border:0;border-top:1px solid var(--pc-linha);margin:.2rem 0 1.2rem}

/* h1 da página de categoria: invisível na tela, presente para SEO/acessibilidade */
.pc-secao-h1-seo{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ── Barra de categorias (navegação por seção, cor por seção) ── */
.pc-barra-cat{margin:.6rem 0 .2rem;position:relative}
.pc-barra-cat-row{display:flex;gap:.35rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:2px}
.pc-barra-cat-row::-webkit-scrollbar{display:none}
.pc-cat-item{flex:0 0 auto;font-size:.92rem;font-weight:700;padding:.5rem .95rem;border-radius:999px;
  color:var(--pc-ink);white-space:nowrap;transition:background .15s,color .15s;position:relative}
/* Hover SÓ nos itens não-ativos (o ativo já tem cor de fundo própria) */
.pc-cat-item:not(.ativo):hover{background:var(--cat,var(--pc-ink));color:#fff}
.pc-cat-item.ativo{box-shadow:var(--pc-sombra)}
.pc-cat-tudo.ativo{background:var(--pc-ink);color:#fff}

/* ── Grid bento ── */
.pc-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:20px;padding-bottom:1rem}
.pc-card{background:var(--pc-card);border-radius:var(--pc-radius);box-shadow:var(--pc-sombra);overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease;display:flex;flex-direction:column}
a.pc-card:hover{transform:translateY(-3px);box-shadow:var(--pc-sombra-hover)}

/* kicker de seção */
.pc-kicker{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;display:inline-flex;align-items:center;gap:.4rem}
.pc-kicker i{width:.5rem;height:.5rem;border-radius:50%}

/* Manchete */
.pc-manchete{grid-column:span 8}
.pc-manchete .pc-foto{flex:1;min-height:360px;background-size:cover;background-position:center;position:relative}
.pc-manchete .pc-foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(20,14,35,.78))}
.pc-manchete .pc-sobre{position:absolute;left:0;right:0;bottom:0;padding:1.4rem;color:#fff;z-index:1}
.pc-manchete .pc-pill{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#fff;
  padding:.28rem .7rem;border-radius:999px;margin-bottom:.6rem;display:inline-flex;align-items:center;gap:.4rem}
.pc-manchete .pc-pill i{width:.5rem;height:.5rem;border-radius:50%;background:#fff}
.pc-manchete h2{font-size:clamp(1.35rem,2.6vw,2.05rem);font-weight:800;line-height:1.15;letter-spacing:-.02em;
  text-shadow:0 2px 14px rgba(0,0,0,.45);margin:0}
.pc-manchete .pc-lf{padding:1rem 1.4rem 1.25rem;color:var(--pc-ink-2);font-size:1rem;line-height:1.5;display:flex;flex-direction:column;gap:.5rem}
.pc-manchete .pc-meta{font-size:.8rem;color:var(--pc-ink-2)}
/* Sem foto: manchete tipográfica com fundo tingido da seção */
.pc-manchete.sem-foto{background:var(--tt,#F3EEFE);padding:1.75rem}
.pc-manchete.sem-foto h2{color:var(--pc-ink);text-shadow:none;margin:.5rem 0}
.pc-manchete.sem-foto .pc-lf{padding:0}

/* Coluna Últimas */
/* A coluna acompanha a altura da manchete (mesma linha do grid) e rola por
   dentro se um dia passar — nunca estica o card ao lado. */
.pc-ultimas{grid-column:span 4;padding:1.15rem 1.25rem;align-self:stretch;min-height:0;
  display:flex;flex-direction:column}
.pc-ultimas ol{overflow-y:auto;min-height:0;scrollbar-width:thin}
.pc-mod-titulo{font-size:.95rem;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:.5rem;margin-bottom:.35rem}
.pc-ultimas ol{list-style:none;padding:0;margin:0}
.pc-ultimas li{padding:.72rem 0;border-bottom:1px solid var(--pc-linha)}
.pc-ultimas li:last-child{border-bottom:none}
.pc-ultimas .pc-kicker{margin-bottom:.2rem}
.pc-ultimas h4{font-size:.92rem;font-weight:700;line-height:1.3;margin:0}
.pc-ultimas time{font-size:.74rem;color:var(--pc-ink-2)}

/* Destaques / cards com foto */
.pc-destaque{grid-column:span 4}
.pc-destaque .pc-foto{aspect-ratio:16/9;background-size:cover;background-position:center}
.pc-destaque .pc-txt{padding:.95rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.pc-destaque h3{font-size:1.02rem;font-weight:800;line-height:1.28;letter-spacing:-.015em;margin:0}
.pc-destaque p{font-size:.85rem;color:var(--pc-ink-2);line-height:1.45;margin:0}
.pc-destaque time{font-size:.74rem;color:var(--pc-ink-2);margin-top:auto}
/* Card de destaque sem foto: fundo tingido da seção */
.pc-destaque.sem-foto{background:var(--tt,#F3EEFE)}
.pc-destaque.sem-foto .pc-txt{padding:1.1rem 1.15rem 1.2rem}

/* Card horizontal (seção/destaque com 1 matéria só) */
.pc-horiz{grid-column:span 12;display:grid;grid-template-columns:5fr 7fr}
.pc-horiz .pc-foto{min-height:210px;background-size:cover;background-position:center}
.pc-horiz .pc-txt{padding:1.3rem 1.5rem;display:flex;flex-direction:column;gap:.5rem}
.pc-horiz h3{font-size:1.25rem;font-weight:800;line-height:1.25;letter-spacing:-.015em;margin:0}
.pc-horiz p{font-size:.92rem;color:var(--pc-ink-2);line-height:1.5;margin:0}
.pc-horiz time{font-size:.76rem;color:var(--pc-ink-2);margin-top:auto}
.pc-horiz.sem-foto{grid-template-columns:1fr;background:var(--tt,#F3EEFE)}

/* Faixa de seção */
.pc-secao-head{grid-column:span 12;display:flex;align-items:center;gap:.7rem;margin-top:.4rem}
.pc-secao-head .pc-barra{width:2.2rem;height:.45rem;border-radius:999px}
.pc-secao-head h2{font-size:1.25rem;font-weight:800;letter-spacing:-.02em;text-transform:capitalize;margin:0}
.pc-secao-head a{margin-left:auto;font-size:.82rem;font-weight:700}

/* ── Vitrines comerciais ── */
.pc-vitrine{grid-column:span 4;padding:1.15rem 1.25rem 1.3rem}
.pc-selo-demo{font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:#EEE9FB;
  color:var(--c-cidade);border-radius:999px;padding:.2rem .55rem;margin-left:auto}
.pc-prod-linha,.pc-emp-linha{display:flex;gap:.85rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--pc-linha)}
.pc-prod-linha:last-of-type,.pc-emp-linha:last-of-type{border-bottom:none}
.pc-prod-thumb{width:52px;height:52px;border-radius:12px;flex-shrink:0;background-size:cover;background-position:center;
  display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.pc-prod-nome,.pc-emp-nome{font-size:.88rem;font-weight:700;line-height:1.25}
.pc-prod-loja,.pc-emp-cat{font-size:.74rem;color:var(--pc-ink-2)}
.pc-prod-preco{margin-left:auto;font-weight:800;color:var(--c-cidade);font-size:.92rem;white-space:nowrap;text-align:right}
.pc-prod-de{font-size:.72rem;color:var(--pc-ink-2);text-decoration:line-through;font-weight:600}
.pc-emp-logo{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--c-cidade),var(--c-cultura));
  color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0;background-size:cover}
.pc-emp-nota{margin-left:auto;font-size:.8rem;font-weight:700;color:#B98A00;white-space:nowrap}
.pc-cta{display:inline-block;margin-top:.9rem;font-size:.83rem;font-weight:700;color:var(--c-cidade)}
.pc-vitrine.anuncie{background:linear-gradient(135deg,#1d1430,#3b2364);justify-content:center}
.pc-vitrine.anuncie .pc-mod-titulo,.pc-vitrine.anuncie h3{color:#fff}
.pc-vitrine.anuncie p{color:#CFC8E0;font-size:.85rem;line-height:1.5;margin:0}
.pc-vitrine.anuncie .pc-cta{color:#C4B5FD}

/* ── Faixas-carrossel de classificados (Imóveis / Automóveis) ── */
.pc-strip{grid-column:span 12;border-radius:var(--pc-radius);padding:1.1rem 1.25rem 1.25rem;box-shadow:var(--pc-sombra)}
.pc-strip.imoveis{background:linear-gradient(135deg,#EAF6F9,#DDF0F5)}
.pc-strip.autos{background:linear-gradient(135deg,#FEF3E2,#FBEAD0)}
.pc-strip .pc-cab{display:flex;align-items:center;gap:.6rem;margin-bottom:.85rem}
.pc-strip .pc-cab h3{font-size:1.05rem;font-weight:800;letter-spacing:-.01em;margin:0}
.pc-strip .pc-setas{margin-left:.4rem;display:flex;gap:.4rem}
.pc-strip .pc-setas button{width:32px;height:32px;border-radius:50%;border:none;background:#fff;box-shadow:var(--pc-sombra);
  cursor:pointer;font-size:1rem;font-weight:800;color:var(--pc-ink);line-height:1;display:flex;align-items:center;justify-content:center}
.pc-strip .pc-setas button:hover{box-shadow:var(--pc-sombra-hover)}
.pc-strip-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;padding-bottom:2px}
.pc-strip-row::-webkit-scrollbar{display:none}
.pc-anuncio{min-width:225px;max-width:225px;background:#fff;border-radius:14px;overflow:hidden;scroll-snap-align:start;
  box-shadow:0 1px 3px rgba(34,29,46,.08);transition:transform .15s ease}
.pc-anuncio:hover{transform:translateY(-2px)}
.pc-anuncio .pc-ph{aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;font-size:2.4rem;position:relative;overflow:hidden}
.pc-anuncio .pc-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pc-anuncio .pc-info{padding:.7rem .85rem .85rem}
.pc-anuncio h4{font-size:.87rem;font-weight:700;line-height:1.25;margin:0}
.pc-anuncio .pc-onde{font-size:.73rem;color:var(--pc-ink-2);margin-top:.15rem}
.pc-anuncio .pc-preco{font-size:.98rem;font-weight:800;color:var(--c-cidade);margin-top:.4rem}
/* Faixa real de anúncios (v2): link "ver todos" + selo FIPE */
.pc-vertodos{font-size:.78rem;font-weight:800;color:var(--pc-ink-2)}
.pc-vertodos:hover{color:var(--pc-ink)}
.pc-selo-fipe{font-size:.68rem;font-weight:800;color:#0E9F6E;margin-top:.2rem}

/* Selo de transparência de IA (rodapé da capa) */
.pc-transparencia{grid-column:span 12;font-size:.8rem;color:var(--pc-ink-2);line-height:1.6;
  border-top:1px solid var(--pc-linha);padding-top:1.2rem;margin-top:.5rem}
.pc-transparencia b{color:var(--pc-ink)}

/* spans utilitários */
.pc-sp4{grid-column:span 4}.pc-sp6{grid-column:span 6}.pc-sp8{grid-column:span 8}.pc-sp12{grid-column:span 12}

/* ══════════════════════════════════════════════════════════════════
   PÁGINA DA MATÉRIA — coluna de leitura + trilho lateral (padrão portal)
   ══════════════════════════════════════════════════════════════════ */
.pc-artigo{padding-top:1.5rem;padding-bottom:2.5rem}
.pc-artigo-grid{display:grid;grid-template-columns:1fr 340px;gap:36px;align-items:start}
.pc-col{min-width:0}

/* Voltar para a home da cidade */
.pc-voltar{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:700;
  color:var(--pc-ink-2);background:var(--pc-card);box-shadow:var(--pc-sombra);padding:.4rem .9rem;border-radius:999px;margin-bottom:1rem}
.pc-voltar:hover{box-shadow:var(--pc-sombra-hover)}

/* Cabeçalho do artigo */
.pc-artigo-kicker{margin-bottom:.6rem}
.pc-artigo h1{font-size:clamp(1.7rem,3.4vw,2.3rem);font-weight:800;line-height:1.18;letter-spacing:-.02em;margin:0 0 .6rem}
.pc-artigo .pc-linhafina{font-size:1.12rem;color:var(--pc-ink-2);line-height:1.5;margin:0 0 1rem}
.pc-artigo .pc-info{font-size:.83rem;color:var(--pc-ink-2);padding-bottom:1rem;border-bottom:1px solid var(--pc-linha);margin-bottom:1.4rem}
.pc-artigo figure{margin:0 0 1.5rem}
.pc-artigo figure img{width:100%;border-radius:14px;display:block}
.pc-artigo figcaption{font-size:.78rem;color:var(--pc-ink-2);margin-top:.4rem}
.pc-corpo{font-size:1.08rem;line-height:1.85;color:#2b2536}
.pc-corpo p{margin:0 0 1.15rem}

/* Break comercial "Continua após a publicidade" */
.pc-break{margin:1.8rem 0;text-align:center}
.pc-break .pc-rotulo{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--pc-ink-2);
  position:relative;margin-bottom:1rem}
.pc-break .pc-rotulo::before,.pc-break .pc-rotulo::after{content:"";position:absolute;top:50%;width:28%;height:1px;background:var(--pc-linha)}
.pc-break .pc-rotulo::before{left:0}.pc-break .pc-rotulo::after{right:0}

/* Selo de IA / fontes */
.pc-ia{background:var(--pc-card);border:1px solid var(--pc-linha);border-radius:14px;padding:1.25rem;margin-top:2rem}
.pc-ia p{font-size:.85rem;color:var(--pc-ink-2);margin:0 0 .6rem;line-height:1.5}
.pc-ia strong{font-size:.85rem}
.pc-ia ul{font-size:.85rem;margin:.4rem 0 0;padding-left:1.25rem}
.pc-ia a{color:var(--c-cidade)}
.pc-aviso{margin-top:1.25rem}
.pc-aviso summary{cursor:pointer;font-size:.9rem;color:var(--c-cidade);font-weight:700}

/* "Leia também" (rodapé do artigo, largura total da coluna) */
.pc-leia{margin-top:2.5rem;border-top:3px solid var(--pc-ink);padding-top:1rem}
.pc-leia h2{font-size:1.15rem;font-weight:800;margin:0 0 1rem}
.pc-leia-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pc-leia-card{background:var(--pc-card);border-radius:14px;overflow:hidden;box-shadow:var(--pc-sombra);display:flex;flex-direction:column}
.pc-leia-card:hover{box-shadow:var(--pc-sombra-hover)}
.pc-leia-card .pc-foto{aspect-ratio:16/9;background-size:cover;background-position:center}
.pc-leia-card .pc-txt{padding:.85rem 1rem 1rem;display:flex;flex-direction:column;gap:.35rem}
.pc-leia-card h3{font-size:.95rem;font-weight:700;line-height:1.3;margin:0}
.pc-leia-card.sem-foto{background:var(--tt,#F3EEFE)}

/* Trilho lateral (sticky) */
.pc-trilho{display:flex;flex-direction:column;gap:20px;position:sticky;top:20px}
.pc-trilho .pc-card,.pc-trilho .pc-vitrine{grid-column:auto}
.pc-lateral{background:var(--pc-card);border-radius:var(--pc-radius);box-shadow:var(--pc-sombra);padding:1.15rem 1.25rem}
.pc-lateral .pc-mod-titulo{margin-bottom:.6rem}
.pc-lateral-item{display:flex;gap:.75rem;padding:.65rem 0;border-bottom:1px solid var(--pc-linha);align-items:flex-start}
.pc-lateral-item:last-child{border-bottom:none}
.pc-lateral-item .mini{width:64px;height:48px;border-radius:8px;flex-shrink:0;background-size:cover;background-position:center}
.pc-lateral-item .mini.sem-foto{display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.pc-lateral-item h4{font-size:.85rem;font-weight:700;line-height:1.28;margin:0}
.pc-lateral-item .pc-kicker{font-size:.66rem;margin-bottom:.15rem}

@media(max-width:991px){
  .pc-artigo-grid{grid-template-columns:1fr;gap:24px}
  .pc-trilho{position:static}
  .pc-leia-grid{grid-template-columns:1fr}
}

/* ── Responsivo ── */
@media(max-width:991px){
  .pc-manchete,.pc-ultimas,.pc-destaque,.pc-vitrine,.pc-sp4,.pc-sp6,.pc-sp8{grid-column:span 12}
  .pc-horiz{grid-template-columns:1fr}
  .pc-horiz .pc-foto{aspect-ratio:16/9;min-height:0}
}
@media(min-width:992px) and (max-width:1150px){
  .pc-destaque,.pc-vitrine{grid-column:span 6}
}