@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader-latin.woff2) format("woff2");font-weight:500 700;font-display:swap}
@font-face{font-family:"Onest";src:url(/assets/fonts/onest-latin.woff2) format("woff2");font-weight:400 700;font-display:swap}
/* Cores oficiais do Manual do Brasão de Itapoá: azul 300C, vermelho 185C, amarelo 101C, verde 354C.
   Layout: celular = app (faixa "agora", cartões, abas); PC = manchete + coluna lateral. Tema claro fixo. */
:root{
  --azul:#0060A8; --azul-esc:#06396A; --azul-soft:#E3EEF8;
  --verm:#E30518; --verm-soft:#FDE7E9;
  --amarelo:#F3E600; --verde:#209738; --verde-soft:#E3F3E7;
  --ink:#0C2236; --ink-2:#46596B; --ink-3:#5B6B7A;
  --zap:#0F7F72; --zap-txt:#0E7C45; --line-forte:#9AAAB9; --r-pill:999px;
  --sombra:0 1px 2px rgba(12,34,54,.06); --foco:0 0 0 3px #fff, 0 0 0 6px var(--azul);
  --topo:64px; --abas:56px; --leitura:680px; --lado:320px; --gutter:16px; --wrap:1200px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
  --bg:#F3F6F9; --card:#FFFFFF; --line:#DCE4EC; --soft:#E8EEF4;
  --r:14px; --r-sm:10px;
  --serif:"Newsreader",Georgia,serif;
  --sans:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden}body{overflow-x:clip}/* clip: corta a sobra sem virar contêiner de rolagem, senão o position:sticky para de funcionar */
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;max-width:100%;object-fit:cover}
svg{width:20px;height:20px;flex:none}
.wrap{max-width:calc(var(--wrap) + 32px);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.num{font-variant-numeric:tabular-nums}
/* foco visível em tudo (anel branco + azul aparece sobre foto, sobre azul e sobre branco); contorno transparente fica para o modo de alto contraste */

.pular{position:absolute;left:16px;top:-80px;z-index:300;background:var(--azul);color:#fff;padding:12px 16px;border-radius:var(--r-sm);font-weight:600}
.pular:focus{top:16px}
:focus-visible{outline:3px solid transparent;box-shadow:var(--foco)}
/* cabeçalho de 64 px no celular e 72 no computador (pedido do Daniel, 01/11); âncoras param abaixo dele */
@media (min-width:1024px){:root{--topo:72px}}
html{scroll-padding-top:calc(var(--topo) + 16px)}
/* ===================== redesign 2 (01/11/2026): cabeçalho de 56 px, menu, busca e faixa "Agora" (DESIGN.md 3 a 5.1) ===================== */
[hidden]{display:none!important}
html.sem-rolagem,html.sem-rolagem body{overflow:hidden}
.proto{background:var(--ink);color:#DCE6F0;font-size:13px;line-height:1.3;text-align:center;padding:4px 16px}
.faixa-urgente{display:flex;gap:10px;align-items:center;min-height:44px;background:var(--verm);color:#fff;padding:8px max(16px,env(safe-area-inset-left,0px));font-size:15px;font-weight:600;line-height:1.3}
.faixa-urgente b{text-transform:uppercase;letter-spacing:.06em;font-size:12px;background:#fff;color:var(--verm);padding:3px 7px;border-radius:4px;flex:none}
.faixa-urgente span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.bandeira{display:grid;grid-template-rows:4px 4px 4px}
.bandeira i:nth-child(1){background:var(--verm)}.bandeira i:nth-child(2){background:#fff}.bandeira i:nth-child(3){background:var(--azul)}
.topo{position:sticky;top:0;z-index:100;background:var(--card);border-bottom:1px solid var(--line)}
.topo .wrap{height:var(--topo);display:flex;align-items:center;gap:8px}
.logo{display:flex;align-items:center;min-height:44px;margin:0 auto;flex:none}
.logo img{height:34px;width:auto}
.bt-ico{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:0;background:none;color:var(--ink);border-radius:var(--r-sm);cursor:pointer;flex:none;padding:0}
.bt-ico svg{width:24px;height:24px}
.bt-ico.ativo{background:var(--azul);color:#fff}
.nav-d,.bt-sino{display:none}
@media (hover:hover){.bt-ico:hover{background:var(--soft)}.bt-ico.ativo:hover{background:var(--azul-esc)}}
@media (min-width:1024px){
  .bt-menu{display:none!important}
  .logo{margin:0 16px 0 0}.logo img{height:42px}
  .bt-busca{margin-left:auto}
  .nav-d{display:flex;align-items:stretch;height:var(--topo);min-width:0}
  .nav-d > a,.menu-d > summary{display:flex;align-items:center;gap:4px;height:var(--topo);padding:0 10px;color:var(--ink);font:600 15px var(--sans);border-top:3px solid transparent;border-bottom:3px solid transparent;white-space:nowrap;cursor:pointer;list-style:none}
  .menu-d{position:relative}
  .menu-d > summary::-webkit-details-marker{display:none}
  .menu-d > summary svg{width:16px;height:16px;transition:transform .15s}
  .menu-d[open] > summary svg{transform:rotate(180deg)}
  .nav-d > a:hover,.menu-d > summary:hover,.menu-d[open] > summary{color:var(--azul);border-bottom-color:var(--azul)}
  .nav-d > a[aria-current=page],.menu-d > summary.ativo{color:var(--azul);border-bottom-color:var(--azul)}
  .menu-d .sub{position:absolute;left:0;top:100%;z-index:120;min-width:240px;background:var(--card);border:1px solid var(--line);border-radius:0 0 var(--r-sm) var(--r-sm);box-shadow:0 8px 24px rgba(12,34,54,.12);padding:8px 0;display:grid}
  .menu-d .sub.duas{grid-template-columns:1fr 1fr;min-width:460px}
  .menu-d .sub a{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;color:var(--ink);font-size:15px;font-weight:500;white-space:nowrap}
  .menu-d .sub a svg{width:18px;height:18px;color:var(--azul)}
  .menu-d .sub a:hover{background:var(--azul-soft);color:var(--azul-esc)}
  .bt-sino{display:inline-flex}
  /* menu do computador com o mesmo cuidado da gaveta (pedido do Daniel, 01/11, noite), sem sair da linha única: alvo mínimo de 44 px,
     painel com fio azul em cima, item da página atual marcado e o "ver tudo" do grupo numa linha própria no pé */
  .nav-d > a,.menu-d > summary{min-width:44px;justify-content:center}
  .menu-d .sub{border-top:3px solid var(--azul);border-radius:0 0 var(--r) var(--r);padding:8px;gap:2px 8px}
  .menu-d .sub a{border-radius:var(--r-sm)}
  .menu-d .sub a[aria-current=page]{background:var(--azul-soft);color:var(--azul-esc);font-weight:700}
  .menu-d .sub .sub-todos{grid-column:1/-1;justify-content:space-between;margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 var(--r-sm) var(--r-sm);color:var(--azul);font-weight:700}
  .menu-d .sub .sub-todos svg{width:18px;height:18px;color:var(--azul)}
}
@media (min-width:1024px) and (max-width:1279px){
  .logo{margin-right:8px}
  .nav-d > a,.menu-d > summary{padding:0 6px;font-size:14px}
}
.menu-cel{position:fixed;inset:0;z-index:150}
.menu-cel .fundo{position:absolute;inset:0;background:rgba(12,34,54,.5)}
/* gaveta do celular em azul (pedido do Daniel, 01/11, noite): branco sobre #0060A8 = 6,48:1; secundário rgba(255,255,255,.9) = 5,6:1;
   itens de 48 px com fio fino entre eles; item atual com fundo claro e barra branca à esquerda */
.menu-cel .painel{position:absolute;left:0;top:0;bottom:0;width:min(86vw,360px);background:var(--azul);color:#fff;overflow-y:auto;overscroll-behavior:contain;padding:10px 12px calc(28px + env(safe-area-inset-bottom,0px));animation:menu-entra .2s ease-out;--foco:0 0 0 3px var(--azul),0 0 0 6px #fff}
@keyframes menu-entra{from{transform:translateX(-100%)}to{transform:none}}
.menu-cel .cabeca{display:flex;align-items:center;justify-content:space-between;height:48px;margin:0 0 8px;padding-left:6px}
.menu-cel .cabeca img{height:26px;width:auto}
.menu-cel .cabeca .bt-ico{color:#fff}
.menu-cel .itens > a,.menu-cel summary{position:relative;display:flex;align-items:center;gap:14px;min-height:48px;padding:0 10px;color:#fff;font:600 17px var(--sans);border-radius:var(--r-sm);cursor:pointer;list-style:none}
.menu-cel .itens > a + a,.menu-cel .itens > a + details,.menu-cel .itens > details + a,.menu-cel .itens > details + details{box-shadow:0 -1px 0 rgba(255,255,255,.16)}
.menu-cel .itens > a svg,.menu-cel summary svg{width:22px;height:22px;color:#fff;flex:none}
.menu-cel summary::-webkit-details-marker{display:none}
.menu-cel summary::after{content:"";width:8px;height:8px;border-right:2px solid rgba(255,255,255,.85);border-bottom:2px solid rgba(255,255,255,.85);transform:rotate(45deg);margin:0 8px 0 auto}
.menu-cel details[open] summary::after{transform:rotate(-135deg)}
.menu-cel .grupo{display:grid;margin:0 0 6px 46px;border-left:1px solid rgba(255,255,255,.22)}
.menu-cel .grupo a{display:flex;align-items:center;min-height:44px;padding:0 12px;font-size:16px;font-weight:500;color:rgba(255,255,255,.92);border-radius:0 var(--r-sm) var(--r-sm) 0}
.menu-cel [aria-current=page]{background:rgba(255,255,255,.16);color:#fff!important;font-weight:700}
.menu-cel .itens > a[aria-current=page]::before,.menu-cel .grupo a[aria-current=page]::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 3px 3px 0;background:#fff}
.menu-cel .grupo a[aria-current=page]{position:relative}
.menu-cel summary.ativo{background:rgba(255,255,255,.08)}
.menu-cel .painel > a.zap-menu{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;margin:16px 0 12px;padding:0 14px;background:#fff;color:var(--zap-txt);font:700 16px var(--sans);border-radius:var(--r-sm)}
.menu-cel .painel > a.zap-menu svg{width:22px;height:22px;fill:currentColor;color:var(--zap-txt)}
.menu-cel .itens.menores{border-top:1px solid rgba(255,255,255,.22);padding-top:6px;margin-top:4px}
.menu-cel .itens.menores > a{font-size:16px;font-weight:500;color:rgba(255,255,255,.92)}
.menu-cel .itens.menores > a + a{box-shadow:none}
.menu-cel :focus-visible{outline:0;box-shadow:var(--foco)}
@media (hover:hover){.menu-cel .itens > a:hover,.menu-cel summary:hover,.menu-cel .grupo a:hover{background:rgba(255,255,255,.12)}.menu-cel .cabeca .bt-ico:hover{background:rgba(255,255,255,.14)}.menu-cel .painel > a.zap-menu:hover{background:#F0F7F3}}
@media (min-width:1024px){.menu-cel{display:none!important}}
/* faixa "Agora em Itapoá": celular = 4 chips de 44 px numa linha de 56 px; computador = 4 cartões de 72 px que trocam de face */
.agora{background:var(--azul-soft);border-bottom:1px solid var(--line)}
.agora .wrap{display:flex;align-items:center;gap:8px;height:56px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:none}
.agora .wrap::-webkit-scrollbar{display:none}
.agora .rotulo,.agora .atualizado,.agora .curto{display:none}
/* celular: o chip mostra as faces (rótulo curto + valor) empilhadas na mesma célula, então a largura não pula quando o conteúdo troca */
.agora .faces{display:grid}
.agora .face{grid-area:1/1;display:inline-flex;align-items:baseline;gap:5px;opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s}
/* fade em sequência: a face velha some em 0,28 s e só então a nova aparece (sem os dois textos sobrepostos) */
.agora .face.on{opacity:1;visibility:visible;transition-delay:.28s}
.agora .face small{font-size:13px;color:var(--ink-3);font-weight:500}
.agora .face small:last-child{display:none}
.agora .face b{font:600 17px/1 var(--serif);color:var(--ink)}
.agora .chip{scroll-snap-align:start;flex:none;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-pill);color:var(--ink);font-size:14px;font-weight:500;white-space:nowrap}
.agora .chip > svg{width:20px;height:20px;color:var(--azul)}
.agora .curto b{font:600 18px/1 var(--serif);margin-left:2px}
@media (hover:hover){.agora .chip:hover{border-color:var(--azul)}}
@media (min-width:1024px){
  .agora .wrap{height:auto;padding-top:10px;padding-bottom:10px;overflow:visible;gap:16px}
  .agora .rotulo{display:block;flex:none;width:92px;margin:0;font:600 13px/1.25 var(--sans);color:var(--azul-esc);text-transform:uppercase;letter-spacing:.06em}
  .agora .chip{flex:1 1 0;min-width:0;height:72px;border-radius:var(--r-sm);padding:0 16px;gap:12px}
  .agora .chip > svg{width:28px;height:28px}
  .agora .faces{display:grid;flex:1;min-width:0}
  .agora .face{display:flex;flex-direction:column;align-items:stretch;gap:0;line-height:1.2}
  .agora .face small:last-child{display:block}
  .agora .face.on{opacity:1;visibility:visible}
  .agora .face small{font-size:13px;color:var(--ink-3);font-weight:500;overflow:hidden;text-overflow:ellipsis}
  .agora .face b{font:600 20px/1.2 var(--serif);color:var(--ink);line-height:1.2}
  .agora .atualizado{display:flex;flex-direction:column;flex:none;width:136px;margin:0;font-size:13px;color:var(--ink-3);text-align:right;line-height:1.35}
  .agora .atualizado b{color:var(--ink-2);font-weight:600}
}
@media (prefers-reduced-motion:reduce){.agora .face,.agora .face.on{transition:none}.menu-cel .painel{animation:none}}
/* ===================== redesign 2: componentes (DESIGN 5.2, 5.4, 5.7, 5.8) ===================== */
.chapeu{display:inline-flex;align-items:center;min-height:24px;font:700 12px/1.1 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--azul);border-left:3px solid currentColor;padding-left:8px}
.chapeu.urgente,.chapeu.aovivo{border:0;padding:5px 8px;min-height:0;background:var(--verm);color:#fff;border-radius:4px}
.hora{display:block;font:500 13px/1.3 var(--sans);color:var(--ink-3)}
.secao{margin:32px 0}
.secao-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.secao-cab h2{font:600 24px/1.15 var(--serif);letter-spacing:-.005em}
.secao-cab .mais,.bloco .mais,.faixa .todas{display:inline-flex;align-items:center;gap:2px;min-height:44px;font-size:15px;font-weight:600;color:var(--azul);white-space:nowrap}
.secao-cab .mais svg,.bloco .mais svg,.faixa .todas svg{width:18px;height:18px}
@media (min-width:1024px){.secao-cab h2{font-size:28px}}
/* botões */
.bt{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:var(--r-sm);font:600 15px/1.2 var(--sans);border:1.5px solid var(--azul);color:var(--azul);background:var(--card);cursor:pointer;text-align:center}
.bt svg{width:20px;height:20px}
.bt.cheio{background:var(--azul);color:#fff}
.bt.zap{background:var(--zap);border-color:var(--zap);color:#fff}
.bt.zap svg{fill:currentColor;width:22px;height:22px}
.bt.zap.grande{min-height:52px;font-size:18px;font-weight:700}
.bt.largo{display:flex;width:100%}
.bt:active{filter:brightness(.92)}
@media (hover:hover){.bt:hover{background:var(--azul-soft)}.bt.cheio:hover{background:var(--azul-esc)}.bt.zap:hover{background:var(--zap);filter:brightness(.92)}}
/* publicidade: rótulo sempre, altura reservada por posição (o contêiner só existe quando há anúncio) */
.pub{margin:24px 0;text-align:center}
.pub small{display:block;text-align:left;font:500 13px/1 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);margin-bottom:6px}
.pub a,.pub picture{display:block}
.pub img{width:var(--w,auto);max-width:100%;height:auto;aspect-ratio:var(--ar,auto);margin:0 auto;object-fit:contain;border-radius:var(--r-sm)}
.pub video{display:block;width:var(--w,100%);max-width:100%;height:auto;aspect-ratio:var(--ar,auto);margin:0 auto;border-radius:var(--r-sm);background:var(--soft);object-fit:contain}
.pub .pub-cel{display:none;width:var(--wc,var(--w,100%));aspect-ratio:var(--arc,var(--ar,auto))}
@media (max-width:1023px){.pub picture img{width:var(--wc,var(--w,auto));aspect-ratio:var(--arc,var(--ar,auto))}.pub .pub-pc{display:none}.pub .pub-cel{display:block}}
.pub-topo img,.pub-topo video{width:100%}
@media (min-width:1024px){.pub-topo img,.pub-topo video{width:auto;max-width:100%;max-height:250px}}
.pub-ads.pub-topo{min-height:220px}.pub-ads.pub-lista,.pub-ads.pub-meio,.pub-ads.pub-meio2,.pub-ads.pub-materia,.pub-ads.pub-lateral,.pub-ads.pub-materia_meio,.pub-ads.pub-guia_lateral{min-height:270px}
.pub-lateral_alta,.pub-guia_lateral_alta{display:none}
@media (min-width:1024px){
  .pub-ads.pub-topo{min-height:270px}.pub-ads.pub-lista,.pub-ads.pub-meio,.pub-ads.pub-meio2,.pub-ads.pub-materia{min-height:110px}
  .pub-lateral_alta,.pub-guia_lateral_alta{display:block}.pub-ads.pub-lateral_alta,.pub-ads.pub-guia_lateral_alta{min-height:620px}
}
@media (max-width:1023px){.pub-materia_meio .pub-cel{max-width:300px;margin-inline:auto}}
/* duas colunas: conteúdo + lateral de 320 px; a lateral estica até o fim e o bloco final fica fixo ao rolar */
.pag{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;margin-top:8px}
.pag > *{min-width:0}
.pag-princ > .secao:first-child{margin-top:24px}
.lado{display:grid;gap:16px;align-content:start}
.lado .pub{margin:0}
.fixo{display:grid;gap:16px}
@media (min-width:1024px){.pag{grid-template-columns:minmax(0,1fr) var(--lado);align-items:start}.pag > .lado{align-self:stretch;margin-top:24px}.fixo{position:sticky;top:calc(var(--topo) + 16px)}}
.bloco{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.bloco h2{font:600 20px/1.2 var(--serif);margin-bottom:12px}
.bloco p{font-size:15px;color:var(--ink-2);margin:0 0 12px}
.bloco.destaque{background:var(--azul-soft);border-color:var(--azul-soft)}
.bloco .patro{font-size:13px;color:var(--ink-3)}
.acoes-bloco{display:grid;gap:8px}
.mais-lidas{list-style:none;margin:0;padding:0;counter-reset:ml}
.mais-lidas li{counter-increment:ml;display:grid;grid-template-columns:32px 1fr;gap:8px;align-items:start;padding:8px 0;border-top:1px solid var(--line)}
.mais-lidas li:first-child{border-top:0;padding-top:0}
.mais-lidas li::before{content:counter(ml);font:600 28px/1 var(--serif);color:var(--azul)}
.mais-lidas a{display:block;min-height:44px;color:var(--ink);font-weight:600;font-size:15px;line-height:1.3}
.emergencia{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.emergencia a{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:88px;background:var(--verm);color:#fff;border-radius:var(--r-sm);padding:8px;text-align:center}
.emergencia a b{font:600 32px/1 var(--serif)}
.emergencia a span{font-size:14px;font-weight:600;margin-top:4px;line-height:1.2}
.agenda-lado{list-style:none;margin:0 0 4px;padding:0}
.agenda-lado li + li{border-top:1px solid var(--line)}
.agenda-lado a{display:grid;gap:2px;padding:8px 0;min-height:44px;color:var(--ink)}
.agenda-lado b{font-size:15px;line-height:1.3}
.agenda-lado small{font-size:13px;color:var(--ink-3)}
.links-lado{display:grid}
.links-lado a{display:flex;align-items:center;gap:10px;min-height:44px;border-bottom:1px solid var(--line);font-weight:500;font-size:15px;color:var(--ink)}
.links-lado a:last-child{border-bottom:0}
.links-lado svg{width:20px;height:20px;color:var(--azul)}
/* cartões e listas */
.foto-titulo{position:relative;display:block;border-radius:var(--r);overflow:hidden;background:var(--ink);color:#fff;aspect-ratio:4/5}
.foto-titulo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.foto-titulo .texto{position:absolute;left:0;right:0;bottom:0;display:grid;gap:6px;padding:48px 16px 16px;background:linear-gradient(to top,rgba(12,34,54,.9) 0%,rgba(12,34,54,.72) 45%,rgba(12,34,54,0) 100%)}
.foto-titulo .chapeu{color:#fff;border-left-color:var(--verm)}
.foto-titulo .chapeu.urgente{background:var(--verm)}
.foto-titulo h2,.foto-titulo h3{color:#fff;font-family:var(--serif);font-weight:600;line-height:1.15;text-wrap:balance}
.foto-titulo h2{font-size:26px}.foto-titulo h3{font-size:18px}
.foto-titulo .hora{color:rgba(255,255,255,.88)}
.so-texto{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;background:var(--soft);color:var(--ink);border-radius:var(--r);padding:16px;min-height:160px}
.so-texto h2,.so-texto h3{font:600 20px/1.2 var(--serif);text-wrap:balance}
.card-lista{display:grid;grid-template-columns:40% minmax(0,1fr);gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;color:var(--ink);min-height:72px}
.card-lista img{width:100%;height:100%;aspect-ratio:16/10;object-fit:cover}
.card-lista .meta{display:grid;gap:4px;padding:8px 12px 8px 0}
.card-lista.sem-foto{grid-template-columns:minmax(0,1fr)}.card-lista.sem-foto .meta{padding:12px 16px}
.card-lista h3{font:600 18px/1.2 var(--serif);text-wrap:balance}
.lista{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.lista li a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;min-height:72px;color:var(--ink)}
.lista li a.sem-foto{grid-template-columns:minmax(0,1fr)}
.lista li img{width:96px;height:72px;object-fit:cover;border-radius:var(--r-sm)}
.lista li a > span{display:grid;gap:4px;align-content:center}
.lista h3{font:600 17px/1.3 var(--sans);text-wrap:balance}
.cartao{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--ink)}
.cartao img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.cartao .meta{display:grid;gap:6px;padding:12px 16px 16px}
.cartao h3{font:600 20px/1.2 var(--serif);text-wrap:balance}
.cartao .resumo{font-size:15px;color:var(--ink-2);line-height:1.45}
@media (hover:hover){.lista li a:hover h3,.card-lista:hover h3,.cartao:hover h3,.so-texto:hover h3,.mais-lidas a:hover{color:var(--azul-esc);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}}
@media (min-width:1024px){
  .lista li a{grid-template-columns:160px minmax(0,1fr);gap:16px}
  .lista li img{width:160px;height:100px}
  .lista h3{font-size:18px}
  .cartao h3{font-size:22px}
}
/* faixas de ponta a ponta (guia e turismo): fundo de borda a borda, conteúdo no wrap */
.faixa{position:relative;margin:48px calc(50% - 50vw) 0;padding:32px 0;background:var(--card);border-block:1px solid var(--line)}
.faixa + .faixa{margin-top:0;border-top:0}
.faixa.foto{color:#fff;border:0;background:var(--azul-esc) center/cover no-repeat}
.faixa.foto::before{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(6,57,106,.94),rgba(6,57,106,.72))}
.faixa.foto .wrap{position:relative}
.faixa.foto h2,.faixa.foto .mais,.faixa.foto .todas{color:#fff}
.faixa.foto p{color:rgba(255,255,255,.92);max-width:600px;margin:0}
.faixa.foto{padding-bottom:48px}
.busca-guia{display:flex;gap:8px;max-width:640px;margin:16px 0}
.busca-guia input{flex:1;min-width:0;height:48px;border:1px solid var(--line-forte);border-radius:var(--r-sm);padding:0 12px;font:400 16px var(--sans);color:var(--ink);background:var(--card)}
.busca-guia input:focus{outline:3px solid transparent;box-shadow:var(--foco)}
.busca-guia button{height:48px;padding:0 16px;border:0;border-radius:var(--r-sm);background:var(--azul);color:#fff;font:600 15px var(--sans);cursor:pointer}
.faixa.foto .busca-guia input{border-color:#fff}
.faixa.foto .busca-guia button{background:#fff;color:var(--azul-esc)}
/* logo do guia Tudo em Itapoá (pedido do Daniel, 01/11; função logo_guia()): alfinete azul com o ponto vermelho + nome, altura de 1,27em */
.logo-guia{display:inline-flex;align-items:center;gap:.36em;margin:0;color:var(--azul);font:600 22px/1.1 var(--serif);letter-spacing:-.01em;white-space:nowrap}
.logo-guia.neg{color:#fff;--logo-contra:var(--azul);--logo-acento:#fff;--logo-contorno:#fff}
/* guia na capa (pedido do Daniel, 01/11): fundo claro, logo, busca, faixa de categorias e de empresas que rolam com encaixe no celular
   (a borda direita sempre corta um item de propósito, com degradê nas categorias), grade no computador */
.guia-capa{background:var(--azul-soft);border:0}
.guia-capa .gc-busca{margin:16px 0 0}
.turismo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.turismo a{display:block;border-radius:var(--r-sm);overflow:hidden;color:var(--ink);background:var(--bg);border:1px solid var(--line)}
.turismo img,.turismo .sem-foto{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.turismo .sem-foto{display:grid;place-items:center;background:var(--azul-soft);color:var(--azul)}
.turismo b{display:block;padding:8px 12px 0;font-size:15px;line-height:1.25}
.turismo small{display:block;padding:2px 12px 10px;font-size:13px;color:var(--ink-3)}
@media (min-width:1024px){.turismo{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}

/* ===================== redesign 2: migalha e matéria (DESIGN 5.5) ===================== */
.migalha{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;list-style:none;margin:16px 0 0;padding:0;font-size:13px;line-height:18px;color:var(--ink-3)}
.migalha li{display:inline-flex;align-items:center;min-width:0}
.migalha li+li::before{content:"›";margin-right:6px}
@media (max-width:759px){.migalha li[aria-current]{display:none}}
.migalha a{display:inline-block;padding:13px 9px;margin:-13px -9px;color:var(--ink-3);text-decoration:underline;text-decoration-color:var(--line-forte);text-underline-offset:3px}
.pag-mat{margin-top:12px}
.pag-mat.so{grid-template-columns:minmax(0,1fr)}
.materia{background:var(--card);border-radius:var(--r);padding:16px;min-width:0}
.materia-cab{max-width:var(--leitura)}
.materia h1{font:600 30px/1.12 var(--serif);letter-spacing:-.01em;margin:8px 0 12px;text-wrap:pretty}
.materia .linha-fina{font-size:17px;line-height:1.45;color:var(--ink-2);margin:0 0 16px}
.materia .meta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-block:1px solid var(--line);margin-bottom:16px}
.materia .datas{margin:0;font-size:13px;color:var(--ink-3);line-height:1.4}
.materia .datas b{display:block;color:var(--ink-2);font-weight:600}
.acoes{display:flex;gap:8px;flex:none}
.acoes a,.acoes button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-forte);border-radius:50%;background:var(--card);color:var(--ink);cursor:pointer;padding:0}
.acoes svg{width:20px;height:20px}
.acoes .zap{color:var(--zap-txt);border-color:var(--zap-txt)}
.acoes .zap svg{fill:currentColor;width:22px;height:22px}
@media (hover:hover){.acoes a:hover,.acoes button:hover{background:var(--soft)}}
.materia figure{margin:0 0 24px}
.foto-materia{position:relative;border-radius:var(--r-sm);overflow:hidden;background:var(--soft)}
.foto-materia img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.foto-materia .credito{position:absolute;right:8px;bottom:8px;max-width:calc(100% - 16px);background:rgba(12,34,54,.84);color:#fff;font-size:13px;line-height:1.3;padding:4px 10px;border-radius:var(--r-pill)}
.materia figcaption{font-size:13px;color:var(--ink-3);margin-top:8px;line-height:1.4}
.materia > .pub-topo{margin:0 0 24px}
.saber{max-width:var(--leitura);background:var(--azul-soft);border-left:3px solid var(--azul);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:12px 16px;margin:0 0 24px}
.saber h2{font:700 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--azul-esc);margin-bottom:8px}
.saber ul{margin:0;padding-left:18px;display:grid;gap:6px;font-size:16px;line-height:1.45}
.corpo{max-width:var(--leitura);font-size:18px;line-height:1.6;color:var(--ink);overflow-wrap:break-word}
.corpo p{margin:0 0 1.2em}
.corpo h2{font:600 24px/1.2 var(--serif);margin:1.4em 0 .5em}
.corpo h3{font:600 20px/1.25 var(--sans);margin:1.2em 0 .4em}
.corpo a{color:var(--azul);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.corpo ul,.corpo ol{padding-left:22px;margin:0 0 1.2em}
.corpo blockquote{margin:1.4em 0;padding:12px 16px;border-left:3px solid var(--azul);background:var(--azul-soft);border-radius:0 var(--r-sm) var(--r-sm) 0;font:500 20px/1.4 var(--serif);color:var(--ink)}
.corpo blockquote p{margin:0}
.corpo img{max-width:100%;height:auto;border-radius:var(--r-sm);margin:8px 0}
.corpo .pub{margin:24px 0}
.fim-materia{max-width:var(--leitura);margin-top:24px;display:grid;gap:16px}
.etiquetas{display:flex;flex-wrap:wrap;gap:8px}
.etiquetas a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;background:var(--soft);border-radius:var(--r-pill);color:var(--ink-2);font-size:14px;font-weight:600}
.autor{display:flex;align-items:center;gap:12px}
.autor p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.45}
.autor .simb{width:44px;height:44px;border-radius:50%;background:var(--azul-soft);display:grid;place-items:center;flex:none}
.autor .simb img{width:24px;height:24px}
.autor a,.correcao a{color:var(--azul);font-weight:600}
.correcao{font-size:13px;color:var(--ink-3);margin:0}
.compartilhar{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.carrossel{position:relative;margin:0 0 24px}
.car-trilho{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--r-sm)}
.car-trilho::-webkit-scrollbar{display:none}
.car-trilho figure{flex:0 0 100%;scroll-snap-align:start;margin:0}
.car-bt{position:absolute;top:calc(50% - 44px);width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.94);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:var(--sombra);padding:0}
.car-bt svg{width:24px;height:24px}
.car-bt.ant{left:8px}.car-bt.prox{right:8px}
.car-conta{position:absolute;top:8px;right:8px;background:rgba(12,34,54,.84);color:#fff;font-size:13px;font-weight:600;padding:3px 10px;border-radius:var(--r-pill)}
.barra-materia{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--card);border-top:1px solid var(--line);padding:6px 16px calc(6px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:1fr 44px 44px;gap:8px;align-items:center}
.barra-materia .bt-ico{border:1px solid var(--line-forte);border-radius:50%}
.barra-materia .bt-ico svg{width:20px;height:20px}
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 16px;border-radius:var(--r-sm);font-size:15px;z-index:160;max-width:min(92vw,420px);box-shadow:0 10px 30px rgba(0,0,0,.25)}
@media (min-width:1024px){
  .materia{padding:32px}
  .materia h1{font-size:44px}
  .materia .linha-fina{font-size:19px}
  .corpo{font-size:19px}
  .barra-materia{display:none}
  .toast{bottom:24px}
}

/* ===================== redesign 2: páginas de lista, busca e cartão do guia (DESIGN 5.4) ===================== */
.cab-pagina{padding:20px 0 4px}
.cab-pagina h1{font:600 30px/1.12 var(--serif);letter-spacing:-.01em}
.cab-pagina h1 small{font:500 15px var(--sans);color:var(--ink-3);margin-left:6px}
.cab-pagina > p{color:var(--ink-2);margin:8px 0 0;max-width:720px;font-size:16px}
@media (min-width:1024px){.cab-pagina h1{font-size:40px}}
.chips{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;margin:12px -16px 0;padding:2px 16px 6px}
.chips::-webkit-scrollbar{display:none}
.chips a,.chips button{scroll-snap-align:start;flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--soft);border:0;border-radius:var(--r-pill);color:var(--ink);font:600 14px var(--sans);white-space:nowrap;cursor:pointer}
.chips a[aria-current=page],.chips button[aria-pressed=true]{background:var(--azul);color:#fff}
@media (hover:hover){.chips a:not([aria-current]):hover,.chips button[aria-pressed=false]:hover{background:var(--azul-soft);color:var(--azul-esc)}}
.chips-quebra{flex-wrap:wrap;overflow:visible;margin:0;padding:0}
@media (min-width:1024px){.chips{flex-wrap:wrap;overflow:visible;margin:12px 0 0;padding:0}.chips a,.chips button{min-height:40px}}
.pag-lista .pag-princ > :first-child{margin-top:24px}
.secao.primeira{margin-top:24px}
.hero-ed{aspect-ratio:16/10}
.hero-ed .resumo{font-size:15px;line-height:1.45;color:rgba(255,255,255,.9);display:none}
.so-texto.hero-ed{aspect-ratio:auto;min-height:0;background:var(--card);border:1px solid var(--line)}
.so-texto.hero-ed .resumo{display:block;color:var(--ink-2);font-size:16px}
@media (min-width:1024px){.hero-ed{aspect-ratio:21/9}.hero-ed h2{font-size:36px;max-width:26ch}.hero-ed .texto{padding:64px 24px 24px}.hero-ed .resumo{display:block;max-width:70ch}}
.grade-cartoes{display:grid;gap:12px;margin:24px 0}
@media (min-width:760px){.grade-cartoes{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}
.lista.com-resumo .resumo{font-size:15px;line-height:1.4;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lista + .pub + .lista{margin-top:0}
.paginacao{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:32px 0}
.paginacao a,.paginacao span{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:0 12px;border-radius:var(--r-sm);background:var(--card);border:1px solid var(--line);color:var(--ink);font-weight:600}
.paginacao svg{width:18px;height:18px}
.paginacao [aria-current=page]{background:var(--azul);border-color:var(--azul);color:#fff}
@media (hover:hover){.paginacao a:hover{border-color:var(--azul);color:var(--azul)}}
.vazio{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;color:var(--ink-2);text-align:center;margin:24px 0}
.vazio a{color:var(--azul);font-weight:600}
.abas-busca{display:flex;border-bottom:1px solid var(--line);margin:16px -16px 0;padding:0 16px;overflow-x:auto;scrollbar-width:none}
.abas-busca::-webkit-scrollbar{display:none}
.abas-busca a{flex:none;display:inline-flex;align-items:center;min-height:48px;padding:0 14px;color:var(--ink-2);font-weight:600;border-bottom:3px solid transparent}
.abas-busca a[aria-current=page]{color:var(--azul);border-bottom-color:var(--azul)}
@media (min-width:1024px){.abas-busca{margin:16px 0 0;padding:0}}
.resultados{display:grid}
.resultado{display:grid;gap:4px;padding:12px 0;border-top:1px solid var(--line);color:var(--ink)}
.resultado:first-child{border-top:0;padding-top:0}
.resultado b{font-size:17px;line-height:1.3}
.resultado small{font-size:13px;color:var(--ink-3);line-height:1.4}
mark{background:#FFF0A8;color:inherit;padding:0 2px;border-radius:2px}
.servicos-1{grid-template-columns:minmax(0,1fr)!important}
.empresas{display:grid;gap:12px}
@media (min-width:760px){.empresas{grid-template-columns:repeat(2,minmax(0,1fr))}}
.empresa{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:grid;gap:12px;align-content:start;min-width:0}
.empresa.destaque{border-color:var(--azul);box-shadow:var(--sombra)}
.empresa .cab{display:flex;gap:12px;align-items:flex-start}
.empresa .logo-emp{width:48px;height:48px;border-radius:var(--r-sm);object-fit:cover;flex:none;background:var(--soft)}
.empresa .nome-emp{min-width:0;flex:1}
.empresa h3{font:600 17px/1.3 var(--sans);display:inline}
.empresa h3 a{color:var(--ink);display:inline-block;padding:11px 0;margin:-11px 0}
@media (hover:hover){.empresa h3 a:hover{color:var(--azul-esc);text-decoration:underline;text-underline-offset:3px}}
.empresa .selo{display:inline-block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--azul-esc);background:var(--azul-soft);padding:3px 8px;border-radius:4px;margin-left:8px;vertical-align:2px}
.empresa .onde{margin:4px 0 0;font-size:13px;color:var(--ink-3);line-height:1.4}
.empresa .onde b{color:var(--ink-2);font-weight:600}
.acoes-emp{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.acoes-emp .bt{padding:0 12px}
.tel-aberto{font:600 18px/1 var(--serif)!important;color:var(--ink)!important;border-color:var(--line-forte)!important;letter-spacing:.01em}
.telefones{list-style:none;margin:0;padding:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.telefones li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.telefones li:first-child{border-top:0}
.telefones .nome{font-weight:600;font-size:16px;line-height:1.3;min-width:0}
.telefones .obs{display:block;font-size:13px;font-weight:400;color:var(--ink-3)}
.telefones .num{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.telefones .num a,.telefones .num button{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border:1.5px solid var(--azul);border-radius:var(--r-sm);color:var(--azul);background:var(--card);font:600 18px/1 var(--serif);white-space:nowrap;cursor:pointer}
.telefones .num a.zap{border-color:var(--zap-txt);color:var(--zap-txt);font:600 15px var(--sans)}
.telefones .num a.zap svg{fill:currentColor;width:20px;height:20px}
.telefones .num button{border-color:var(--line-forte);color:var(--ink-2);font:600 14px var(--sans)}
@media (max-width:519px){.telefones li{grid-template-columns:minmax(0,1fr)}.telefones .num{justify-content:flex-start}}

/* ===================== redesign 2: guia (capa, categoria, ficha, busca instantânea) ===================== */
.faixa-topo{margin-top:0;padding:10px 0 24px}
.faixa-topo .migalha{margin:0 0 4px;color:rgba(255,255,255,.88)}
.faixa-topo .migalha a{color:#fff;text-decoration-color:rgba(255,255,255,.6)}
.faixa-topo h1{font:600 30px/1.1 var(--serif);color:#fff;letter-spacing:-.01em}
.faixa-topo h1.logo-guia{font-size:26px;margin:2px 0 0}
.faixa-topo p{margin:8px 0 0}
@media (min-width:1024px){.faixa-topo{padding:24px 0 40px}.faixa-topo h1{font-size:44px}.faixa-topo h1.logo-guia{font-size:38px}}
.busca-guia{position:relative;flex-wrap:wrap}
.sugestoes{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:60;list-style:none;margin:0;padding:4px 0;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 8px 24px rgba(12,34,54,.18)}
.sugestoes a{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:6px 12px;color:var(--ink);font-size:15px}
.sugestoes small{color:var(--ink-3);font-size:13px;text-align:right;flex:none;max-width:45%}
.sugestoes [aria-selected=true] a,.sugestoes a:hover{background:var(--azul-soft)}
.sugestoes li:last-child a{font-weight:600;color:var(--azul-esc)}
.nota-cab{font-size:13px;color:var(--ink-3)}
.emp-item{display:grid;min-width:0}
.emp-pub{grid-column:1/-1}.emp-pub .pub{margin:4px 0}
.ficha-guia{display:grid;gap:16px}
.ficha-guia.destaque{border:1px solid var(--azul)}
.cab-ficha{display:flex;gap:12px;align-items:center}
.cab-ficha h1{font:600 30px/1.12 var(--serif);margin:6px 0 2px}
.logo-ficha{width:64px;height:64px;border-radius:var(--r-sm);object-fit:cover;flex:none}
.onde-ficha{margin:0;color:var(--ink-3);font-size:14px}
.acoes-ficha{display:flex;flex-wrap:wrap;gap:8px}
.hoje-ficha,.cupom-ficha{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0;font-size:15px}
.hoje-ficha svg,.cupom-ficha svg{width:20px;height:20px;color:var(--azul)}
.cupom-ficha{background:var(--azul-soft);border-radius:var(--r-sm);padding:8px 12px;color:var(--azul-esc);font-weight:600}
.selo-aberto,.selo-fechado{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 8px;border-radius:4px;background:#E3F3E7;color:#14602A}
.selo-fechado{background:var(--soft);color:var(--ink-2)}
.dados-ficha{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 16px;margin:0;font-size:15px}
.dados-ficha dt{color:var(--ink-3)}
.dados-ficha dd{margin:0;overflow-wrap:anywhere}
.dados-ficha a{color:var(--azul);display:inline-block;padding:12px 0;margin:-12px 0}
.dono-ficha{font-size:14px;color:var(--ink-3);border-top:1px solid var(--line);padding-top:12px;margin:0}
.dono-ficha a{color:var(--azul);font-weight:600}
@media (min-width:1024px){.cab-ficha h1{font-size:40px}}
.links-guia{list-style:none;margin:0;padding:0;display:grid;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.links-guia li + li{border-top:1px solid var(--line)}
.links-guia a{display:grid;gap:2px;align-content:center;min-height:56px;padding:8px 16px;color:var(--ink)}
.links-guia b{font-size:15px}.links-guia small{font-size:13px;color:var(--ink-3)}
@media (min-width:760px){.links-guia{grid-template-columns:1fr 1fr}.links-guia li:nth-child(2){border-top:0}.links-guia li:nth-child(even){border-left:1px solid var(--line)}}

/* ===================== redesign 2: capa (DESIGN 5.3) ===================== */
.d1{padding:24px 0 16px}
.d1 h1{font:600 26px/1.1 var(--serif);letter-spacing:-.01em;margin:8px 0}
.d1 h1 a{color:inherit}
@media (hover:hover){.d1 h1 a:hover{color:var(--azul-esc)}}
.d1 .linha-fina{font-size:17px;line-height:1.45;color:var(--ink-2);margin:0 0 8px}
.d1 .sub{list-style:none;margin:12px 0 0;padding:0}
.d1 .sub li{position:relative;padding-left:18px;font-size:15px;font-weight:500}
.d1 .sub li::before{content:"";position:absolute;left:0;top:18px;width:8px;height:8px;border-radius:50%;background:var(--azul)}
.d1 .sub a{display:flex;align-items:center;min-height:44px;color:var(--ink)}
.d23{display:grid;gap:12px}
.d3{display:grid;gap:12px}
.d4{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.d4 .foto-titulo .texto{padding:32px 12px 12px}
.d4 .foto-titulo h3,.d4 .so-texto h3{font-size:18px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.d4 .so-texto{aspect-ratio:4/5;min-height:0;padding:12px}
@media (min-width:760px) and (max-width:1023px){.d23 .foto-titulo{aspect-ratio:16/10}.d3{grid-template-columns:1fr 1fr}.d3 .card-lista{grid-template-columns:minmax(0,1fr);align-content:start}.d3 .card-lista .meta{padding:8px 12px 12px}}
@media (min-width:1024px){
  .d1{padding:20px 0 24px}
  .d1 h1{font-size:44px}   /* 15% menor (pedido do Daniel, 01/11, noite; era 52) */
  .d1 .linha-fina{font-size:19px;max-width:900px}
  .d23{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:24px}
  .d23.so{grid-template-columns:minmax(0,1fr)}
  .d23 .foto-titulo{aspect-ratio:auto;height:100%;min-height:440px}
  .d3 .card-lista img{aspect-ratio:16/9}
  .d3 .card-lista h3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .d23 .foto-titulo h2{font-size:36px}
  .d23 .foto-titulo .texto{padding:64px 24px 24px}
  .d3{grid-template-rows:1fr 1fr;gap:24px}
  .d3 .card-lista{grid-template-columns:minmax(0,1fr);align-content:start;align-items:start}
  .d3 .card-lista .meta{padding:8px 12px 12px}
  .d3 .card-lista h3{font-size:20px}
  .d4{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:24px}
  .d4 .foto-titulo h3,.d4 .so-texto h3{font-size:20px}
}
.cameras{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cameras a{display:block;color:var(--ink)}
.cameras .quadro{position:relative;display:block;border-radius:var(--r-sm);overflow:hidden;background:var(--ink);aspect-ratio:16/9}
.cameras .quadro img{width:100%;height:100%;object-fit:cover}
.cameras .chapeu.aovivo{position:absolute;left:8px;top:8px}
.cameras .nome{display:block;padding-top:8px;font-weight:600;font-size:15px;line-height:1.3}
.cameras small{display:block;font-size:13px;color:var(--ink-3)}
@media (min-width:1024px){.cameras{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
.servicos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.servico{display:flex;flex-direction:column;gap:4px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);min-height:44px}
.servico > svg{width:24px;height:24px;color:var(--azul)}
.servico b{font-size:15px;line-height:1.25}
.servico a{color:var(--ink);display:flex;align-items:center;min-height:44px}
.servico small{font-size:13px;color:var(--ink-3);line-height:1.35}
.servico select{width:100%;min-height:44px;border:1px solid var(--line-forte);border-radius:var(--r-sm);padding:0 8px;font:500 14px var(--sans);color:var(--ink);background:#fff}
@media (hover:hover){a.servico:hover,.servico-coleta:hover{border-color:var(--azul)}}
@media (min-width:1024px){.servicos{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
.editoria-bloco{display:grid;gap:12px}
@media (min-width:1024px){.editoria-bloco{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}.editoria-bloco .lista li a{grid-template-columns:120px minmax(0,1fr)}.editoria-bloco .lista li img{width:120px;height:80px}}

/* cabeçalho */

/* agora */

/* seções */
.sec{margin-top:30px}
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.sec-h h2{font-size:18px;font-weight:700;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.sec-h h2 svg{color:var(--azul)}
.sec-h a{font-size:13.5px;color:var(--azul);font-weight:600;display:flex;align-items:center;gap:2px;white-space:nowrap}
.sec-h a svg{width:16px;height:16px}
@keyframes pulso{0%{box-shadow:0 0 0 0 rgba(227,5,24,.45)}70%{box-shadow:0 0 0 8px rgba(227,5,24,0)}100%{box-shadow:0 0 0 0 rgba(227,5,24,0)}}
.tempo-pub{font-size:13px;color:var(--ink-3)}
.nota{font-size:13px;color:var(--ink-3);margin-top:8px}

/* manchete */

/* câmeras */
.cams{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;padding:2px 16px 4px;margin:0 -16px;scrollbar-width:none}
.cams::-webkit-scrollbar{display:none}
.cam{scroll-snap-align:start;flex:0 0 78%}
.cam .vid{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#123}
.cam .vid:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,0) 40%)}
.badge-live{position:absolute;top:10px;left:10px;z-index:1;background:var(--verm);color:#fff;font-size:13px;font-weight:700;letter-spacing:.06em;padding:4px 8px;border-radius:6px;display:flex;align-items:center;gap:6px}
.badge-live:before{content:"";width:6px;height:6px;border-radius:50%;background:#fff}
.cam .nome{font-weight:600;margin-top:8px}
.cam .patro{font-size:13px;color:var(--ink-3)}
.cam .patro b{color:var(--ink-2);font-weight:600}

/* lista */

/* publicidade: rótulo sempre; a imagem leva largura e altura reais, então o espaço fica reservado e nada pula */

/* guia */
.guia{background:var(--azul);color:#fff;border-radius:18px;padding:18px}
.guia .sec-h h2,.guia .sec-h h2 svg{color:#fff}.guia .sec-h a{color:#CFE3F5}
.guia .marca{font-size:13px;color:#CFE3F5;margin-top:-8px;margin-bottom:12px}
.busca{display:flex;align-items:center;gap:10px;background:#fff;color:var(--ink-3);border-radius:12px;padding:12px 14px;font-size:15px}
.busca svg{color:var(--ink-2)}
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.cat{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border-radius:12px;background:rgba(255,255,255,.1);font-size:13px;font-weight:500;text-align:center}
.cat span.i{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.14)}
.cat svg{color:#fff}
.plant-f{margin-top:14px;background:#fff;color:var(--ink);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:center}
.plant-f .ic{width:44px;height:44px;border-radius:12px;background:var(--verde-soft);color:var(--zap-txt);display:grid;place-items:center;flex:none}
.plant-f .t{font-size:13px;color:var(--zap-txt);font-weight:600}
.plant-f .n{font-weight:700}
.plant-f .e{font-size:13px;color:var(--ink-3)}
.bt-zap{margin-left:auto;width:42px;height:42px;border-radius:50%;background:var(--zap);display:grid;place-items:center;flex:none}
.bt-zap svg{fill:#fff;width:22px;height:22px}

/* horários */
.horarios{display:grid;gap:12px}
.hr{background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:14px;min-width:0}
.hr h3{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.hr h3 svg{color:var(--azul)}
.hr .op{font-size:13px;color:var(--ink-3);margin:2px 0 10px}
.hr .sentido{font-size:13px;font-weight:600;color:var(--ink-2);margin:10px 0 6px}
.horas{display:flex;flex-wrap:wrap;gap:6px}
.horas span{font-variant-numeric:tabular-nums;font-weight:600;font-size:14px;padding:5px 9px;border-radius:8px;background:var(--soft);color:var(--ink-2)}
.horas span.passou{opacity:.45}
.horas span.prox{background:var(--azul);color:#fff}

.urbano{grid-column:1/-1}
.dias{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 10px}
.dias button{border:0;background:var(--soft);color:var(--ink-2);font:600 13px var(--sans);padding:7px 12px;border-radius:999px;cursor:pointer}
.dias button.on{background:var(--azul);color:#fff}
.urbano select{width:100%;max-width:360px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;font:500 14px var(--sans);background:#fff;color:var(--ink);margin-bottom:10px}
.horas span{position:relative}
.horas span i{position:absolute;top:3px;right:3px;width:7px;height:7px;border-radius:50%}
.m-S{background:#F07A1A}.m-C{background:#1E9E4A}.m-V{background:#1C74D4}.m-I{background:#E8C400}
.legenda{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:13px;color:var(--ink-3)}
.legenda span{display:inline-flex;align-items:center;gap:6px}
.legenda i{width:9px;height:9px;border-radius:50%;display:inline-block}

/* conheça */
.conheca{background:var(--card);border-radius:18px;box-shadow:0 0 0 1px var(--line);overflow:hidden}
.conheca .txt{padding:18px;display:grid;gap:12px}
.conheca h3{font-family:var(--serif);font-size:24px;line-height:1.15;letter-spacing:-.015em;text-wrap:balance}
.conheca p{color:var(--ink-2);max-width:62ch}
.fatos{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border-top:1px solid var(--line)}
.fato{background:var(--card);padding:14px}
.fato b{display:block;font-size:20px;font-weight:700;color:var(--azul);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.fato span{font-size:13px;color:var(--ink-2)}
.cores{display:flex;flex-direction:column;gap:8px;padding:0 18px 18px}
.cores .ln{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink-2)}
.cores .ln i{width:28px;height:18px;border-radius:4px;flex:none;box-shadow:0 0 0 1px var(--line)}

/* pontos */
.pontos{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;padding:2px 16px 4px;margin:0 -16px;scrollbar-width:none}
.pontos::-webkit-scrollbar{display:none}
.pt{scroll-snap-align:start;flex:0 0 70%;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden;display:flex;flex-direction:column}
.pt .ft{aspect-ratio:4/3;background:linear-gradient(150deg,var(--azul),var(--azul-esc));position:relative;display:grid;place-items:center;color:rgba(255,255,255,.75)}
.pt .ft svg{width:34px;height:34px}
.pt .ft small{position:absolute;bottom:8px;right:10px;font-size:13px;color:rgba(255,255,255,.7)}
.pt .tx{padding:12px;display:grid;gap:4px}
.pt .loc{font-size:12px;color:var(--verm);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.pt h3{font-size:16px;font-weight:700;line-height:1.25}
.pt p{font-size:13.5px;color:var(--ink-2)}

/* agenda */
.agenda{display:grid;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden}
.ev{display:flex;gap:14px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.ev:last-child{border-bottom:0}
.ev .dt{width:56px;flex:none;text-align:center;border-radius:10px;background:var(--verm-soft);color:var(--verm);padding:6px 0;line-height:1.1}
.ev .dt b{display:block;font-size:20px;font-variant-numeric:tabular-nums}
.ev .dt small{font-size:12px;font-weight:600;text-transform:uppercase}
.ev .t{font-weight:600}
.ev .s{font-size:13px;color:var(--ink-3)}

/* encartes */
.encartes{display:flex;gap:12px;overflow-x:auto;padding:2px 16px 4px;margin:0 -16px;scrollbar-width:none}
.encartes::-webkit-scrollbar{display:none}
.enc{flex:0 0 42%;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden}
.enc .capa{aspect-ratio:3/4;padding:12px;display:flex;flex-direction:column;justify-content:space-between;color:#fff}
.enc .capa b{font-size:22px;font-weight:800;line-height:1;letter-spacing:-.02em}
.enc .capa .pr{background:var(--amarelo);color:#5A0A00;align-self:flex-start;font-weight:800;font-size:20px;padding:4px 8px;border-radius:8px;transform:rotate(-4deg)}
.enc .capa small{font-size:13px;opacity:.9}
.enc .rod{padding:10px}
.enc .rod .n{font-weight:600;font-size:14px}
.enc .rod .v{font-size:13px;color:var(--ink-3)}
.c1{background:linear-gradient(160deg,#E30518,#9E0311)}.c2{background:linear-gradient(160deg,#0060A8,#06396A)}.c3{background:linear-gradient(160deg,#209738,#146226)}.c4{background:linear-gradient(160deg,#C2410C,#8A2D08)}

/* telefones */

.d-only{display:none}
@media (min-width:600px){.cam{flex-basis:46%}.enc{flex-basis:24%}.pt{flex-basis:40%}
  .horarios{grid-template-columns:1fr 1fr}
  .fatos{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:1024px){
  body{font-size:15.5px}.d-only{display:block}.m-only{display:none}
  /* computador: rótulo em cima e o dado numa linha só (valor + complemento), sem aumentar a faixa */
  
  
  .cams{display:grid;grid-template-columns:repeat(4,1fr);margin:0;padding:0;overflow:visible}
  .conheca{display:grid;grid-template-columns:1.2fr 1fr}
  .conheca .fatos{grid-column:1/3}
  .conheca .cores{padding:18px;justify-content:center;border-left:1px solid var(--line)}
  .pontos{display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding:0;overflow:visible}
  .encartes{display:grid;grid-template-columns:repeat(4,1fr);margin:0;padding:0;overflow:visible}
}

/* ===== página da matéria ===== */

.fonte-materia{font-size:14px;color:var(--ink-2);background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:12px;padding:12px 14px;margin:18px 0}
.fonte-materia a{color:var(--azul);font-weight:600;word-break:break-word}
/* guia e turismo */

.guia-sub{color:var(--ink-2);margin-top:4px}
.guia-lista{display:grid;background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:var(--r);overflow:hidden}
.guia-item{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.guia-item:last-child{border-bottom:0}
.guia-item.destaque{background:#F6FAFE}
.gi-nome{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.gi-nome img{width:44px;height:44px;border-radius:10px;object-fit:cover;flex:none}
.gi-nome b{display:block}
.gi-nome small{display:block;color:var(--ink-3);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gi-zap{width:40px;height:40px;border-radius:50%;background:var(--zap);display:grid;place-items:center;flex:none}
.gi-zap svg{fill:#fff;width:20px;height:20px}
.volta-g{font-size:13px;color:var(--ink-3);margin-top:18px}
.volta-g a{color:var(--azul);font-weight:600}
.guia-ficha{background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:18px;padding:18px;margin-top:12px;max-width:820px}
.gf-foto{border-radius:var(--r);aspect-ratio:16/9;height:auto;margin-bottom:14px}
.gf-cab{display:flex;gap:14px;align-items:center}
.gf-logo{width:64px;height:64px;border-radius:14px;object-fit:cover;flex:none}
.gf-cab h1{font-family:var(--serif);font-size:30px;line-height:1.1;letter-spacing:-.015em}
.gf-bairro{color:var(--ink-3);font-size:14px}
.gf-acoes{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.bt-zap-g{display:inline-flex;align-items:center;gap:8px;background:var(--zap);color:#fff;font-weight:600;padding:11px 16px;border-radius:999px}
.bt-zap-g svg{fill:#fff;width:20px;height:20px}
.bt-sec{display:inline-flex;align-items:center;gap:8px;background:var(--soft);color:var(--ink);font-weight:600;padding:11px 16px;border-radius:999px}
.bt-sec svg{width:18px;height:18px;color:var(--azul)}
.gf-dados{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:15px;margin:6px 0 14px}
.gf-dados dt{color:var(--ink-3)}
.gf-dados a{color:var(--azul)}
.gf-dono{font-size:13.5px;color:var(--ink-3);border-top:1px solid var(--line);padding-top:12px;margin-top:12px}
.gf-dono a{color:var(--azul);font-weight:600}
.guia-dono{background:var(--azul-soft);border-radius:18px;padding:18px}
.guia-dono h2{font-size:18px}
.guia-dono p{color:var(--ink-2);margin:6px 0 12px;max-width:60ch}
.pontos-grade{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:600px){.pontos-grade{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.pontos-grade{grid-template-columns:repeat(3,1fr)}}
.pontos-grade .pt{flex:none}
.previa-barra{max-width:760px;margin:18px auto 0;background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:var(--r);padding:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.previa-barra pre{width:100%;white-space:pre-wrap;font:inherit;font-size:13.5px;color:#7A5B00;background:#FFF6CC;border-radius:10px;padding:10px 12px;margin:0}
.previa-barra form{margin:0}
/* menu com 8 itens: logo não encolhe, item não quebra */

/* carrossel da matéria e imagens no meio do texto */

/* vagas, tv e rádio */
.materia-h{font-size:17px;margin:18px 0 6px}
.bt-aprovar{position:sticky;bottom:12px}
.tv-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.tv-item{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:4px;background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:var(--r);overflow:hidden;padding-bottom:10px}
.tv-item b{padding:0 12px;font-size:15px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tv-item small{padding:0 12px;color:var(--ink-3);font-size:13px}
.tv-item:focus-visible{outline:2px solid var(--azul)}
.tv-thumb{position:relative;display:block;aspect-ratio:16/9;background:#0b1f33}
.tv-thumb img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}
.tv-play{position:absolute;inset:auto auto 10px 10px;width:38px;height:38px;border-radius:50%;background:rgba(227,5,24,.92);color:#fff;display:grid;place-items:center;font-size:14px}
.tv-modal{position:fixed;inset:0;background:rgba(5,15,28,.82);z-index:90;display:grid;place-items:center;padding:16px}
.tv-modal[hidden]{display:none}
.tv-caixa{position:relative;width:min(960px,100%)}
.tv-frame{aspect-ratio:16/9;background:#000;border-radius:12px;overflow:hidden}
.tv-frame iframe{width:100%;height:100%;border:0;display:block}
.tv-fechar{position:absolute;top:-44px;right:0;width:36px;height:36px;border-radius:50%;border:0;background:#fff;font-size:22px;cursor:pointer}
.radio-player{display:flex;align-items:center;gap:14px;background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:18px;padding:16px;margin:14px 0;max-width:520px}
.radio-player small{display:block;color:var(--ink-3)}
.radio-bt{width:56px;height:56px;border-radius:50%;border:0;background:var(--verm);color:#fff;font-size:20px;cursor:pointer;flex:none}
.radio-grade{display:grid;gap:20px}
.radio-seguinte{color:var(--ink-2);font-size:14.5px;margin:0 0 14px}
.radio-lateral{display:grid;gap:10px;align-content:start;margin-bottom:24px}
.radio-lateral h2{font-size:17px;margin:0 0 2px}
.radio-prog{display:flex;gap:12px;align-items:flex-start;background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:12px;padding:10px 12px}
.radio-prog.no-ar{box-shadow:0 0 0 2px var(--verm)}
.radio-prog b{font-size:14.5px}
.radio-prog small{display:block;color:var(--ink-3);font-size:13px}
.rp-hora{font-weight:700;color:var(--azul);font-size:14px;min-width:44px}
.rp-vivo{background:var(--verm);color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;padding:2px 6px;border-radius:5px;vertical-align:2px}
@media (min-width:1024px){.radio-grade{grid-template-columns:1fr 320px;align-items:start}.radio-lateral{position:sticky;top:88px;margin-top:22px}}
.bt-aprovar,.bt-descartar,.bt-editar{border:0;border-radius:10px;padding:11px 16px;font:600 15px var(--sans);cursor:pointer;display:inline-block}
.bt-aprovar{background:#209738;color:#fff}.bt-descartar{background:var(--verm-soft);color:#A00312}.bt-editar{background:var(--soft);color:var(--ink)}
.selo-risco{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:4px 9px;border-radius:6px;background:var(--soft)}
.selo-risco.vermelho{background:var(--verm-soft);color:#A00312}.selo-risco.amarelo{background:#FFF6CC;color:#7A5B00}.selo-risco.verde{background:var(--verde-soft);color:#14602A}

/* ===================== redesign 2026-10: molde de duas colunas, lateral e páginas de serviço ===================== */

.lead{font-size:17px;color:var(--ink-2);margin-top:12px;max-width:66ch}
.rot{color:var(--ink-3);font-size:13px}
.nota a,.fonte-pag a,.info-bloco a:not([class]){color:var(--azul);font-weight:600}
.fonte-pag{margin-top:28px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-3)}

/* blocos da lateral */

.pl-item{display:grid;gap:4px;padding:8px 0}
.pl-item + .pl-item{border-top:1px solid var(--line)}
.pl-item small{color:var(--ink-3);font-size:13px}
.emerg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.emerg a{display:flex;align-items:center;gap:8px;background:var(--verm-soft);border-radius:10px;padding:10px;min-width:0}
.emerg b{font-size:20px;color:var(--verm);font-variant-numeric:tabular-nums}
.emerg span{font-size:13px;color:var(--ink-2);line-height:1.2}
.emerg-grande{max-width:420px}
.bt-lado{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;background:var(--azul);color:#fff;font:600 14px var(--sans);padding:10px 14px;border-radius:10px;cursor:pointer}
.bt-lado svg{width:18px;height:18px}
.bt-lado.sec{background:var(--soft);color:var(--ink)}
.bt-lado.sec.ativo{background:var(--azul-soft);color:var(--azul)}

/* páginas de serviço */

.busca-pag{display:flex;align-items:center;gap:8px;background:var(--card);box-shadow:0 0 0 1px var(--line);border-radius:12px;padding:4px 12px;margin-top:14px;max-width:520px}
.busca-pag input{flex:1;border:0;background:transparent;font:500 16px var(--sans);padding:9px 2px;color:var(--ink);min-width:0}
.busca-pag input:focus{outline:3px solid transparent}.busca-pag:focus-within{box-shadow:var(--foco)}
.busca-pag svg{color:var(--ink-3)}
.cartao-lista{display:grid;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden}
.cartao-lista > *{padding:12px 14px;border-bottom:1px solid var(--line)}
.cartao-lista > *:last-child{border-bottom:0}
.tel-item{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between}
.tel-nome{min-width:0;flex:1 1 220px}
.tel-nome b{display:block}
.tel-nome small{display:block;color:var(--ink-3);font-size:13px}
.tel-acoes{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.tel-item .tel-acoes{margin-top:0}
.escolha-bairro{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:14px 0 4px;font-weight:600;font-size:14px}
.escolha-bairro select{padding:10px 12px;border:1px solid var(--line);border-radius:10px;font:500 15px var(--sans);background:#fff;color:var(--ink);max-width:100%;min-width:220px}
.destaque-caixa{background:var(--azul-soft);border-radius:var(--r);padding:16px}
.destaque-caixa .info-bloco{background:transparent}
.lista-simples{padding-left:18px;display:grid;gap:4px;font-size:14.5px}
.linha-info{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14.5px}
.linha-info span{color:var(--ink-2)}
.tabela-serv{display:grid;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden}
.ts-linha{display:grid;gap:4px;padding:12px 14px;border-bottom:1px solid var(--line)}
.ts-linha:last-child{border-bottom:0}
.ts-k b{display:block}.ts-k span{font-size:13.5px;color:var(--azul);font-weight:600}
.ts-v{font-size:13.5px;color:var(--ink-2)}
@media (min-width:760px){.ts-linha{grid-template-columns:220px 1fr;gap:16px}}
.aviso-amarelo{display:flex;gap:10px;align-items:flex-start;background:#FFF6CC;color:#5C4500;border-radius:12px;padding:10px 12px;font-size:14px;margin:12px 0}
.aviso-amarelo svg{width:18px;height:18px;flex:none;margin-top:1px}
.info-bloco{display:grid;gap:4px;min-width:0}
.info-bloco p{font-size:14px;color:var(--ink-2)}
.info-bloco.sem-borda{padding:8px 0 0}
section.info-bloco{background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:16px}
section.info-bloco.destaque-caixa{background:var(--azul-soft);box-shadow:none}
.chips-ancora,.chips-filtro{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:14px -16px 0;padding:2px 16px}
.chips-ancora::-webkit-scrollbar,.chips-filtro::-webkit-scrollbar{display:none}
.chips-ancora a,.chips-filtro button{flex:none;border:0;background:var(--card);box-shadow:0 0 0 1px var(--line);color:var(--ink-2);font:600 13.5px var(--sans);padding:8px 12px;border-radius:999px;cursor:pointer;white-space:nowrap}
.chips-filtro button.on{background:var(--azul);color:#fff;box-shadow:none}
@media (min-width:1024px){.chips-ancora,.chips-filtro{flex-wrap:wrap;margin:14px 0 0;padding:0;overflow:visible}}
.hr-t{font-size:17px;font-weight:700;display:flex;align-items:center;gap:8px}
.hr-t svg{color:var(--azul)}
.dia-rot{font-size:13px;color:var(--ink-3);margin:6px 0 4px}
.urb .dias{margin-top:10px}
.urb-q .sentido{margin-top:12px}
.resumo-num{font-size:16px;margin-bottom:10px}
.balne{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:600px){.balne{grid-template-columns:1fr 1fr}}
.balne-p{display:grid;gap:3px;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:12px 14px;border-left:5px solid var(--line)}
.balne-p.proprio{border-left-color:var(--verde)}.balne-p.improprio{border-left-color:var(--verm)}
.balne-s{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
.balne-p.proprio .balne-s{color:#14602A}.balne-p.improprio .balne-s{color:#A00312}
.balne-p small{font-size:13px;color:var(--ink-2)}
.balne-d{color:var(--ink-3)!important}
.mar-agora{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mar-agora > div{background:var(--card);border-radius:12px;box-shadow:0 0 0 1px var(--line);padding:12px;display:grid;gap:2px}
.mar-agora b{font-size:18px;font-variant-numeric:tabular-nums}
.tempo-agora{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:16px;margin-bottom:12px}
.tempo-agora b{font-size:40px;font-weight:700;font-variant-numeric:tabular-nums}
.tempo-agora span{color:var(--ink-2)}
.prev7{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.prev7 .dia{background:var(--card);border-radius:12px;box-shadow:0 0 0 1px var(--line);padding:12px;display:grid;gap:2px;font-size:14px}
.prev7 .mm{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}
.prev7 small{font-size:13px;color:var(--ink-3)}
.acordeao summary{cursor:pointer;list-style:none;display:grid;gap:2px}
.acordeao summary::-webkit-details-marker{display:none}
.acordeao summary small{color:var(--ink-3);font-size:13px}
.acordeao summary b:after{content:" +";color:var(--azul)}
.acordeao[open] summary b:after{content:" −"}
.acordeao p{font-size:14px;color:var(--ink-2);margin-top:6px}
a.ev{color:inherit}
.falec-nome{font-family:var(--serif);font-size:20px}
.falec-msg{font-style:italic}
/* busca e páginas institucionais */

.busca-grande{max-width:none;margin-top:12px}
.texto-inst{font-size:16.5px;margin-top:10px}
.texto-inst ul{padding-left:20px;margin:0 0 1em}
.texto-inst a{color:var(--azul);font-weight:600}
.form-leitor{display:grid;gap:14px;margin-top:16px;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:16px}
.form-leitor label{display:grid;gap:6px;font-weight:600;font-size:14px}
.form-leitor small{font-weight:400;color:var(--ink-3)}
.form-leitor input[type=text],.form-leitor input[type=tel],.form-leitor textarea{border:1px solid var(--line);border-radius:10px;padding:11px 12px;font:400 16px var(--sans);color:var(--ink);background:#fff;width:100%}
.form-leitor .duas{display:grid;gap:14px}
@media (min-width:600px){.form-leitor .duas{grid-template-columns:1fr 1fr}}
.form-leitor .check-l{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.form-leitor .check-l input{margin-top:3px}
.form-leitor .bt-lado{justify-self:start;padding:12px 18px;font-size:15px}
.esconde{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.guia-lista,.cartao-lista,.tabela-serv{grid-template-columns:minmax(0,1fr)}
.gi-nome > span{min-width:0}

/* ===== cabeçalho novo: menus, barra de serviços ===== */

/* ===== capa nova ===== */

a.linha-info{color:inherit}

/* ===== rodapé novo ===== */

.pt .ft{background:var(--azul-soft);color:var(--azul)}
.pt .ft small{color:var(--ink-3)}

/* ===== matéria e listas em duas colunas ===== */

/* a coluna lateral estica até o fim da grade, para o bloco fixo ter por onde acompanhar a leitura */

/* ===== guia em duas colunas ===== */

.gf-hoje,.gf-cupom{display:flex;align-items:center;gap:8px;font-size:15px;margin:4px 0 10px}
.gf-hoje svg,.gf-cupom svg{width:18px;height:18px;color:var(--azul)}
.gf-cupom{background:var(--azul-soft);border-radius:10px;padding:8px 12px;color:var(--azul-esc);font-weight:600}
.form-descarte{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.form-descarte input{border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:400 14px var(--sans);min-width:240px;flex:1}

/* ===== capa por vagas (pedido do Daniel, 24/10): D1 só título, D2 + D3, D4, anúncio, câmeras ===== */

/* cartão com o título dentro da foto: o degradê só escurece o pé da imagem, onde fica o texto */

/* anúncio do topo: no computador no máximo ~250 px de altura, proporção mantida e centralizado */

/* agenda na lateral */

/* editoria com hero */

/* guia: topo com foto da cidade em cinza, de fora a fora */
.guia-hero{position:relative;margin:0 calc(50% - 50vw);background:#3a4651 center/cover no-repeat;color:#fff}
.guia-hero:before{content:"";position:absolute;inset:0;background:rgba(8,20,34,.55)}
.gh-in{position:relative;max-width:1240px;margin:0 auto;padding:34px max(16px,env(safe-area-inset-left,0px)) 30px}
.gh-in .chapeu{color:#FFD0D4}
.gh-in h1{font-family:var(--serif);font-size:32px;line-height:1.1;letter-spacing:-.015em;margin:4px 0 6px}
.gh-in p{color:#E6EEF5;max-width:60ch}
.gh-in .guia-busca{box-shadow:none}
.guia-hero.sem-foto{background:var(--azul-esc)}
@media (min-width:1024px){.gh-in{padding:60px 16px 54px}.gh-in h1{font-size:46px}}
/* categorias: no celular duas linhas com rolagem lateral, sem barra */

/* destaque 4 no celular: cartão mais alto para o título caber dentro da foto (medido: 16:10 cortava o chapéu) */

/* ===== ajustes do Daniel (rodada 2): destaque 1 de ponta a ponta, faixa enxuta, menu do celular ===== */

/* data da faixa: só no computador */

/* turismo como seção, no molde do guia */
.tur-atalhos{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tur-atalhos a{background:rgba(255,255,255,.14);color:#fff;font-weight:600;font-size:14px;padding:8px 12px;border-radius:999px}
.tur-atalhos a:hover{background:rgba(255,255,255,.24)}
.pt-sem{background:var(--azul-soft);box-shadow:none}
.tur-praias{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--azul-soft);border-radius:var(--r);padding:16px}
.tur-praias b{display:block;font-size:17px}.tur-praias small{color:var(--ink-2);font-size:14px}
.tur-praias svg{color:var(--azul)}

/* capa: vitrine do guia de ponta a ponta, mesma foto cinza do /guia */

/* 24/10: destaque 1 com fonte menor (pedido do Daniel) */

/* anúncio no meio da matéria, celular: formato 300x300 */

/* câmeras ao vivo com mais destaque: faixa branca de ponta a ponta */

/* topo de ponta a ponta do contêiner (arte 1170x90 no computador, 1170x250 no celular) */

/* mosaico de fotos reais em cinza atrás das faixas de turismo (película da .guia-hero por cima) */

/* faixa de turismo na capa: 4 lugares em cartões brancos */

/* 24/10: mosaico do turismo colorido (pedido do Daniel); película mais forte só onde fica o texto */

/* 24/10: no celular a rolagem das categorias "não acontecia": com encaixe obrigatório, arraste curto volta ao mesmo card.
   Encaixe suave, cartão um pouco menor (o terceiro aparece pela metade e convida a arrastar) e gesto lateral liberado. */

/* ===== fase 2 (2026-10-31) ===== */
.aviso-atualizacao,.ver-anterior{font-size:15px;line-height:1.45;padding:10px 12px;border-radius:8px;background:#eef5fb;color:var(--ink-2);margin:10px 0}
.aviso-atualizacao a,.ver-anterior a{color:var(--azul);font-weight:600}
.previa-barra .aviso-parecida{width:100%;margin:4px 0;font-size:14px;color:#8a5a00}
.previa-barra .aviso-parecida a{color:inherit;text-decoration:underline}

/* ===== fase 2, etapa 5: celular e capa (2026-10-31) =====
   Celular: a faixa "Agora" fica acima da manchete, compacta; a meta de manchete antes de 300 px vem de cabeçalho,
   atalhos e espaços menores. Alvos de toque de 44 px. */
@media (max-width:1023px){
  /* faixa compacta: rótulo em cima e o dado numa linha só (o toque abre a página do serviço) */
  
  
  /* alvos de toque */
  .sec-h a,.bt-lado,.cls-mais{min-height:44px;display:inline-flex;align-items:center}
  /* guia: topo de foto baixo, a busca e as categorias sobem */
  
}
/* "Itapoá agora" na capa */

/* horários: próximas saídas */

/* classificados */
.cls-grade{display:grid;gap:14px;margin-top:12px}
.cls-card{background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:14px 16px}
.cls-card h2{display:flex;align-items:center;gap:8px;font-size:18px;margin-bottom:8px}
.cls-card h2 svg{width:20px;height:20px;color:var(--azul)}
.cls-mais{color:var(--azul);font-weight:600;gap:4px;margin-top:6px}
.cls-mais svg{width:16px;height:16px}
.cls-vazio{color:var(--ink-3);margin:4px 0}
.cls-breve p{color:var(--ink-2)}
@media (min-width:760px){.cls-grade{grid-template-columns:1fr 1fr}.cls-breve{grid-column:1/-1}}
/* convite discreto (instalar / alerta): acima da barra de abas no celular, no canto no computador */
.convite{position:fixed;left:12px;right:12px;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:40;background:var(--card);border-radius:var(--r);box-shadow:0 6px 24px rgba(8,20,34,.18),0 0 0 1px var(--line);padding:12px 14px}
.convite p{font-size:14.5px;color:var(--ink);margin-bottom:8px}
.cv-bts{display:flex;gap:8px;justify-content:flex-end}
.cv-bts button{min-height:44px;padding:0 16px;border-radius:999px;font:600 14px var(--sans);cursor:pointer;border:0}
.cv-sim{background:var(--azul);color:#fff}
.cv-nao{background:var(--soft);color:var(--ink-2)}
@media (min-width:1024px){.convite{left:auto;right:20px;bottom:20px;max-width:380px}}
@media (max-width:1023px){
  /* área de toque maior sem mudar o desenho: links pequenos de texto ganham "folga" invisível */
  
  .busca-pag input{min-height:44px}
  .chips-ancora a,.dias button{min-height:44px;display:inline-flex;align-items:center}
  .linha-info{min-height:44px}
}

/* recuperadas da poda da R2 (ainda usadas por páginas que não foram redesenhadas) */

.lado-mais{display:inline-flex;align-items:center;gap:2px;font-size:13.5px;font-weight:600;color:var(--azul);margin-top:10px}
.lado-mais svg{width:16px;height:16px}
.tem-mosaico{overflow:hidden;background:#2b3640}
.mosaico{position:absolute;inset:0;display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;gap:2px;filter:grayscale(1);z-index:0}
.mosaico img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:760px){.mosaico{grid-template-columns:repeat(4,1fr)}}
.tem-mosaico:before{z-index:1}
.tem-mosaico .gh-in,.tem-mosaico .gv-in{z-index:2}
.mosaico{filter:none}
.tem-mosaico:before{background:rgba(8,20,34,.6)}
@media (min-width:1024px){.tem-mosaico:before{background:linear-gradient(90deg,rgba(8,20,34,.82) 0%,rgba(8,20,34,.6) 42%,rgba(8,20,34,.3) 100%)}}
@media (max-width:1023px){.sec-h a,.gv-todas,.lado-mais,.bt-lado,.cls-mais{min-height:44px;display:inline-flex;align-items:center}}

/* ===================== redesign 2: serviços (telefones, horários, hub e o molde das demais) ===================== */
.visualmente-oculto{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.so-pc{display:none!important}
@media (min-width:1024px){.so-pc{display:inline-flex!important}}
.pag-servico .cab-pagina{padding-top:0}
.resposta{background:var(--card);border-left:3px solid var(--azul);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:12px 16px;margin:4px 0 16px;font-size:17px;line-height:1.45}
.resposta p{margin:0}
.emergencia-pag{margin:0 0 16px}
@media (min-width:1024px){.emergencia-pag{grid-template-columns:repeat(4,minmax(0,1fr))}.emergencia-pag a b{font-size:36px}}
.busca-guia.filtro{margin:16px 0 4px}
.prox-saidas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 16px}
.prox-saidas .sub-t{grid-column:1/-1;margin:0}
.ps-it{display:grid;gap:2px;align-content:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px;min-height:64px;color:var(--ink)}
.ps-it span{font-size:13px;color:var(--ink-3);line-height:1.3}
.ps-it b{font:600 18px/1.2 var(--serif);color:var(--azul-esc);font-variant-numeric:tabular-nums}
@media (min-width:1024px){.prox-saidas{grid-template-columns:repeat(4,minmax(0,1fr))}}
.servicos-hub{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:760px){.servicos-hub{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* componentes antigos que as demais páginas de serviço ainda usam, no desenho novo */
.titulo-pagina{font:600 30px/1.12 var(--serif);letter-spacing:-.01em;margin:20px 0 8px}
@media (min-width:1024px){.titulo-pagina{font-size:40px}}
.pag-intro{color:var(--ink-2);font-size:16px;max-width:64ch;margin:0 0 8px}
.sub-t{font:600 22px/1.2 var(--serif);margin:0 0 12px;display:flex;align-items:center;gap:8px}
.sub-t svg{color:var(--azul);width:22px;height:22px}
.bt-tel{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border:1.5px solid var(--azul);border-radius:var(--r-sm);background:var(--card);color:var(--azul);font:600 18px/1 var(--serif);white-space:nowrap}
.bt-tel svg{width:18px;height:18px;color:currentColor}
.bt-zap-p{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:var(--r-sm);background:var(--zap);color:#fff;font:600 15px var(--sans);align-self:start}
.bt-zap-p svg{fill:#fff;width:20px;height:20px}
.bt-copiar{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border:1px solid var(--line-forte);border-radius:var(--r-sm);background:var(--card);color:var(--ink-2);font:600 14px var(--sans);cursor:pointer}
.chips-ancora a,.chips-filtro button{min-height:44px;display:inline-flex;align-items:center;padding:0 16px;background:var(--soft);box-shadow:none;border-radius:var(--r-pill);color:var(--ink);font:600 14px var(--sans)}
.chips-filtro button.on{background:var(--azul);color:#fff}
.dias button{min-height:44px;padding:0 16px;font-size:14px}
.busca-pag{min-height:48px;border:1px solid var(--line-forte);box-shadow:none;border-radius:var(--r-sm)}
.escolha-bairro select,.urbano select{min-height:44px;border-color:var(--line-forte)}
.lado-mais{min-height:44px;font-size:15px}
.balne-p b a,.info-bloco b a,.cartao-lista b a{display:inline-block;padding:13px 0;margin:-13px 0;color:var(--azul)}

/* ===================== redesign 2: rodapé e barra inferior (DESIGN 5.6 e 5.9) ===================== */

.abas{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--card);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 max(0px,env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(0px,env(safe-area-inset-left,0px))}
.abas a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:var(--abas);color:var(--ink-2);font:600 12px/1 var(--sans);letter-spacing:-.01em;min-width:0}
.abas a svg{width:24px;height:24px}
.abas a[aria-current=page]{color:var(--azul)}
.abas a span{white-space:nowrap}
html.sem-rolagem .abas{display:none}
@media (min-width:1024px){.abas{display:none}}
.convite{bottom:calc(var(--abas) + 12px + env(safe-area-inset-bottom,0px))}

/* busca em modal, um componente só no celular e no computador (pedido do Daniel, 01/11) */
.busca-modal{position:fixed;inset:0;z-index:170}
.busca-modal .fundo{position:absolute;inset:0;background:rgba(12,34,54,.62)}
.painel-busca{position:relative;max-width:760px;margin:0 auto;background:var(--card);padding:12px 16px 20px;border-radius:0 0 var(--r) var(--r);box-shadow:0 12px 32px rgba(12,34,54,.2);animation:busca-desce .15s ease-out}
@keyframes busca-desce{from{transform:translateY(-16px);opacity:0}to{transform:none;opacity:1}}
.form-busca{display:flex;align-items:center;gap:8px}
.form-busca input{flex:1;min-width:0;height:54px;border:1px solid var(--line-forte);border-radius:var(--r-sm);padding:0 14px;font:400 17px var(--sans);color:var(--ink);background:#fff}
.form-busca input:focus{outline:3px solid transparent;box-shadow:var(--foco)}
.form-busca .bt{min-height:54px;padding:0 18px}
.rot-modal{margin:16px 0 8px;font:600 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.painel-busca .chips{margin-top:0}
@media (max-width:519px){.form-busca .bt.cheio{padding:0 12px}}
@media (min-width:1024px){.painel-busca{margin-top:24px;border-radius:var(--r);padding:20px 24px 24px}}
@media (prefers-reduced-motion:reduce){.painel-busca{animation:none}}
/* rodapé com foto real de Itapoá ao fundo (pedido do Daniel, 01/11): a foto é o único enfeite; véu escuro garante o contraste */
.rodape{position:relative;overflow:hidden;background:var(--azul-esc);color:#fff;margin-top:64px;padding:32px 0 calc(var(--abas) + 20px + env(safe-area-inset-bottom,0px));font-size:15px}
.rodape-foto,.rodape-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%}
@media (min-width:760px){.rodape-foto img{object-position:center 60%}}
.rodape::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(6,20,36,.70) 0%,rgba(6,25,48,.82) 45%,rgba(6,20,36,.92) 100%)}
.rodape .wrap{position:relative;z-index:2}
.rodape a{color:#fff}
.marca-rod{display:grid;gap:12px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.22)}
.logo-rod{display:inline-flex;align-items:center;min-height:44px}
.logo-rod img{height:32px;width:auto}
.marca-rod p{margin:0;max-width:44ch;color:rgba(255,255,255,.92);font-size:16px;line-height:1.45}
.contato-rod{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bt.claro{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.55);color:#fff}
.bt.claro svg{fill:currentColor}
@media (hover:hover){.bt.claro:hover{background:rgba(255,255,255,.22)}}
.rodape .rede{color:#fff;border:1px solid rgba(255,255,255,.55);border-radius:50%}
.rodape .rede svg{width:20px;height:20px}
.rodape .colunas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;padding-top:20px}
.rodape h2{font:600 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.88);margin:8px 0 4px}
.rodape ul{list-style:none;margin:0;padding:0}
.rodape ul a{display:flex;align-items:center;min-height:44px;color:rgba(255,255,255,.94);line-height:1.25}
@media (hover:hover){.rodape ul a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}}
.rodape .fim{margin:20px 0 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.22);font-size:13px;color:rgba(255,255,255,.85)}
@media (min-width:1024px){
  .rodape{padding:48px 0 28px}
  .rodape > .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;align-items:start}
  .marca-rod{border-bottom:0;padding-bottom:0}
  .rodape .colunas{grid-template-columns:repeat(4,minmax(0,1fr));padding-top:0;gap:24px}
  .rodape ul a{min-height:36px}
  .rodape .fim{grid-column:1/-1;margin-top:8px}
}
/* guia no celular (pedido do Daniel, 01/11): categorias em 2 colunas inteiras, filtros numa linha rolável, cartão com botões à vista, ficha */
.cats-guia{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.cats-guia a{display:flex;align-items:center;gap:10px;min-height:64px;padding:8px 12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);min-width:0}
.cats-guia a > svg{width:22px;height:22px;color:var(--azul);flex:none}
.cats-guia span{display:grid;gap:2px;min-width:0}
.cats-guia b{font-size:14px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cats-guia small{font-size:13px;color:var(--ink-3)}
@media (hover:hover){.cats-guia a:hover{border-color:var(--azul)}}
.cats-guia .extra{display:none}
.cats-guia.aberta .extra,.cats-guia:target .extra{display:flex}
.ver-todas-cats{margin-top:12px}
.cats-guia:target + .ver-todas-cats{display:none}
@media (min-width:760px){.cats-guia{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.cats-guia{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.cats-guia .extra{display:flex}.ver-todas-cats{display:none}}
.so-pc-bloco{display:none!important}
@media (min-width:760px){.so-pc-bloco{display:flex!important}}
.cab-cat{padding-bottom:0}
.cab-cat > p{margin-top:4px;font-size:15px}
.filtros-cat{flex-wrap:nowrap!important;overflow-x:auto!important;margin:12px -16px 0!important;padding:2px 16px 6px!important}
.filtros-cat.tem-mais{-webkit-mask-image:linear-gradient(to right,#000 82%,transparent);mask-image:linear-gradient(to right,#000 82%,transparent)}
.filtros-cat button[aria-pressed]{background:var(--card);box-shadow:inset 0 0 0 1.5px var(--azul);color:var(--azul)}
.filtros-cat button[aria-pressed=true]{background:var(--azul);color:#fff}
@media (min-width:1024px){.filtros-cat{margin:12px 0 0!important;padding:0 0 6px!important}}
.pag-lista .secao.primeira{margin-top:16px}
.empresa{gap:12px;padding:14px}
.empresa .onde{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.acoes-emp{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;margin:0}
.acoes-emp .bt{min-height:44px;padding:0 8px;font-size:15px}
.acoes-emp .tel-aberto{font-size:17px!important}
.selo-aberto,.selo-fechado{display:inline-block;font-size:12px;line-height:1.2}
.ficha-guia{display:grid;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;min-width:0}
.ficha-guia.destaque{border-color:var(--azul)}
.cab-ficha h1{font:600 28px/1.15 var(--serif);margin:0 0 6px;letter-spacing:-.01em}
.onde-ficha{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;font-size:15px;color:var(--ink-2)}
.onde-ficha a{color:var(--azul);font-weight:600;display:inline-block;padding:12px 0;margin:-12px 0}
.acoes-ficha{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.acoes-ficha .bt{min-height:48px;padding:0 10px}
.acoes-ficha.impar > .bt:last-of-type{grid-column:1/-1}
.acoes-ficha noscript{grid-column:1/-1}
.info-ficha{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--line)}
.info-ficha > li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.45}
.info-ficha > li:last-child{border-bottom:0}
.info-ficha > li > svg{width:20px;height:20px;color:var(--azul);flex:none;margin-top:2px}
.info-ficha > li > svg[viewBox] path[d^="M17.472"]{fill:currentColor}
.info-ficha a{color:var(--azul);font-weight:600;display:inline-block;padding:12px 0;margin:-12px 0;overflow-wrap:anywhere}
.horario-ficha{flex:1}
.horario-ficha summary{cursor:pointer;min-height:44px;display:flex;align-items:center;margin:-12px 0;list-style:none}
.horario-ficha summary::-webkit-details-marker{display:none}
.horario-ficha summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);margin-left:auto}
.horario-ficha[open] summary::after{transform:rotate(-135deg)}
.horario-ficha ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:4px;color:var(--ink-2)}
.horario-ficha li.hoje{font-weight:700;color:var(--ink)}
.dono-ficha{margin:16px 0 0;padding:12px 16px;border-radius:var(--r-sm);background:var(--soft);font-size:14px;color:var(--ink-2)}
.dono-ficha p{margin:0;line-height:1.5}
.dono-ficha a{color:var(--azul);font-weight:600}
@media (min-width:1024px){.cab-ficha h1{font-size:40px}.ficha-guia{padding:28px}.acoes-ficha{grid-template-columns:repeat(4,minmax(0,1fr))}.acoes-ficha.impar > .bt:last-of-type{grid-column:auto}}
@media (max-width:519px){.nota-cab{display:none}}
/* anúncios (pedido do Daniel, 01/11): espaço reservado por posição; matéria em 300x300 com a peça centralizada; "Anuncie aqui" em cinza */
.pub-caixa{display:block}
.pub-util small{color:var(--ink-2)}
.pub-materia .pub-caixa,.pub-materia_meio .pub-caixa{width:300px;height:300px;max-width:100%;margin:0 auto;display:flex;align-items:center;justify-content:center}
.pub-materia .pub-caixa img,.pub-materia_meio .pub-caixa img,.pub-materia .pub-caixa video,.pub-materia_meio .pub-caixa video{width:auto;height:auto;max-width:300px;max-height:300px;aspect-ratio:auto;object-fit:contain}
.pub-materia .pub-caixa a,.pub-materia_meio .pub-caixa a,.pub-materia .pub-caixa picture,.pub-materia_meio .pub-caixa picture{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.pub-materia .pub-caixa .pub-cel,.pub-materia_meio .pub-caixa .pub-cel{max-width:300px}
.pub-ads.pub-materia,.pub-ads.pub-materia_meio{min-height:0}
.pub-materia,.pub-materia_meio{text-align:center}
.pub-materia small,.pub-materia_meio small{width:300px;max-width:100%;margin-left:auto;margin-right:auto}
.pub-lateral .pub-caixa,.pub-guia_lateral .pub-caixa{min-height:250px;display:flex;align-items:center;justify-content:center}
.pub-lateral_alta .pub-caixa,.pub-guia_lateral_alta .pub-caixa{min-height:600px;display:flex;align-items:flex-start;justify-content:center}
.anuncie-aqui{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;margin:0 auto;padding:12px;width:100%;min-height:44px;background:var(--soft);border:1px dashed var(--line-forte);border-radius:var(--r-sm);color:var(--ink-3);text-align:center;font-size:14px;line-height:1.35}
.anuncie-aqui b{font:600 17px/1.2 var(--sans);color:var(--ink-2)}
@media (hover:hover){.anuncie-aqui:hover{border-color:var(--azul);color:var(--azul-esc)}.anuncie-aqui:hover b{color:var(--azul)}}
.pub-vazio.pub-topo .anuncie-aqui,.pub-vazio.pub-imoveis_topo .anuncie-aqui,.pub-vazio.pub-veiculos_topo .anuncie-aqui{height:200px}
.pub-vazio.pub-lista .anuncie-aqui,.pub-vazio.pub-meio .anuncie-aqui,.pub-vazio.pub-meio2 .anuncie-aqui{max-width:300px;height:250px}
.pub-vazio.pub-lateral .anuncie-aqui,.pub-vazio.pub-guia_lateral .anuncie-aqui,.pub-vazio.pub-camera .anuncie-aqui{max-width:300px;height:250px}
.pub-vazio.pub-lateral_alta .anuncie-aqui,.pub-vazio.pub-guia_lateral_alta .anuncie-aqui{max-width:300px;height:600px}
.pub-vazio.pub-materia .anuncie-aqui,.pub-vazio.pub-materia_meio .anuncie-aqui{width:300px;max-width:100%;height:300px}
.pub-vazio.pub-lateral .pub-caixa,.pub-vazio.pub-lateral_alta .pub-caixa{min-height:0}
@media (min-width:1024px){
  .pub-vazio.pub-topo .anuncie-aqui,.pub-vazio.pub-imoveis_topo .anuncie-aqui,.pub-vazio.pub-veiculos_topo .anuncie-aqui{height:250px}
  .pub-vazio.pub-lista .anuncie-aqui,.pub-vazio.pub-meio .anuncie-aqui,.pub-vazio.pub-meio2 .anuncie-aqui{max-width:728px;height:90px}
}
.pub a.anuncie-aqui{display:flex;text-decoration:none;color:var(--ink-3)}
.pub-materia .pub-caixa a,.pub-materia_meio .pub-caixa a{text-decoration:none}
.corpo .pub a{text-decoration:none}
.cameras .chapeu.aovivo.fora{background:var(--ink-2)}
.rel-totais{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:16px}
.item-rel{display:grid;gap:2px;padding:10px 16px}
.item-rel b{font-size:15px}.item-rel small{font-size:13px;color:var(--ink-3)}
.preco{font:600 20px/1.2 var(--serif);color:var(--ink)}
.grade-classif{margin-top:16px}
.classif .sem-foto-classif{display:grid;place-items:center;aspect-ratio:16/10;background:var(--azul-soft);color:var(--azul)}
.classif .sem-foto-classif svg{width:40px;height:40px}
.preco-ficha{font:600 26px/1.2 var(--serif);margin:6px 0 0}
.dados-classif{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;margin:0}
.dados-classif dt{font-size:13px;color:var(--ink-3)}.dados-classif dd{margin:0;font-weight:600}
.etq{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border-radius:var(--r-pill);background:var(--soft);font-size:14px;font-weight:600;color:var(--ink-2)}
.aviso-erro{background:var(--verm-soft);color:#8A0313;border-radius:var(--r-sm);padding:10px 14px;font-weight:600}
.form-classif .tres{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
.form-leitor select,.form-leitor input[type=number],.form-leitor input[type=email]{border:1px solid var(--line-forte);border-radius:10px;padding:0 12px;min-height:48px;font:400 16px var(--sans);color:var(--ink);background:#fff;width:100%}
.form-leitor input[type=text],.form-leitor input[type=tel],.form-leitor textarea{border-color:var(--line-forte);min-height:48px}
@media (min-width:1024px){.dados-classif{grid-template-columns:repeat(3,minmax(0,1fr))}}
.galeria{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}
.galeria figure{margin:0}
.galeria a{display:block;border-radius:var(--r-sm);overflow:hidden}
.galeria img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.galeria figcaption{font-size:13px;color:var(--ink-3);margin-top:4px;line-height:1.3}
@media (min-width:760px){.galeria{grid-template-columns:repeat(3,minmax(0,1fr))}}
.foto-grande{border:0;padding:0;background:transparent;max-width:min(96vw,1200px)}
.foto-grande::backdrop{background:rgba(12,34,54,.85)}
.foto-grande img{max-height:80vh;width:auto;max-width:100%;border-radius:var(--r-sm)}
.foto-grande p{color:#fff;font-size:14px;margin:8px 0 0}
.foto-grande button{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.92)}
.patro-ev{font-size:14px;color:var(--ink-3)}.patro-ev a{color:var(--azul);font-weight:600}
/* "Envie sua matéria pelo WhatsApp" (pedido do Daniel, 01/11): bloco no texto e nas listas; aba na direita só onde cabe sem cobrir a lateral */
.envie-bloco{display:grid;gap:12px;background:var(--card);border:1px solid var(--line);border-left:3px solid var(--zap);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:14px 16px;margin:16px 0}
.envie-bloco p{margin:0;font-size:16px;line-height:1.45;color:var(--ink-2)}
.envie-bloco p b{color:var(--ink)}
.envie-bloco .bt{min-height:48px}
.aba-envie{display:none}
@media (min-width:1320px){
  .envie-bloco{display:none}
  .aba-envie{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:80;display:flex;flex-direction:column;align-items:center;gap:10px;width:44px;padding:14px 0;background:var(--zap);color:#fff;border-radius:var(--r-sm) 0 0 var(--r-sm);box-shadow:var(--sombra);text-decoration:none}
  .aba-envie svg{width:22px;height:22px;fill:currentColor}
  .aba-envie .aba-txt{writing-mode:vertical-rl;transform:rotate(180deg);font:600 15px/1 var(--sans);letter-spacing:.01em;white-space:nowrap}
  .aba-envie .aba-num{position:absolute;right:100%;top:50%;transform:translateY(-50%);background:var(--zap);color:#fff;font:600 16px/1 var(--sans);white-space:nowrap;padding:14px 16px;border-radius:var(--r-sm) 0 0 var(--r-sm);opacity:0;visibility:hidden;transition:opacity .15s}
  .aba-envie:hover .aba-num,.aba-envie:focus-visible .aba-num{opacity:1;visibility:visible}
}
@media (prefers-reduced-motion:reduce){.aba-envie .aba-num{transition:none}}
.form-leitor .check-l{min-height:44px;align-items:center}
.form-leitor .check-l input{width:24px;height:24px;flex:none}
.vazio a{display:inline-block;padding:12px 0;margin:-12px 0}
.cam-lateral .anuncie{min-height:44px;display:flex;align-items:center;justify-content:center}
.cls-mais{min-height:44px;display:inline-flex;align-items:center}
/* ===================== vagas na capa (pedido do Daniel, 01/11): entre o guia e o turismo; lista curta no celular, grade no computador ===================== */
.vagas-capa + .faixa{border-top:1px solid var(--line)}
.vc-lista{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.vc-lista li{display:grid}
.vc-lista a{display:grid;align-content:start;gap:2px;min-height:72px;padding:12px 16px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink)}
.vc-lista b{font:600 17px/1.3 var(--sans);overflow-wrap:anywhere}
.vc-lista span{font-size:15px;color:var(--ink-2);overflow-wrap:anywhere}
.vc-lista small{font:500 13px/1.3 var(--sans);color:var(--ink-3)}
@media (hover:hover){.vc-lista a:hover{border-color:var(--azul)}.vc-lista a:hover b{color:var(--azul-esc);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}}
.vc-acoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:16px}
.vc-acoes .bt{min-height:48px;padding:0 8px;white-space:nowrap}
@media (min-width:760px){.vc-lista{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.vc-acoes{display:flex;flex-wrap:wrap}.vc-acoes .bt{padding:0 24px}}
@media (min-width:1024px){.vc-lista{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
/* ===================== linha de edição da capa (pedido do Daniel, 01/11): como no alto de um jornal impresso, sem caixa nem cor ===================== */
.edicao{background:var(--card);padding:6px 0}
.edicao p{display:flex;flex-direction:column;align-items:center;gap:1px;margin:0;padding:5px 0;text-align:center;font:500 14px/1.35 var(--serif);color:var(--ink-3);border-block:1px solid var(--line-forte)}
.edicao .ed-dia{font-variant-caps:small-caps;letter-spacing:.02em}
.edicao .ed-frase{font-style:italic}
.edicao .ed-data{text-wrap:balance}
/* celular estreito: "Edição de" sai da primeira linha (a frase de baixo já diz "uma edição por dia"); assim a data mais longa do ano cabe numa linha a 375 px */
@media (max-width:419px){.edicao .ed-pre{display:none}}
@media (min-width:700px){.edicao p{flex-direction:row;justify-content:center;flex-wrap:wrap;gap:0}.edicao .ed-frase::before{content:"·";display:inline-block;margin:0 .45em;font-style:normal}}
/* computador (pedido do Daniel, 01/11, noite): sem linha de edição; a faixa "Agora" da capa fica igual à das páginas internas */
@media (min-width:1024px){.edicao{display:none}}
/* de 1024 a 1279 px o rótulo "Agora em Itapoá" sai (a seção continua com o nome no aria-label) para os 4 cartões não cortarem o valor */
@media (min-width:1024px) and (max-width:1279px){.agora .rotulo{display:none}.agora .chip{padding:0 12px;gap:10px}}
/* aba Câmeras na barra do celular (pedido do Daniel, 01/11): ponto vermelho de "ao vivo" só com câmera no ar; fixo, nada pisca */
.abas .aba-ico{position:relative;display:inline-flex}
.abas .ponto-vivo{position:absolute;top:-1px;right:-5px;width:10px;height:10px;border-radius:50%;background:var(--verm);box-shadow:0 0 0 2px var(--card)}
/* ===================== SEO das seções de classificados (pedido do Daniel, 01/11): contagem, links entre seções, vagas, obituário ===================== */
.cab-pagina .cab-conta{font-size:14px;color:var(--ink-3);margin-top:6px}
.cab-pagina .chips + .chips{margin-top:8px}
.classif-nav{margin:32px 0 8px}
.classif-nav h2{font:600 20px/1.2 var(--serif);margin-bottom:10px}
.classif-nav ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.classif-nav a{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);font-weight:600;color:var(--ink)}
.classif-nav svg{width:20px;height:20px;color:var(--azul)}
@media (hover:hover){.classif-nav a:hover{border-color:var(--azul);color:var(--azul-esc)}}
.vc-pagina a{background:var(--card)}
@media (min-width:1024px){.vc-pagina{grid-template-columns:repeat(2,minmax(0,1fr))}}
.sub-ficha{font:600 20px/1.2 var(--serif);margin:4px 0 -4px}
.corpo-p{font-size:17px;line-height:1.55;margin:0}
.obituario{max-width:760px}
.obit-lista{display:grid;gap:12px;margin-top:8px}
.obit{display:flex;gap:16px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.obit-foto{width:72px;height:72px;flex:none;border-radius:50%;object-fit:cover;filter:grayscale(1)}
.obit-txt{display:grid;gap:6px;min-width:0}
.obit h2{font:600 22px/1.2 var(--serif);overflow-wrap:anywhere}
.obit p{margin:0;font-size:16px;line-height:1.5;color:var(--ink)}
.obit .obit-meta{font-size:14px;color:var(--ink-3)}
.obit .obit-msg{color:var(--ink-2);font-style:italic}
.obit-comp{justify-self:start;margin-top:4px;min-height:44px}
.obit-comp svg{fill:currentColor}
.obit-envio{font-size:14px;color:var(--ink-3);margin:24px 0 8px}
.obit-envio a{color:var(--azul);font-weight:600;display:inline-block;padding:12px 0;margin:-12px 0}
/* ===================== ajustes da capa (pedidos do Daniel, 01/11, noite) ===================== */
/* destaque 2 mais baixo: foto 16:9 no celular e no máximo 360 px no computador. Foto e texto dividem a mesma célula da grade:
   se o título for maior que a foto, o cartão cresce e a foto acompanha (object-fit cover), então título e hora nunca são cortados */
.d23 .foto-titulo{display:grid;aspect-ratio:auto}
.d23 .foto-titulo img{position:relative;inset:auto;grid-area:1/1;width:100%;height:100%;aspect-ratio:16/9;object-fit:cover;object-position:center}
.d23 .foto-titulo .texto{position:relative;grid-area:1/1;align-self:end}
.d23 .foto-titulo picture{display:contents}
@media (min-width:760px) and (max-width:1023px){.d23 .foto-titulo{aspect-ratio:auto}.d23 .foto-titulo img{aspect-ratio:2/1}}
/* computador (pedido do Daniel, 01/11, noite: "como estava antes"): o D3 volta a ter a foto 16:9 em cima, na largura do cartão, e o D2 ocupa
   a altura inteira da coluna do D3, então as três fotos começam e terminam alinhadas (topo do D2 = topo do 1º D3; pé do D2 = pé do 2º D3) */
@media (min-width:1024px){
  .d23 .foto-titulo{display:block;height:100%;min-height:440px}
  .d23 .foto-titulo img{position:absolute;inset:0;height:100%;aspect-ratio:auto}
  .d23 .foto-titulo .texto{position:absolute;left:0;right:0;bottom:0}
  .d3{grid-template-rows:1fr 1fr;gap:24px}
  .d3 .card-lista img{height:auto;aspect-ratio:12/5}
  /* D2 15% mais baixo (pedido do Daniel, 01/11, noite: de 683 para cerca de 580 px a 1366): a foto do D3 vai de 16:9 para 2:1 e o título
     dele fica em até 2 linhas; o D2 continua com a altura da coluna, então topo e pé seguem alinhados */
  .d3 .card-lista h3{-webkit-line-clamp:2}
}
/* rótulo "Publicidade" e "Utilidade pública" menor e centralizado, com menos espaço até a peça (13 px é o piso do DESIGN) */
/* exceção consciente ao piso de 13 px (pedido do Daniel, 01/11; anotada no DESIGN.md): o rótulo não é conteúdo. 11 px, caixa alta, 0,08em,
   --ink-3 (5,48:1 no branco, 4,69:1 no cinza do "Anuncie aqui"), centralizado no celular e no computador */
.pub small{text-align:center;font:500 11px/1 var(--sans);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
.anuncie-aqui b{font:600 11px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}
.pub-materia small,.pub-materia_meio small{width:auto}
/* ===================== classificado grátis (pedido do Daniel, 01/11): formulário, termos, hub, desapegos e serviços ===================== */
.form-gratis fieldset{border:0;margin:0;padding:0;min-width:0;display:grid;gap:14px}
.form-gratis legend{font-weight:600;font-size:14px;margin-bottom:8px;padding:0}
.form-gratis legend small{font-weight:400;color:var(--ink-3)}
.form-gratis label small{font-size:13px;line-height:1.35}
.tipos-anuncio{grid-template-columns:repeat(2,minmax(0,1fr))}
.tipos-anuncio legend{grid-column:1/-1}
.tipo-op{position:relative;display:block}
.tipo-op input{position:absolute;opacity:0;width:1px;height:1px}
.tipo-op span{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 12px;border:1.5px solid var(--line-forte);border-radius:var(--r-sm);background:#fff;font-weight:600;font-size:15px;cursor:pointer}
.tipo-op span svg{width:20px;height:20px;color:var(--azul)}
.tipo-op input:checked + span{border-color:var(--azul);background:var(--azul-soft);color:var(--azul-esc)}
.tipo-op input:focus-visible + span{box-shadow:var(--foco)}
@media (min-width:600px){.tipos-anuncio{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.tipos-anuncio{grid-template-columns:repeat(5,minmax(0,1fr))}.tipo-op span{flex-direction:column;justify-content:center;gap:4px;min-height:72px;text-align:center}}
.form-gratis .so-tipo{padding:14px;border:1px dashed var(--line-forte);border-radius:var(--r-sm);background:var(--bg)}
@supports selector(:has(*)){
  .form-gratis .so-tipo{display:none}
  .form-gratis:has(input[name=tipo][value=imovel]:checked) .so-imovel,.form-gratis:has(input[name=tipo][value=veiculo]:checked) .so-veiculo,
  .form-gratis:has(input[name=tipo][value=vaga]:checked) .so-vaga{display:grid}
}
.form-leitor .quatro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (min-width:600px){.form-leitor .quatro{grid-template-columns:repeat(4,minmax(0,1fr))}}
.form-leitor input[type=file]{min-height:48px;padding:10px 0;font:400 15px var(--sans);width:100%}
.form-gratis .check-l a{display:inline-block;padding:13px 0;margin:-13px 0;color:var(--azul);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.form-gratis .nota{font-size:14px;color:var(--ink-3);margin:0}
.acoes-envio{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 24px}
.termos{max-width:var(--leitura)}
.termos .corpo h2{font:600 22px/1.25 var(--serif);margin:24px 0 8px}
.termos .corpo p,.termos .corpo li{font-size:17px;line-height:1.6;margin:0 0 10px}
.termos .corpo ul{padding-left:22px;margin:0 0 10px}
.termos .corpo a{color:var(--azul);text-decoration:underline;text-underline-offset:3px}
.cls-anunciar{margin:16px 0 0}
.cls-secoes{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.cls-secoes a{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink)}
.cls-secoes a > svg{width:24px;height:24px;color:var(--azul)}
.cls-secoes span{display:grid;gap:2px}
.cls-secoes b{font-size:17px}
.cls-secoes small{font-size:14px;color:var(--ink-3)}
@media (hover:hover){.cls-secoes a:hover{border-color:var(--azul)}}
@media (min-width:760px){.cls-secoes{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
.local-ficha{display:flex;align-items:center;gap:6px;margin:0;color:var(--ink-2);font-size:15px}
.local-ficha svg{width:18px;height:18px;color:var(--azul)}
.form-leitor .tres-anunciante{display:grid;gap:14px}
@media (min-width:760px){.form-leitor .tres-anunciante{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cab-pagina .link-vaga{font-size:15px;margin-top:8px}
.cab-pagina .link-vaga a,.cab-pagina .bt-anunciar{color:var(--azul);font-weight:600}
.cab-pagina .link-vaga a{display:inline-block;padding:12px 0;margin:-12px 0;text-decoration:underline;text-underline-offset:3px}
.mais-detalhes{border:1px solid var(--line-forte);border-radius:var(--r-sm);background:var(--bg)}
.mais-detalhes summary{display:flex;align-items:center;min-height:48px;padding:0 14px;font-weight:600;cursor:pointer;list-style-position:inside}
.mais-detalhes[open] summary{border-bottom:1px solid var(--line)}
.mais-detalhes .md-campos{display:grid;gap:14px;padding:14px}
.cab-anunciar{margin-top:12px}
/* ===================== ficha de imóvel e veículo no modelo do Portal da Cidade (pedido do Daniel, 01/11) ===================== */
.galeria-classif{position:relative;margin:12px -16px 0;background:var(--ink)}
.gc-trilho{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.gc-trilho::-webkit-scrollbar{display:none}
.gc-trilho figure{flex:0 0 100%;scroll-snap-align:start;margin:0;aspect-ratio:4/3}
.gc-trilho img{width:100%;height:100%;object-fit:cover}
.galeria-classif .car-bt{top:calc(50% - 22px)}
.galeria-classif .car-conta{top:auto;bottom:12px;right:12px}
@media (min-width:760px){.galeria-classif{margin:16px 0 0;border-radius:var(--r);overflow:hidden}.gc-trilho figure{aspect-ratio:16/9}}
@media (min-width:1024px){.gc-trilho figure{flex-basis:calc(50% - 2px);aspect-ratio:4/3;margin-right:4px}.galeria-classif{max-height:460px}.galeria-classif.uma .gc-trilho figure{flex-basis:100%;margin:0;aspect-ratio:auto;height:460px}}
@media (max-width:759px){.galeria-classif .car-bt{display:none}}
.ficha-cl{display:grid;gap:24px;margin-top:16px}
.fc-princ{min-width:0}
.fc-princ h1{font:600 28px/1.15 var(--serif);margin:8px 0 6px;letter-spacing:-.01em;overflow-wrap:anywhere}
.fc-local{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;color:var(--ink-2);font-size:15px}
.fc-local svg{width:18px;height:18px;color:var(--azul)}
.fc-preco{font:600 32px/1.1 var(--serif);color:var(--ink);margin:14px 0 0}
.fc-icones{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.fc-icones li{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);font-weight:600;font-size:15px}
.fc-icones svg{width:24px;height:24px;color:var(--azul);flex:none}
@media (min-width:600px){.fc-icones{grid-template-columns:repeat(4,minmax(0,1fr))}}
.fc-sub{font:600 22px/1.2 var(--serif);margin:28px 0 10px}
.fc-desc{font-size:17px;line-height:1.6}
.fc-mapa{display:grid;grid-template-columns:24px minmax(0,1fr);gap:4px 10px;align-items:center;margin:0;padding:14px 16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm)}
.fc-mapa > svg{width:24px;height:24px;color:var(--azul)}
.fc-mapa span{display:grid;gap:2px;font-weight:600}
.fc-mapa small{font-weight:400;color:var(--ink-3);font-size:14px}
.fc-mapa .bt{grid-column:1/-1;justify-self:start}
@media (min-width:600px){.fc-mapa{grid-template-columns:24px minmax(0,1fr) auto}.fc-mapa .bt{grid-column:auto}}
.fc-lado{display:grid;gap:16px;align-content:start;min-width:0}
.fc-anunciante{display:grid;gap:10px;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
.fc-rot{margin:0;font:700 12px/1 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.fc-quem{display:flex;align-items:center;gap:12px}
.fc-quem img,.fc-ini{width:56px;height:56px;flex:none;border-radius:var(--r-sm);object-fit:contain;background:var(--soft);display:grid;place-items:center}
.fc-ini svg{width:26px;height:26px;color:var(--azul)}
.fc-quem span{display:grid;gap:2px;min-width:0}
.fc-quem b{font-size:17px;line-height:1.25;overflow-wrap:anywhere}
.fc-quem small{font-size:13px;color:var(--ink-3)}
.fc-preco-lado{display:none;margin:0;font:600 26px/1.15 var(--serif)}
.fc-anunciante .bt{min-height:48px}
.fc-mais{display:flex;align-items:center;gap:4px;min-height:44px;color:var(--azul);font-weight:600;font-size:15px}
.fc-mais svg{width:18px;height:18px}
.fc-aviso{margin:0;font-size:13px;line-height:1.45;color:var(--ink-3)}
.fc-lado .pub{margin:0}
@media (min-width:1024px){
  .ficha-cl{grid-template-columns:minmax(0,1fr) var(--lado);gap:32px;align-items:start}
  .fc-princ h1{font-size:40px}
  .fc-lado{position:sticky;top:calc(var(--topo) + 16px)}
  .fc-preco-lado{display:block}
  .fc-parecidos{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.barra-classif{grid-template-columns:1fr 44px}
.barra-classif.so-tel,.barra-classif.so-zap{grid-template-columns:1fr}
.barra-classif .bt{min-height:48px}
/* ===================== guia: logo em contorno, bloco da capa e topo do /guia (pedido do Daniel, 01/11, noite) ===================== */
.logo-guia .lg-svg{height:1.27em;width:auto;display:block;flex:none}
.guia-capa .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.guia-capa .logo-guia{font-size:30px;margin:0}
.guia-capa .gc-busca{width:100%;max-width:640px;margin:16px auto 0}
.gc-grade{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin-top:16px}
.gc-grade a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;min-height:84px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);text-align:left;min-width:0}
.gc-grade a svg{width:24px;height:24px;color:var(--azul)}
.gc-grade b{font-size:15px;line-height:1.25;overflow-wrap:anywhere}
.gc-grade small{font-size:13px;color:var(--ink-3)}
.gc-grade .gc-mais{grid-column:1/-1;min-height:64px;background:var(--azul);border-color:var(--azul);color:#fff;align-items:center;text-align:center}
.gc-grade .gc-mais b{font-size:17px}
.gc-grade .gc-mais small{display:inline-flex;align-items:center;gap:2px;color:rgba(255,255,255,.92);font-weight:600}
.gc-grade .gc-mais small svg{width:16px;height:16px;color:#fff}
@media (hover:hover){.gc-grade a:hover{border-color:var(--azul)}.gc-grade a:hover b{color:var(--azul-esc)}.gc-grade .gc-mais:hover{background:var(--azul-esc)}.gc-grade .gc-mais:hover b{color:#fff}}
@media (min-width:600px){.gc-grade{grid-template-columns:repeat(3,minmax(0,1fr))}.gc-grade .gc-mais{grid-column:auto / span 3}}
@media (min-width:1024px){.guia-capa .logo-guia{font-size:38px}.gc-grade{grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;margin-top:20px}.gc-grade .gc-mais{grid-column:auto;min-height:84px}}
.gt-centro{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:760px;margin:8px auto 0}
.faixa-topo .gt-logo{font-size:32px;margin:0 0 12px}
.faixa-topo .gt-centro h1{font:600 30px/1.12 var(--serif);margin:0;color:#fff;text-wrap:balance}
.faixa-topo .gt-frase{font-size:17px;line-height:1.45;margin:10px 0 0;color:rgba(255,255,255,.94);max-width:600px}
.faixa-topo .gt-busca{margin:18px auto 0;width:100%;max-width:640px}
@media (min-width:1024px){.faixa-topo .gt-logo{font-size:38px}.faixa-topo .gt-centro h1{font-size:46px}.faixa-topo .gt-frase{font-size:19px}}
.gc-busca button,.gt-busca button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:48px}
.gc-busca button svg,.gt-busca button svg{width:20px;height:20px}
.gc-busca input::placeholder,.gt-busca input::placeholder{color:var(--ink-3)}
@media (max-width:599px){.gc-busca button,.gt-busca button{padding:0 12px}.gc-busca button span,.gt-busca button span{display:none}.gc-busca input,.gt-busca input{font-size:15px}}
.cameras .chapeu.aovivo.imagem{background:rgba(12,34,54,.85)}
/* ===================== tempo e maré pela Epagri/Ciram (pedido do Daniel, 01/11) ===================== */
.aviso-tempo{margin:16px 0;padding:14px 16px;border-radius:var(--r-sm);background:var(--verm-soft);border-left:4px solid var(--verm);color:var(--ink)}
.aviso-tempo p{margin:0 0 6px;font-size:15px;line-height:1.45}
.aviso-tempo .at-rot{display:flex;align-items:center;gap:6px;font:700 12px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:#8A0313}
.aviso-tempo .at-rot svg{width:18px;height:18px}
.aviso-tempo .at-tit{font:600 19px/1.25 var(--serif)}
.aviso-tempo .at-quando{font-size:14px;color:var(--ink-2);margin:0}
.aviso-tempo a{color:var(--azul);font-weight:600;display:inline-block;padding:12px 0;margin:-12px 0}
.prev-dias{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pd{display:grid;gap:3px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm)}
.pd:first-child{grid-column:1/-1}
.pd-dia{font-size:15px}.pd-dia small{font-weight:500;color:var(--ink-3);font-size:13px}
.pd-ic svg{width:28px;height:28px;color:var(--azul)}
.pd-mm{font:600 24px/1.1 var(--serif)}.pd-mm span{color:var(--ink-3);font-weight:400}
.pd-cond{font-size:15px;font-weight:600;color:var(--ink-2)}
.pd small{font-size:13px;color:var(--ink-3)}
@media (min-width:760px){.prev-dias{grid-template-columns:repeat(5,minmax(0,1fr))}.pd:first-child{grid-column:auto}}
.texto-meteo .tm-corpo p,.texto-meteo > p{font-size:16px;line-height:1.6;margin:0 0 10px}
.texto-meteo .tm-manchete{font:600 20px/1.3 var(--serif)!important;color:var(--ink)}
.texto-meteo h3{font:600 17px/1.3 var(--sans);margin:18px 0 6px}
.texto-meteo mark{background:var(--azul-soft);color:var(--ink);padding:1px 2px;border-radius:3px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.texto-meteo .nota a{color:var(--azul);font-weight:600;display:inline-block;padding:12px 0;margin:-12px 0}
.mar-agora small{display:block;font-size:13px;color:var(--ink-3)}
.mare-tit{font:600 17px/1.3 var(--sans);margin:16px 0 8px}
.mare-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.mare-lista li{display:grid;gap:2px;padding:10px 12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm)}
.mare-lista li b{font:600 20px/1.1 var(--serif)}
.mare-lista li span{font-size:14px;font-weight:600;color:var(--ink-2)}
.mare-lista li.alta span{color:var(--azul)}
.mare-lista li small{font-size:13px;color:var(--ink-3)}
.mare-lista li.prox{border-color:var(--azul);box-shadow:inset 0 0 0 1px var(--azul)}
.mar-txt{font-size:15px;line-height:1.55;margin:14px 0 0}
.credito-fonte{font-size:14px;color:var(--ink-2);margin:20px 0 0}
.credito-fonte a,.nota a{color:var(--azul);font-weight:600}
/* ===================== publicidade capa_meio: só no celular, entre o D3 e o D4 (pedido do Daniel, 01/11, noite) ===================== */
.pub-capa_meio{margin:16px 0 4px}
.pub-capa_meio .pub-caixa,.pub-capa_meio picture{display:block;max-width:300px;margin-inline:auto}
.pub-ads.pub-capa_meio{min-height:270px}
.pub-vazio.pub-capa_meio .anuncie-aqui{max-width:300px;height:250px}
@media (min-width:760px){.pub-capa_meio{display:none}}
/* ===================== guia na capa, no celular: foto de Itapoá no fundo com véu azul (pedido do Daniel, 01/11, noite) =====================
   O véu (#06396A a 76-80% atrás da logo) deixa a logo branca com mais de 4,5:1 sobre qualquer ponto da foto (pior caso, branco puro
   embaixo: 5,6:1); mais abaixo o véu afina para a foto aparecer, porque ali só há cartões brancos e opacos, com o contraste de sempre. No computador a faixa segue azul-clara, sem foto (a imagem nem é baixada: display:none + lazy). */
.gc-fundo{display:none}
@media (max-width:1023px){
  .guia-capa.gc-com-foto{position:relative;isolation:isolate;background:var(--azul-esc)}
  .guia-capa.gc-com-foto .gc-fundo{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;z-index:-2}
  .guia-capa.gc-com-foto::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,57,106,.8) 0%,rgba(6,57,106,.76) 22%,rgba(6,57,106,.42) 48%,rgba(6,57,106,.58) 100%)}
  .guia-capa.gc-com-foto .logo-guia{color:#fff;--logo-contra:var(--azul);--logo-acento:#fff;--logo-contorno:#fff}
  .guia-capa.gc-com-foto .gc-grade .gc-mais{background:#fff;border-color:#fff;color:var(--azul-esc)}
  .guia-capa.gc-com-foto .gc-grade .gc-mais small,.guia-capa.gc-com-foto .gc-grade .gc-mais small svg{color:var(--azul)}
}
/* ===================== vitrine dos classificados e faixa da capa (pedido do Daniel, 01/11, noite): cartões resumidos ===================== */
.grade-resumo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cl-resumo{display:flex;flex-direction:column;min-height:44px}
.cl-resumo img,.cl-resumo .sem-foto-classif{aspect-ratio:4/3}
.cl-resumo .meta{gap:4px;padding:10px 12px 12px}
.cl-resumo .chapeu{min-height:18px}
.cl-resumo .preco{font:700 16px/1.2 var(--sans);color:var(--azul-esc)}
.cl-resumo h3{font:600 15px/1.3 var(--sans);text-wrap:pretty;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.cl-resumo .hora{font-size:13px;color:var(--ink-3);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.classif-capa{background:var(--card)}
.classif-capa .secao-cab .mais{display:none}
.cls-cab{position:relative}
@media (min-width:760px){.grade-resumo{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.cl-resumo h3{font-size:16px}.classif-capa .secao-cab .mais{display:inline-flex}}
@media (min-width:1024px){.grade-resumo{grid-template-columns:repeat(4,minmax(0,1fr))}.classif-capa .vc-acoes .bt:first-child{display:none}}
@media (max-width:519px){.classif-capa .vc-acoes{grid-template-columns:minmax(0,1fr)}}
/* ===================== anúncio da casa em código: TotalCRM (pedido do Daniel, 01/11, noite) =====================
   Medidas fixas por posição (sem pulo de layout): quadrado 300x300 no meio da matéria; faixa 343x180 no celular e 1200x120 no computador */
.pub-codigo .pub-caixa{display:flex;justify-content:center}
.casa-tcrm,.pub .pub-caixa .casa-tcrm,.corpo .pub .pub-caixa .casa-tcrm{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:10px;text-decoration:none;font-weight:400;box-sizing:border-box;background:var(--tc-fundo);color:#fff;border-radius:12px;padding:16px 18px;text-align:left;text-decoration:none;overflow:hidden;font-family:var(--sans)}
.casa-tcrm .tc-topo{display:flex;align-items:center;justify-content:space-between;gap:8px}
.casa-tcrm .tc-topo img,.pub .pub-caixa .casa-tcrm .tc-topo img,.corpo .pub .casa-tcrm .tc-topo img{height:22px;width:auto;max-width:none;margin:0;border-radius:0}
.casa-tcrm .tc-selo{background:var(--tc-acento);color:var(--tc-fundo);font:800 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:5px 8px;border-radius:5px}
.casa-tcrm .tc-frase{color:#fff;font:800 31px/1.04 var(--sans);letter-spacing:-.02em;text-wrap:balance}
.casa-tcrm .tc-seg{font:500 16px/1.35 var(--sans);color:rgba(255,255,255,.94);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.casa-tcrm .tc-seg b{display:inline-block;background:var(--tc-dest);color:var(--tc-dest-txt);font-weight:800;padding:1px 7px;border-radius:5px;margin-right:2px}
.casa-tcrm .tc-bt{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:auto;background:var(--tc-bt);color:var(--tc-bt-txt);font:800 16px/1 var(--sans);border-radius:10px}
.casa-tcrm .tc-bt svg{width:22px;height:22px;fill:currentColor}
.pub .pub-caixa .casa-tcrm.tc-quadrado{width:300px;height:300px}
.pub .pub-caixa .casa-tcrm.tc-faixa{width:100%;max-width:400px;height:180px;margin-inline:auto;padding:14px 16px;gap:6px}
.casa-tcrm.tc-faixa .tc-frase{font-size:21px}
.casa-tcrm.tc-faixa .tc-seg{font-size:14px;-webkit-line-clamp:2}
.casa-tcrm.tc-faixa .tc-bt{min-height:44px;font-size:15px}
@media (hover:hover){.casa-tcrm:hover .tc-bt{filter:brightness(.95)}}
.casa-tcrm:focus-visible{outline:0;box-shadow:var(--foco)}
@media (min-width:1024px){
  .pub .pub-caixa .casa-tcrm.tc-faixa{max-width:1200px;height:120px;display:grid;grid-template-columns:150px minmax(0,1fr) 220px;grid-template-rows:auto auto;align-items:center;column-gap:28px;row-gap:4px;padding:16px 28px}
  .casa-tcrm.tc-faixa .tc-topo{grid-row:1/3;flex-direction:column;align-items:flex-start;gap:10px}
  .casa-tcrm.tc-faixa .tc-topo img{height:26px}
  .casa-tcrm.tc-faixa .tc-frase{font-size:30px;align-self:end}
  .casa-tcrm.tc-faixa .tc-seg{font-size:16px;-webkit-line-clamp:1;align-self:start}
  .casa-tcrm.tc-faixa .tc-bt{grid-column:3;grid-row:1/3;margin:0;min-height:52px;font-size:17px}
}
.pub-codigo.pub-topo{min-height:0}
/* D2 no celular um pouco menor, para a manchete D1 (26 px) seguir acima dele na hierarquia (pedido do Daniel, 01/11, noite) */
@media (max-width:1023px){.d23 .foto-titulo h2{font-size:23px}}
/* menu do computador (pedido do Daniel, 01/11, noite: "aquele traço embaixo do menu ativo pode ficar embaixo dos demais menus, menos do
   início"): fio fino cinza sob todos os itens menos Início; no hover o fio fica azul; o item ativo ganha o fio azul grosso */
@media (min-width:1024px){
  .nav-d > a,.menu-d > summary{position:relative;border-bottom-color:transparent!important}
  .nav-d > a:not(:first-child)::after,.menu-d > summary::after{content:"";position:absolute;left:8px;right:8px;bottom:14px;height:2px;border-radius:2px;background:var(--line)}
  .nav-d > a:not(:first-child):hover::after,.menu-d > summary:hover::after,.menu-d[open] > summary::after{background:var(--azul)}
  .nav-d > a[aria-current=page]:not(:first-child)::after,.menu-d > summary.ativo::after{height:4px;bottom:13px;background:var(--azul)}
}
@media (min-width:1024px) and (max-width:1279px){.nav-d > a:not(:first-child)::after,.menu-d > summary::after{left:5px;right:5px}}
/* corpo da matéria justificado no computador (pedido do Daniel, 01/11, noite): ~760 px (75 a 90 caracteres por linha), com hifenização
   (lang pt-BR no html); só nos parágrafos do texto, nunca em legenda, lista, citação ou "O que você precisa saber"; no celular, à esquerda */
@media (min-width:1024px){
  .materia .corpo{max-width:760px}
  .materia .corpo > p{text-align:justify;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:6 3 3}
}
/* guia na capa, no computador (pedido do Daniel, 01/11, noite): duas linhas de 7 cartões; 13 trocam a categoria com fade, em onda, e o
   "Ver o guia completo" fica fixo; foto de Itapoá bem clara no fundo da faixa (a logo e os cartões seguem sobre o azul-claro) */
.gc-giro{display:none}
@media (min-width:1024px){
  .guia-capa .gc-grade{display:none}
  .gc-giro{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;width:100%;margin-top:20px}
  .gc-cel{display:grid;min-height:96px}
  .gc-face{grid-area:1/1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);text-align:left;min-width:0;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s}
  .gc-face.on{opacity:1;visibility:visible;transition-delay:.3s}
  .gc-face svg{width:24px;height:24px;color:var(--azul)}
  .gc-face b{font-size:15px;line-height:1.25;overflow-wrap:anywhere}
  .gc-face small{font-size:13px;color:var(--ink-3)}
  .gc-giro .gc-mais{grid-column:auto;min-height:96px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:12px;background:var(--azul);border:1px solid var(--azul);border-radius:var(--r-sm);color:#fff;text-align:center}
  .gc-giro .gc-mais b{font-size:17px}
  .gc-giro .gc-mais small{display:inline-flex;align-items:center;gap:2px;color:rgba(255,255,255,.92);font-weight:600;font-size:13px}
  .gc-giro .gc-mais small svg{width:16px;height:16px;color:#fff}
  .guia-capa.gc-com-foto{position:relative;isolation:isolate}
  .guia-capa.gc-com-foto .gc-fundo{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;z-index:-1;opacity:.14}
}
@media (min-width:1024px) and (hover:hover){.gc-face:hover{border-color:var(--azul)}.gc-face:hover b{color:var(--azul-esc)}.gc-giro .gc-mais:hover{background:var(--azul-esc)}}
@media (prefers-reduced-motion:reduce){.gc-face,.gc-face.on{transition:none}}
/* classificados da capa rodando sozinhos (pedido do Daniel, 01/11, noite): trilho com encaixe, 2 cartões inteiros no celular, 3 no tablet e
   4 no computador; ícone de jornal no título */
.h2-ico{display:inline-flex;align-items:center;gap:10px}
.h2-ico svg{width:26px;height:26px;color:var(--azul);flex:none}
.cl-trilho{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 12px) / 2);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.cl-trilho::-webkit-scrollbar{display:none}
.cl-trilho > .cl-resumo{scroll-snap-align:start}
@media (min-width:760px){.cl-trilho{grid-auto-columns:calc((100% - 32px) / 3);gap:16px}}
@media (min-width:1024px){.cl-trilho{grid-auto-columns:calc((100% - 48px) / 4)}}
/* turismo na capa (pedido do Daniel, 01/11, noite): fotos grandes do banco (crédito em cada ponto e em /creditos), nome e uma linha sobre
   degradê escuro (texto branco acima de 4,5:1 no pé da foto), faixa com encaixe no celular e 4 cartões no computador */
.tur-trilho{display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -16px;padding:0 16px;scroll-padding-inline:16px}
.tur-trilho::-webkit-scrollbar{display:none}
.tur-card{position:relative;display:block;scroll-snap-align:start;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--azul-esc);color:#fff}
.tur-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tur-card .tur-ico{position:absolute;inset:0;display:grid;place-items:center;background:var(--azul-soft);color:var(--azul)}
.tur-card .tur-ico svg{width:48px;height:48px}
.tur-card .tur-txt{position:absolute;left:0;right:0;bottom:0;display:grid;gap:4px;padding:56px 16px 16px;background:linear-gradient(to top,rgba(12,34,54,.92) 0%,rgba(12,34,54,.78) 50%,rgba(12,34,54,0) 100%)}
.tur-card small{font:700 12px/1.1 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.9)}
.tur-card b{font:600 22px/1.15 var(--serif);text-wrap:balance}
.tur-card .tur-txt > span{font-size:15px;line-height:1.35;color:rgba(255,255,255,.92);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tur-card.sem-foto .tur-txt{background:var(--azul-esc);padding-top:16px}
.tur-ver{display:flex;width:100%;max-width:360px;min-height:48px;margin:16px auto 0;justify-content:center;gap:4px}
.tur-ver svg{width:18px;height:18px}
@media (hover:hover){.tur-card:hover b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}}
@media (min-width:760px){.tur-trilho{grid-auto-columns:calc((100% - 24px) / 3)}}
@media (min-width:1024px){
  .tur-trilho{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-columns:auto;overflow:visible;margin:0;padding:0;gap:16px}
  .tur-card:nth-child(n+5){display:none}
  .tur-card{aspect-ratio:3/4}
}
/* /turismo: o bairro do ponto em azul (o vermelho do portal é só de urgente e ao vivo), pedido do Daniel ("o turismo também precisa melhorar") */
.pontos-grade .pt .loc{color:var(--azul);border-left:3px solid currentColor;padding-left:8px;font-weight:700;letter-spacing:.06em}
/* /turismo: atalhos do topo com alvo de 44 px (eram 36) */
.tur-atalhos a{min-height:44px;display:inline-flex;align-items:center}
.gi-nome{min-height:44px}
.gi-zap{min-width:44px;min-height:44px}

/* menu principal do computador centralizado (pedido do Daniel, 02/11): grade de 3 colunas, logo à esquerda, menu no centro da página e
   busca + sino à direita; as colunas laterais têm a mesma largura quando sobra espaço, e nunca menos que o próprio conteúdo */
.topo-acoes{display:contents}
@media (min-width:1024px){
  .topo .wrap{display:grid;grid-template-columns:minmax(max-content,1fr) auto minmax(max-content,1fr);gap:16px}
  .topo .logo{justify-self:start;margin:0}
  .topo-acoes{display:flex;align-items:center;gap:4px;justify-self:end}
  .topo-acoes .bt-busca{margin-left:0}
}
@media (min-width:1024px) and (max-width:1279px){.topo .wrap{gap:8px}}

/* guia na capa e topo do /guia (pedido do Daniel, 02/11). No computador a logo grande sai do hero (o nome "Tudo em Itapoá" aparecia duas
   vezes) e fica só o alfinete da Pedra, grande e claro, de marca-d'água à direita. Os cartões que trocam de categoria não piscam mais: o
   cartão (fundo e borda) fica parado na célula e só o texto troca, com fade, dentro dele. No celular nada muda. */
.gc-marca,.gt-marca,.gc-tit-pc,.gc-frase-pc{display:none}
@media (min-width:1024px){
  .guia-capa{overflow:hidden}
  .guia-capa .wrap{position:relative;align-items:flex-start;text-align:left}
  .guia-capa .gc-logo-cel{display:none}
  .guia-capa .gc-tit-pc{display:inline;font:600 28px/1.15 var(--serif);color:var(--ink);letter-spacing:-.01em}
  .guia-capa .gc-frase-pc{display:block;margin:6px 0 0;font-size:17px;color:var(--ink-2)}
  .guia-capa .gc-busca{margin:16px 0 0;max-width:720px}
  .gc-marca{display:block;position:absolute;right:max(24px,calc(50% - 600px));top:50%;height:150%;width:auto;transform:translateY(-50%);color:var(--azul);opacity:.07;pointer-events:none;z-index:0}
  .guia-capa.gc-com-foto .gc-marca{z-index:-1}
  .gc-cel{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm)}
  .gc-face{background:none;border:0;transition:opacity .25s ease,visibility .25s}
  .gc-face.on{transition-delay:.25s}
  .gt-hero{overflow:hidden}
  .gt-hero .gt-logo{display:none}
  .gt-marca{display:block;position:absolute;right:max(24px,calc(50% - 600px));top:50%;height:140%;width:auto;transform:translateY(-50%);color:#fff;opacity:.09;pointer-events:none}
}
@media (min-width:1024px) and (hover:hover){.gc-cel:hover{border-color:var(--azul)}.gc-face:hover{border:0}.gc-cel:hover .gc-face.on b{color:var(--azul-esc)}}

/* categoria do guia refeita no celular (pedido do Daniel, 02/11): cabeçalho curto, busca da categoria, filtros numa linha rolável com
   ícone e fundo suave, cartões mais limpos com nome, bairro e "aberto agora" e os dois botões lado a lado; primeira empresa na 1ª tela */
.busca-cat button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.busca-cat button svg{width:20px;height:20px}
.filtros-cat button svg{width:18px;height:18px;margin-right:6px;flex:none}
@media (max-width:1023px){
  .cab-cat{padding-top:12px}
  .cab-cat h1{font-size:25px;line-height:1.15}
  .cab-cat .h1-onde{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .cab-cat > .cat-conta{margin:4px 0 0;font-size:14px;color:var(--ink-3)}
  .busca-cat{margin:12px 0 0;max-width:none;flex-wrap:nowrap}
  .busca-cat input{height:44px;font-size:16px}
  .busca-cat button{height:44px;width:48px;padding:0}
  .busca-cat button span{display:none}
  .filtros-cat{margin-top:10px!important}
  .filtros-cat button[aria-pressed]{background:var(--soft);box-shadow:none;color:var(--ink)}
  .filtros-cat button[aria-pressed] svg{color:var(--azul)}
  .filtros-cat button[aria-pressed=true]{background:var(--azul);color:#fff}
  .filtros-cat button[aria-pressed=true] svg{color:#fff}
  .filtros-cat a,.filtros-cat button{padding:0 14px}
  .pag-lista .secao.primeira{margin-top:12px}
  .empresas{gap:10px}
  .empresa{padding:14px 14px 12px;gap:10px;border-radius:var(--r)}
  .empresa h3{font-size:17px;line-height:1.3}
  .empresa .onde{font-size:14px;color:var(--ink-2);margin-top:2px}
  .acoes-emp .bt{min-height:44px}
}
@media (max-width:1023px){.pag-lista .secao.primeira{margin-top:8px}}

/* Turismo (pedido do Daniel, 02/11). Computador: painel do menu com a foto do topo do /turismo de fundo, véu azul, os pontos em lista com
   miniatura de 48 px e os atalhos no pé. Celular: Turismo vira grupo na gaveta azul, como Notícias e Serviços. /turismo: topo no padrão
   dos outros heróis (uma foto grande com véu, migalha, h1 e atalhos), no lugar do mosaico. */
@media (min-width:1024px){
  .menu-tur .sub-tur{left:auto;right:0;width:560px;min-width:0;padding:16px;gap:12px;color:#fff;border-top-color:var(--verm);
    background:linear-gradient(160deg,rgba(6,57,106,.93),rgba(6,57,106,.86)),var(--tur-foto,none) center/cover no-repeat var(--azul-esc)}
  .sub-tur .tur-cab{margin:0;display:grid;gap:2px;padding:0 4px}
  .sub-tur .tur-cab b{font:600 22px/1.2 var(--serif);color:#fff}
  .sub-tur .tur-cab span{font-size:14px;color:rgba(255,255,255,.9)}
  .sub-tur .tur-lista{display:grid;grid-template-columns:1fr 1fr;gap:4px}
  .menu-d .sub-tur .tur-lista a{display:flex;align-items:center;gap:12px;min-height:64px;padding:8px;color:#fff;white-space:normal;border-radius:var(--r-sm)}
  .sub-tur .tur-lista img{width:48px;height:48px;border-radius:8px;object-fit:cover;flex:none;background:rgba(255,255,255,.15)}
  .sub-tur .tur-lista span{display:grid;gap:2px;min-width:0}
  .sub-tur .tur-lista b{font-size:15px;font-weight:600;line-height:1.25}
  .sub-tur .tur-lista small{font-size:13px;color:rgba(255,255,255,.85)}
  .sub-tur .tur-pe{display:flex;flex-wrap:wrap;gap:6px;padding-top:12px;border-top:1px solid rgba(255,255,255,.22)}
  .menu-d .sub-tur .tur-pe a{min-height:44px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-size:14px;font-weight:600}
  .menu-d .sub-tur .tur-pe a:first-child{background:#fff;color:var(--azul-esc)}
  .menu-d .sub-tur .tur-pe a:first-child svg{color:var(--azul)}
  .menu-d .sub-tur a:hover,.menu-d .sub-tur a[aria-current=page]{background:rgba(255,255,255,.2);color:#fff}
  .menu-d .sub-tur .tur-pe a:first-child:hover{background:var(--azul-soft);color:var(--azul-esc)}
}
.menu-cel .grupo-tur a{line-height:1.25;padding-top:6px;padding-bottom:6px}
.tur-topo{background-position:center 40%}
.tur-topo .tt-centro .chapeu{color:#fff;border-left-color:var(--verm)}
.tur-topo .tt-centro h1{margin-top:6px}
.tur-topo .tur-atalhos{justify-content:center;margin-top:16px}

/* lightbox das fotos dos classificados (pedido do Daniel, 02/11): fundo escuro, foto inteira, botões de 44 px, zoom de 2x com arraste */
.lb{position:fixed;inset:0;z-index:300;background:rgba(6,16,28,.96);color:#fff}
.lb[hidden]{display:none}
.lb-palco{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:pan-y}
.lb-palco img{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in;user-select:none}
.lb.zoom .lb-palco{display:block;overflow:auto;touch-action:auto}
.lb.zoom .lb-palco img{max-width:none;max-height:none;width:200%;height:auto;cursor:zoom-out}
@media (orientation:landscape){.lb.zoom .lb-palco img{width:auto;height:200%}}
.lb-bt{position:absolute;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.lb-bt svg{width:24px;height:24px}
.lb-bt:focus-visible{box-shadow:var(--foco);outline:0}
.lb-fecha{top:12px;right:12px}.lb-zoom{top:12px;right:64px}
.lb-ant{left:12px;top:calc(50% - 22px)}.lb-prox{right:12px;top:calc(50% - 22px)}
.lb-bt[hidden]{display:none}
.lb-conta{position:absolute;top:22px;left:16px;font-size:14px;font-weight:600;background:rgba(0,0,0,.4);padding:3px 10px;border-radius:999px}
@media (hover:hover){.lb-bt:hover{background:rgba(255,255,255,.28)}}
.galeria-classif img,.ficha-classif .foto-materia img{cursor:zoom-in}

/* selo "Verificado" das empresas destaque do guia (pedido do Daniel, 02/11): check azul discreto ao lado do nome */
.verificado{display:inline-flex;align-items:center;gap:4px;vertical-align:-3px;margin-left:6px;color:var(--azul);font:600 13px/1 var(--sans);letter-spacing:0}
.verificado svg{width:18px;height:18px;flex:none}
h1 .verificado{vertical-align:middle;margin-left:8px;padding:4px 10px 4px 6px;border-radius:999px;background:var(--azul-soft);color:var(--azul-esc)}
h1 .verificado svg{width:20px;height:20px;color:var(--azul)}
.empresa .verificado + .selo{margin-left:6px}

/* posições novas (pedido do Daniel, 02/11), desligadas por ajuste: banner acima do cabeçalho e rodapé fixo que fecha (X de 44 px, lembra
   por 24 h). No celular o rodapé fixo fica acima da barra de abas (ou da barra de compartilhar da matéria), nunca por cima dela. */
.pub-topo_site{margin:0;padding:8px 16px;background:var(--soft);border-bottom:1px solid var(--line)}
.pub-topo_site small{text-align:center;font-size:11px;margin-bottom:4px}
.pub-topo_site img,.pub-topo_site video{width:auto;max-width:100%;max-height:100px;margin:0 auto}
.pub-fixo{position:fixed;left:0;right:0;bottom:calc(56px + env(safe-area-inset-bottom));z-index:90;background:var(--card);border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(12,34,54,.12);padding:4px 52px 6px}
.pub-fixo[hidden]{display:none}
.pub-fixo .pub{margin:0}
.pub-fixo .pub small{text-align:center;font-size:11px;margin-bottom:2px}
.pub-fixo .pub img,.pub-fixo .pub video{width:auto;max-width:100%;max-height:60px;margin:0 auto}
.pub-fixo-x{position:absolute;top:50%;right:4px;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:var(--soft);color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0}
.pub-fixo-x svg{width:22px;height:22px}
html.com-pub-fixo body{padding-bottom:84px}
@media (min-width:1024px){.pub-fixo{bottom:0}.pub-fixo .pub img,.pub-fixo .pub video{max-height:90px}html.com-pub-fixo body{padding-bottom:110px}}

/* TotalCRM em código com a identidade dos posts do Instagram @sistematotalcrm (pedido do Daniel, 02/11): degradê do azul-marinho ao azul,
   título branco em 800 com a parte em destaque em azul-claro, selo branco com ponto azul e o nome do segmento, logo branca */
.casa-tcrm.tc-ig,.pub .pub-caixa .casa-tcrm.tc-ig,.corpo .pub .pub-caixa .casa-tcrm.tc-ig{background:linear-gradient(150deg,var(--tc-f1) 0%,var(--tc-f1) 30%,var(--tc-f2) 68%,var(--tc-f3) 100%);padding:16px 18px 16px;gap:8px}
.casa-tcrm.tc-ig .tc-topo img,.pub .pub-caixa .casa-tcrm.tc-ig .tc-topo img,.corpo .pub .casa-tcrm.tc-ig .tc-topo img{height:20px}
.casa-tcrm.tc-ig .tc-selo{display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--tc-f1);font:800 11px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:6px 10px 6px 8px;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62%}
.casa-tcrm.tc-ig .tc-selo i{width:7px;height:7px;border-radius:50%;background:var(--tc-dest);flex:none;box-shadow:0 0 0 2px rgba(91,211,245,.25)}
.casa-tcrm.tc-ig .tc-frase{font:800 30px/1.02 var(--sans);letter-spacing:-.035em;color:#fff;text-transform:none;margin-top:4px}
.casa-tcrm.tc-ig .tc-frase em{font-style:normal;color:var(--tc-dest)}
.casa-tcrm.tc-ig .tc-seg{font:700 15px/1.3 var(--sans);color:rgba(255,255,255,.95);-webkit-line-clamp:3}
.casa-tcrm.tc-ig .tc-bt{border-radius:999px;min-height:44px;font-size:15px}
.casa-tcrm.tc-ig.tc-faixa .tc-frase{font-size:21px}
.casa-tcrm.tc-ig.tc-faixa .tc-seg{font-size:14px;-webkit-line-clamp:2}
@media (min-width:1024px){
  .pub .pub-caixa .casa-tcrm.tc-ig.tc-faixa{grid-template-columns:170px minmax(0,1fr) 220px}
  .casa-tcrm.tc-ig.tc-faixa .tc-topo{flex-direction:column-reverse;align-items:flex-start;gap:12px}
  .casa-tcrm.tc-ig.tc-faixa .tc-selo{max-width:100%}
  .casa-tcrm.tc-ig.tc-faixa .tc-frase{font-size:32px}
  .casa-tcrm.tc-ig.tc-faixa .tc-seg{font-size:16px;-webkit-line-clamp:1}
  .casa-tcrm.tc-ig.tc-faixa .tc-bt{min-height:52px;font-size:17px}
}
