/* ==========================================================================
   Mural 17 — estilos do tema
   A home é um mural: um painel em blocos de tamanhos diferentes.
   ========================================================================== */

:root {
	--m17-accent: #E5232D;
	--m17-accent-esc: #B81A22;
	--m17-ink: #0E1014;
	--m17-ink-2: #3A4048;
	--m17-muted: #5B626B;
	--m17-line: #E3E5E8;
	--m17-line-2: #ECEEF0;
	--m17-soft: #F3F4F6;
	--m17-photo: #D5DAE0;
	--m17-ipe: #FFC531;
	--m17-blue: #1F4E79;
	--m17-blue-soft: #E8EEF5;
	--m17-orange: #C2410C;
	--m17-wa: #0F7A40;
	--m17-marca: "Unbounded", "Arial Black", sans-serif;
	--m17-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
	--m17-sans: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
	--m17-radius: 8px;
	--m17-radius-g: 14px;
	--m17-wrap: 1240px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	background: var(--m17-soft);
	color: var(--m17-ink);
	font-family: var(--m17-sans);
	font-size: 16px;
	line-height: 1.5;
}

img { max-width: 100%; height: auto; display: block; }

[hidden] { display: none !important; }

a { color: var(--m17-ink); text-decoration: none; }
a:hover { color: var(--m17-accent); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
summary:focus-visible { outline: 3px solid var(--m17-accent); outline-offset: 2px; }

h1, h2, h3, h4 { text-wrap: balance; }

.wrap {
	max-width: var(--m17-wrap);
	margin: 0 auto;
	padding-left: max(24px, env(safe-area-inset-left, 0px));
	padding-right: max(24px, env(safe-area-inset-right, 0px));
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.pular {
	position: absolute; left: 12px; top: -60px; z-index: 100;
	background: var(--m17-ink); color: #FFFFFF; padding: 10px 16px; border-radius: var(--m17-radius);
}
.pular:focus { top: 12px; color: #FFFFFF; }

.vazio { color: var(--m17-muted); margin: 0; }

/* Botões ------------------------------------------------------------------ */

.botao {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 0 18px;
	background: var(--m17-accent); color: #FFFFFF;
	border: 0; border-radius: var(--m17-radius);
	font: 600 15px/1 var(--m17-sans);
	cursor: pointer; white-space: nowrap;
}
.botao:hover { color: #FFFFFF; background: var(--m17-accent-esc); }
.botao--largo { width: 100%; }
.botao--wa { background: var(--m17-wa); }
.botao--wa:hover { background: #0B5E31; }
.botao--pilula { border-radius: 999px; }

.botao-icone {
	width: 44px; height: 44px; padding: 0; flex-shrink: 0;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent; border: 0; border-radius: 50%; color: var(--m17-ink); cursor: pointer;
}
.botao-icone--claro { background: var(--m17-soft); }
.botao-icone:hover { color: var(--m17-accent); }

.pilula {
	flex-shrink: 0;
	font-size: 12px; font-weight: 600;
	color: var(--m17-blue); background: var(--m17-blue-soft);
	padding: 4px 10px; border-radius: 999px;
}

/* Cabeçalho --------------------------------------------------------------- */

.cab {
	position: sticky; top: 0; z-index: 30;
	background: rgba(255, 255, 255, 0.96);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--m17-line);
}
.admin-bar .cab { top: 32px; }
.cab__in { display: flex; align-items: center; gap: 18px; min-height: 68px; }
.cab__logo { display: inline-flex; flex-shrink: 0; }
.marca__logo img { height: 30px; width: auto; }
.custom-logo { max-height: 40px; width: auto; }
.menu-abrir { display: none; }

.cidade-botao {
	display: inline-flex; align-items: center; gap: 7px;
	min-height: 40px; padding: 0 14px;
	background: var(--m17-soft); color: var(--m17-ink);
	border: 0; border-radius: 999px; cursor: pointer;
	font: 600 14px/1 var(--m17-sans); white-space: nowrap;
	max-width: 220px;
}
.cidade-botao svg { color: var(--m17-accent); flex-shrink: 0; }
.cidade-botao__nome { overflow: hidden; text-overflow: ellipsis; }
.cidade-botao:hover { background: var(--m17-line); }

.nav { margin-left: auto; min-width: 0; }
.nav__lista { list-style: none; margin: 0; padding: 0; display: flex; gap: 2px; }
.nav__lista a {
	display: block; padding: 9px 12px; border-radius: 999px;
	font: 600 14px/1 var(--m17-sans); color: var(--m17-ink-2); white-space: nowrap;
}
.nav__lista a:hover { background: var(--m17-soft); color: var(--m17-ink); }
.nav__lista .current-menu-item > a,
.nav__lista .current-cat > a { background: var(--m17-ink); color: #FFFFFF; }
.nav__busca { display: none; }

.cab__acoes { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.busca-painel { border-top: 1px solid var(--m17-line); padding: 12px 0; background: #FFFFFF; }
.busca { display: flex; align-items: stretch; max-width: 640px; }
.busca__campo {
	flex: 1; min-width: 0; height: 46px; padding: 0 16px;
	border: 1px solid #C9CED4; border-right: 0; border-radius: 999px 0 0 999px;
	font: 400 16px var(--m17-sans); background: #FFFFFF; color: var(--m17-ink);
}
.busca__botao {
	width: 52px; border: 0; border-radius: 0 999px 999px 0; cursor: pointer;
	background: var(--m17-ink); color: #FFFFFF;
	display: inline-flex; align-items: center; justify-content: center;
}

/* Seletor de cidade --------------------------------------------------------- */

.cidades {
	width: min(720px, calc(100% - 32px)); max-height: min(80vh, 760px);
	padding: 0; border: 0; border-radius: var(--m17-radius-g);
	background: #FFFFFF; color: var(--m17-ink);
	box-shadow: 0 24px 60px rgba(14, 16, 20, 0.28);
}
.cidades[open] { display: flex; flex-direction: column; }
.cidades::backdrop { background: rgba(14, 16, 20, 0.55); }
.cidades__topo { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 20px 20px 8px 24px; }
.cidades__titulo { margin: 0; font: 900 22px/1.1 var(--m17-marca); letter-spacing: -0.02em; }
.cidades__busca {
	margin: 4px 24px 0; height: 50px; padding: 0 18px;
	border: 2px solid var(--m17-ink); border-radius: 999px;
	font: 500 17px var(--m17-sans); color: var(--m17-ink); background: #FFFFFF;
}
.cidades__local {
	margin: 10px 24px 0; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
	background: var(--m17-ink); color: #FFFFFF; border: 0; border-radius: 999px; padding: 10px 16px;
	font: 600 14px/1 var(--m17-sans); cursor: pointer;
}
.cidades__local:disabled { opacity: 0.6; cursor: progress; }
.cidades__dica { margin: 8px 24px 0; font-size: 13px; color: var(--m17-muted); }
.cidades__lista { overflow-y: auto; padding: 8px 24px 24px; display: flex; flex-direction: column; gap: 18px; }
.cidades__grupo { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--m17-line); padding-top: 14px; }
.cidades__regiao { margin: 0; font: 700 12px/1 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase; }
.cidades__regiao a { color: var(--m17-accent); }
.cidades__grupo ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.cidades__grupo li a {
	display: inline-block; padding: 8px 12px; border-radius: 999px;
	background: var(--m17-soft); font: 500 14px/1 var(--m17-sans);
}
.cidades__grupo li a:hover { background: var(--m17-ink); color: #FFFFFF; }
.cidades__nada { margin: 0; color: var(--m17-muted); }

/* Última hora (páginas internas) ------------------------------------------ */

.ultima-hora { background: var(--m17-ink); color: #E6E8EB; font-size: 14px; }
.ultima-hora__in { display: flex; gap: 14px; align-items: center; padding-top: 10px; padding-bottom: 10px; overflow: hidden; }
.ultima-hora__selo {
	flex-shrink: 0; background: var(--m17-ipe); color: var(--m17-ink);
	font-weight: 700; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
	padding: 5px 10px; border-radius: 999px;
}
.ultima-hora__lista {
	list-style: none; margin: 0; padding: 0;
	display: flex; gap: 12px; white-space: nowrap; overflow-x: auto; scrollbar-width: none;
}
.ultima-hora__lista::-webkit-scrollbar { display: none; }
.ultima-hora__lista a { color: #E6E8EB; }
.ultima-hora__lista a:hover { color: #FFFFFF; text-decoration: underline; }
.ultima-hora__lista li + li::before { content: "·"; margin-right: 12px; color: #6B727B; }

/* Anúncios ---------------------------------------------------------------- */

.anuncio { margin: 24px auto; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.anuncio--728 { max-width: 728px; min-height: 90px; padding: 0 24px; }
.anuncio--300 { width: 300px; max-width: 100%; min-height: 250px; margin: 0; }
.anuncio--vazio {
	border: 1.5px dashed #A9B0B8; border-radius: var(--m17-radius);
	color: var(--m17-muted); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase;
	flex-direction: column; gap: 4px; text-align: center;
}
.anuncio--vazio small { text-transform: none; letter-spacing: 0; }

/* Estrutura --------------------------------------------------------------- */

.principal { padding-top: 28px; padding-bottom: 64px; display: flex; flex-direction: column; gap: 44px; }
.principal--mural { padding-top: 0; gap: 0; }
/* Faixas com rolagem lateral (agenda, regiões) não podem alargar a página. */
.principal > *,
.mural > *,
.secao > * { min-width: 0; }
.principal > .wrap { width: 100%; }

.secao { display: flex; flex-direction: column; gap: 18px; padding-top: 44px; }
.principal:not(.principal--mural) > .secao:first-child,
.principal:not(.principal--mural) > div > .secao:first-child { padding-top: 0; }
.secao__topo { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; }
.secao__titulo { margin: 0; font: 900 clamp(22px, 3vw, 30px)/1.05 var(--m17-marca); letter-spacing: -0.025em; }
.secao__link { font-size: 15px; font-weight: 600; color: var(--m17-accent); white-space: nowrap; }

.secao--com-lateral { display: flex; flex-flow: row wrap; gap: 32px; align-items: flex-start; }
.secao--com-lateral > :first-child { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.lateral { flex: 1 1 280px; display: flex; flex-direction: column; gap: 24px; }

.duas-colunas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); gap: 32px; }
.grade-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 20px; }

/* Mídia ------------------------------------------------------------------- */

.midia { display: block; border-radius: var(--m17-radius); overflow: hidden; background: var(--m17-photo); aspect-ratio: 16 / 9; }
.midia img { width: 100%; height: 100%; object-fit: cover; }
.midia__vazia { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, #D5DAE0, #B9C1CB); }

/* Rótulos ----------------------------------------------------------------- */

.card__rotulos { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.chapeu {
	font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--m17-blue);
}
.chapeu--destaque { color: var(--m17-accent); }
.selo {
	font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
	color: #FFFFFF; padding: 4px 8px; border-radius: 999px; background: var(--m17-ink);
}
.selo--transito { background: var(--m17-orange); }

/* Cartões de notícia ------------------------------------------------------ */

.card { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.card__corpo { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.card__titulo { margin: 0; font-family: var(--m17-serif); font-weight: 700; font-size: 20px; line-height: 1.22; }
.card__linha-fina { margin: 0; font-size: 17px; color: var(--m17-ink-2); max-width: 62ch; }
.card__meta { margin: 0; font-size: 13px; color: var(--m17-muted); }

.card--grande .card__titulo { font-weight: 800; font-size: 38px; line-height: 1.1; letter-spacing: -0.015em; }
.card--texto { border-top: 1px solid var(--m17-line); padding-top: 18px; }
.card--lateral {
	flex-direction: row; align-items: flex-start; gap: 18px;
	background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 14px;
}
.card--lateral .card__midia { flex: 0 0 200px; aspect-ratio: 4 / 3; }

.lista { display: flex; flex-direction: column; gap: 12px; }

/* Topo "Hoje no 17" ------------------------------------------------------- */

.hoje { background: var(--m17-ink); color: #FFFFFF; }
.hoje__in { padding-top: 34px; padding-bottom: 26px; display: flex; flex-direction: column; gap: 26px; }
.hoje__topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px 24px; flex-wrap: wrap; }
.hoje__titulos { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.hoje__caminho { margin: 0; font-size: 13px; color: #9BA1AA; }
.hoje__caminho a { color: #C3C8CE; }
.hoje__caminho a:hover { color: #FFFFFF; }
.hoje__titulo { margin: 0; font: 900 clamp(34px, 6vw, 68px)/0.98 var(--m17-marca); letter-spacing: -0.035em; }
.hoje__titulo span { color: var(--m17-accent); }
.hoje__data { margin: 0; color: #B9BEC5; font-size: 15px; }
.hoje__minha {
	display: inline-flex; align-items: center; gap: 6px; margin-left: auto;
	background: var(--m17-ipe); color: var(--m17-ink); border-radius: 999px;
	padding: 9px 16px; font: 600 14px/1 var(--m17-sans);
}
.hoje__minha:hover { color: var(--m17-ink); background: #FFD45C; }

.numeros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; background: #2A2E35; border-radius: var(--m17-radius-g); overflow: hidden; }
.num { background: var(--m17-ink); padding: 18px 20px; display: flex; flex-direction: column; gap: 6px; color: #FFFFFF; }
.num:hover { background: #171A20; color: #FFFFFF; }
.num b { font: 900 clamp(30px, 4.2vw, 48px)/1 var(--m17-marca); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.num span { color: #B9BEC5; font-size: 14px; }
.num--noticias b { color: var(--m17-accent); }
.num--vagas b { color: #3DDC84; }
.num--eventos b { color: var(--m17-ipe); }

.rodas { display: flex; gap: 16px; overflow-x: auto; scrollbar-width: none; padding: 2px 2px 4px; margin: 0 -2px; }
.rodas::-webkit-scrollbar { display: none; }
.roda { display: flex; flex-direction: column; align-items: center; gap: 8px; flex-shrink: 0; width: 76px; text-align: center; color: #D5D9DE; font-size: 12px; line-height: 1.25; }
.roda:hover { color: #FFFFFF; }
.roda__anel { width: 68px; height: 68px; border-radius: 50%; padding: 3px; background: var(--m17-accent); display: block; }
.roda--vista .roda__anel { background: #3A4048; }
.roda__sigla {
	display: grid; place-items: center; width: 100%; height: 100%;
	border-radius: 50%; border: 3px solid var(--m17-ink);
	background: var(--m17-blue); color: #FFFFFF;
	font: 900 15px/1 var(--m17-marca); letter-spacing: -0.02em;
}
.roda--policia .roda__sigla { background: #2A2E35; }
.roda--transito .roda__sigla { background: var(--m17-orange); }
.roda--vaga .roda__sigla { background: var(--m17-wa); }
.roda--evento .roda__sigla { background: var(--m17-ipe); color: var(--m17-ink); }
.roda__rotulo { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* Convite "sua cidade" e bloco "Agora em ..." ----------------------------- */

.convite {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px;
	background: #1B1E24; border: 1px solid #2E3238; border-radius: var(--m17-radius-g); padding: 14px 16px 14px 20px;
}
.convite__texto { margin: 0; color: #B9BEC5; font-size: 14px; }
.convite__texto b { display: block; color: #FFFFFF; font: 700 16px/1.3 var(--m17-sans); }
.convite__acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.convite__aviso { margin: 0; width: 100%; font-size: 13px; color: var(--m17-ipe); }
.convite__aviso:empty { display: none; }
.botao--contorno { background: transparent; box-shadow: inset 0 0 0 1.5px #5B626B; }
.botao--contorno:hover { background: rgba(255, 255, 255, 0.08); }
.botao:disabled { opacity: 0.6; cursor: progress; }

.sua-cidade {
	margin-bottom: 14px; background: #FFFFFF; border-radius: var(--m17-radius-g);
	padding: 18px 22px; display: flex; flex-direction: column; gap: 10px;
	box-shadow: inset 4px 0 0 var(--m17-ipe);
}
.sua-cidade__topo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sua-cidade__titulo { margin: 0; font: 900 20px/1.1 var(--m17-marca); letter-spacing: -0.02em; }
.sua-cidade__titulo a { color: var(--m17-accent); }
.sua-cidade__trocar { background: none; border: 0; padding: 0; cursor: pointer; font: 600 14px var(--m17-sans); color: var(--m17-muted); text-decoration: underline; text-underline-offset: 3px; }
.sua-cidade__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 20px; }
.sua-cidade__lista li { display: flex; flex-direction: column; gap: 4px; padding-top: 10px; border-top: 1px solid var(--m17-line); }
.sua-cidade__lista time { font: 700 12px/1 var(--m17-sans); color: var(--m17-accent); }
.sua-cidade__lista a { font: 700 16px/1.3 var(--m17-serif); }
.sua-cidade__vazio { margin: 0; color: var(--m17-ink-2); }
.sua-cidade__vazio a { color: var(--m17-accent); font-weight: 600; }

/* Mural (bento) ----------------------------------------------------------- */

.mural { padding-top: 26px; padding-bottom: 8px; display: flex; flex-direction: column; }
.bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: minmax(150px, auto); grid-auto-flow: dense; gap: 14px; }

.t {
	position: relative; overflow: hidden; min-width: 0;
	display: flex; flex-direction: column; gap: 12px;
	background: #FFFFFF; color: var(--m17-ink);
	border-radius: var(--m17-radius-g); padding: 22px;
}
a.t { transition: transform 0.15s ease; }
a.t:hover { color: inherit; transform: translateY(-2px); }
.t__cab { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.t__titulo { margin: 0; font: 700 13px/1.1 var(--m17-marca); letter-spacing: 0.01em; }
.t__lugar { font: 700 11px/1.2 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--m17-muted); }
.t__pilula { font: 700 11px/1 var(--m17-sans); letter-spacing: 0.06em; text-transform: uppercase; padding: 6px 9px; border-radius: 999px; background: rgba(255, 255, 255, 0.2); }
.t__rodape { margin-top: auto; font: 700 11px/1.2 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase; }
.t__botao {
	margin-top: auto; align-self: flex-start;
	background: #FFFFFF; color: var(--m17-wa); border-radius: 999px;
	padding: 11px 16px; font: 600 14px/1 var(--m17-sans);
}

.t--manchete { grid-column: span 8; grid-row: span 3; padding: 0; gap: 0; }
.t__foto { display: block; flex: 1; min-height: 280px; background: var(--m17-photo); overflow: hidden; }
.t__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.t--manchete:hover .t__foto img { transform: scale(1.02); }
.t__texto { padding: 20px 26px 24px; display: flex; flex-direction: column; gap: 10px; }
.t--manchete__titulo { margin: 0; font: 800 clamp(26px, 3.1vw, 40px)/1.08 var(--m17-serif); letter-spacing: -0.015em; }
.t--manchete__fina { margin: 0; color: var(--m17-ink-2); font-size: 17px; max-width: 62ch; }
.t--vazio { padding: 32px; justify-content: center; gap: 10px; }
.t--vazio p { margin: 0; color: var(--m17-muted); }

.t--plantao { grid-column: span 4; grid-row: span 3; }
.plantao { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.plantao li { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 10px; padding: 11px 0; border-top: 1px solid var(--m17-line); }
.plantao time { font: 700 13px/1.45 var(--m17-sans); color: var(--m17-accent); font-variant-numeric: tabular-nums; }
.plantao__titulo { display: block; font: 700 16px/1.3 var(--m17-serif); }
.plantao__onde { display: block; margin-top: 2px; font-size: 12px; color: var(--m17-muted); }
.t__mais { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--m17-line); font: 600 14px/1.2 var(--m17-sans); color: var(--m17-accent); }
.aovivo { display: inline-flex; align-items: center; gap: 7px; font: 700 11px/1 var(--m17-sans); letter-spacing: 0.1em; text-transform: uppercase; color: var(--m17-accent); }
.aovivo::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--m17-accent); animation: m17-pulso 1.6s infinite; }
@keyframes m17-pulso {
	0% { box-shadow: 0 0 0 0 rgba(229, 35, 45, 0.5); }
	70% { box-shadow: 0 0 0 9px rgba(229, 35, 45, 0); }
	100% { box-shadow: 0 0 0 0 rgba(229, 35, 45, 0); }
}

.t--evento { grid-column: span 3; grid-row: span 2; background: var(--m17-ipe); }
.t--evento__data { display: flex; flex-direction: column; gap: 6px; }
.t--evento__data b { font: 900 76px/0.85 var(--m17-marca); letter-spacing: -0.05em; }
.t--evento__data span { font: 900 17px/1 var(--m17-marca); }
.t--evento__nome { font: 800 20px/1.18 var(--m17-serif); }

.t--vaga { grid-column: span 3; grid-row: span 2; background: var(--m17-wa); color: #FFFFFF; }
a.t--vaga:hover { color: #FFFFFF; }
.t--vaga__cargo { font: 800 22px/1.15 var(--m17-serif); }
.t--vaga__onde { font-size: 14px; opacity: 0.88; }
.t--vaga__salario { font: 900 26px/1 var(--m17-marca); letter-spacing: -0.02em; }

.t--lidas { grid-column: span 3; grid-row: span 2; background: var(--m17-ink); color: #FFFFFF; }
.t--lidas .t__lugar { color: #9BA1AA; }
.lidas { list-style: none; margin: 0; padding: 0; counter-reset: lidas; display: flex; flex-direction: column; gap: 12px; }
.lidas li { counter-increment: lidas; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 8px; font: 700 15px/1.28 var(--m17-serif); }
.lidas li::before { content: counter(lidas); font: 900 24px/1 var(--m17-marca); color: var(--m17-accent); }
.lidas a { color: #FFFFFF; }
.lidas a:hover { color: var(--m17-ipe); }
.t--lidas .vazio { color: #9BA1AA; }

.t--transito { grid-column: span 3; grid-row: span 2; }
.vias { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.vias li { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 10px 0; border-top: 1px solid var(--m17-line); font: 600 14px/1.3 var(--m17-sans); }
.vias li span { flex-shrink: 0; font-size: 12px; color: var(--m17-orange); font-weight: 700; }
.t--transito__ok { margin: auto 0 0; font-size: 15px; color: var(--m17-ink-2); }
.t--transito__ok b { display: block; font: 900 20px/1.1 var(--m17-marca); color: #0B5E31; margin-bottom: 4px; }

.t--envie { grid-column: span 5; background: var(--m17-accent); color: #FFFFFF; flex-direction: row; align-items: center; gap: 18px; }
a.t--envie:hover { color: #FFFFFF; }
.t--envie__icone { width: 60px; height: 60px; border-radius: 50%; background: #FFFFFF; color: var(--m17-accent); display: grid; place-items: center; flex-shrink: 0; }
.t--envie__texto { display: flex; flex-direction: column; gap: 6px; font-size: 15px; color: #FFE3E4; }
.t--envie__titulo { font: 900 21px/1.1 var(--m17-marca); color: #FFFFFF; letter-spacing: -0.01em; }

.t--classif { grid-column: span 4; flex-direction: row; gap: 16px; }
.t--classif__foto { width: 42%; flex-shrink: 0; border-radius: var(--m17-radius); overflow: hidden; background: var(--m17-photo); }
.t--classif__foto img { width: 100%; height: 100%; object-fit: cover; }
.t--classif__info { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.t--classif__nome { font: 800 18px/1.2 var(--m17-serif); }
.t--classif__preco { font: 900 22px/1 var(--m17-marca); letter-spacing: -0.02em; }

.t--pub { grid-column: span 3; padding: 0; align-items: center; justify-content: center; background: transparent; border: 1.5px dashed #B9C1CB; }
.t--pub__rotulo { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--m17-muted); padding-top: 8px; }
.t--pub__vazio { display: flex; flex-direction: column; gap: 6px; padding: 22px; text-align: center; color: var(--m17-muted); font-size: 14px; }

.t--cta { justify-content: flex-start; }

/* Por região / por cidade ------------------------------------------------- */

.lugares { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.lugares--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lugar { background: #FFFFFF; border-radius: var(--m17-radius-g); overflow: hidden; display: flex; flex-direction: column; min-width: 0; }
.lugar__nome {
	display: flex; justify-content: space-between; align-items: center; gap: 8px;
	padding: 15px 18px; color: #FFFFFF; background: var(--m17-ink);
	font: 900 16px/1.1 var(--m17-marca); letter-spacing: -0.01em;
}
.lugar__nome:hover { color: #FFFFFF; filter: brightness(1.12); }
.lugar__nome--vermelho { background: var(--m17-accent); }
.lugar__nome--azul { background: var(--m17-blue); }
.lugar__nome--verde { background: var(--m17-wa); }
.lugar__foto { display: block; aspect-ratio: 16 / 9; background: var(--m17-photo); overflow: hidden; }
.lugar__foto img { width: 100%; height: 100%; object-fit: cover; }
.lugar__item { display: block; margin: 0 18px; padding: 11px 0; border-top: 1px solid var(--m17-line); font: 700 15px/1.3 var(--m17-serif); }
.lugar__item--primeiro { border-top: 0; font-size: 17px; padding-top: 14px; }
.lugar__item:last-child { padding-bottom: 16px; }

/* Agenda da semana -------------------------------------------------------- */

.semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.dia { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 14px; display: flex; flex-direction: column; gap: 8px; min-height: 150px; min-width: 0; }
.dia--hoje { background: var(--m17-ipe); }
.dia__n { display: flex; align-items: baseline; gap: 6px; }
.dia__n b { font: 900 30px/1 var(--m17-marca); letter-spacing: -0.04em; }
.dia__n span { font: 600 12px var(--m17-sans); color: var(--m17-muted); text-transform: uppercase; }
.dia--hoje .dia__n span { color: var(--m17-ink); }
.dia__ev { display: block; font: 600 13px/1.3 var(--m17-sans); padding: 8px; border-radius: var(--m17-radius); background: var(--m17-soft); }
.dia__ev small { display: block; color: var(--m17-muted); font-weight: 500; margin-top: 2px; }
.dia--hoje .dia__ev { background: rgba(255, 255, 255, 0.6); }

/* Mais lidas (lateral) ---------------------------------------------------- */

.mais-lidas { background: var(--m17-ink); color: #FFFFFF; border-radius: var(--m17-radius-g); padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.mais-lidas .secao__titulo { font-size: 18px; color: #FFFFFF; }
.mais-lidas__lista { list-style: none; margin: 0; padding: 0; counter-reset: lidas; display: flex; flex-direction: column; gap: 14px; }
.mais-lidas__lista li { counter-increment: lidas; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 8px; font: 700 15px/1.3 var(--m17-serif); }
.mais-lidas__lista li::before { content: counter(lidas); font: 900 24px/1 var(--m17-marca); color: var(--m17-accent); }
.mais-lidas__lista a { color: #FFFFFF; }
.mais-lidas__lista a:hover { color: var(--m17-ipe); }

/* Vagas (cartão) ---------------------------------------------------------- */

.lista-vagas { display: flex; flex-direction: column; gap: 10px; }
a.vaga {
	display: flex; justify-content: space-between; gap: 12px; align-items: center;
	background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 16px 18px;
	border: 1px solid transparent;
}
a.vaga:hover { border-color: var(--m17-wa); color: var(--m17-ink); }
.vaga__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.vaga__cargo { font: 700 17px/1.3 var(--m17-serif); }
.vaga__onde { font-size: 13px; color: var(--m17-muted); }

/* Classificados (cartão) -------------------------------------------------- */

.grade-classificados { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.grade-classificados--home { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grade-classificados--arquivo { grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); }
a.classificado {
	display: flex; flex-direction: column; gap: 6px;
	background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 10px 10px 14px;
	border: 1px solid transparent;
}
a.classificado:hover { border-color: var(--m17-accent); color: var(--m17-ink); }
.classificado__midia { aspect-ratio: 4 / 3; border-radius: var(--m17-radius); margin-bottom: 4px; }
.classificado__cat { font-size: 11px; color: var(--m17-muted); text-transform: uppercase; letter-spacing: 0.06em; padding: 0 4px; }
.classificado__titulo { font: 700 15px/1.3 var(--m17-serif); padding: 0 4px; }
.classificado__preco { font: 900 18px/1.1 var(--m17-marca); letter-spacing: -0.02em; padding: 0 4px; }

/* Agenda (cartão) --------------------------------------------------------- */

.grade-eventos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 14px; }
a.evento { display: flex; gap: 14px; align-items: flex-start; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 16px; }
a.evento:hover { color: var(--m17-ink); box-shadow: inset 0 0 0 2px var(--m17-ipe); }
.evento__data {
	flex-shrink: 0; width: 62px; display: flex; flex-direction: column; align-items: center;
	background: var(--m17-ipe); border-radius: var(--m17-radius); padding: 7px 0;
}
.evento__mes { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.evento__dia { font: 900 26px/1.1 var(--m17-marca); letter-spacing: -0.04em; }
.evento__info { display: flex; flex-direction: column; gap: 4px; }
.evento__titulo { font: 700 16px/1.3 var(--m17-serif); }
.evento__onde { font-size: 13px; color: var(--m17-ink-2); }

/* Arquivos ---------------------------------------------------------------- */

.arquivo__topo { display: flex; flex-direction: column; gap: 6px; }
.arquivo__topo--cta { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; }
.arquivo__rotulo { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--m17-accent); }
.arquivo__rotulo a { color: inherit; }
.arquivo__titulo { margin: 0; font: 900 clamp(30px, 5vw, 52px)/1 var(--m17-marca); letter-spacing: -0.035em; }
.arquivo__desc { margin: 0; color: var(--m17-ink-2); font-size: 17px; }
.arquivo__desc p { margin: 0; }

.filtro { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.filtro::-webkit-scrollbar { display: none; }
.filtro__item {
	flex-shrink: 0; min-height: 40px; display: inline-flex; align-items: center;
	padding: 0 16px; background: #FFFFFF; border: 1px solid var(--m17-line); border-radius: 999px;
	font-size: 14px; font-weight: 600; white-space: nowrap;
}
.filtro__item:hover { border-color: var(--m17-ink); color: var(--m17-ink); }
.filtro__item.is-ativo { background: var(--m17-ink); border-color: var(--m17-ink); color: #FFFFFF; }
.filtro--secundario .filtro__item { min-height: 36px; font-weight: 500; }

.nav-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.nav-links .page-numbers {
	min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center;
	padding: 0 14px; background: #FFFFFF; border-radius: 999px; font-weight: 600;
}
.nav-links .current { background: var(--m17-ink); color: #FFFFFF; }

/* Matéria ----------------------------------------------------------------- */

.materia { display: flex; flex-direction: column; gap: 24px; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(20px, 4vw, 44px); }
.materia__topo { display: flex; flex-direction: column; gap: 14px; }
.materia__titulo { margin: 0; font: 800 clamp(30px, 4.4vw, 48px)/1.08 var(--m17-serif); letter-spacing: -0.02em; }
.materia__linha-fina { margin: 0; font-size: 20px; color: var(--m17-ink-2); }
.materia__meta { margin: 0; font-size: 14px; color: var(--m17-muted); border-top: 1px solid var(--m17-line); padding-top: 12px; }
.materia__foto { margin: 0; }
.materia__foto img { width: 100%; border-radius: var(--m17-radius); }
.materia__foto figcaption { font-size: 13px; color: var(--m17-muted); margin-top: 6px; }

.materia__texto { font: 400 19px/1.7 var(--m17-serif); max-width: 68ch; }
.materia__texto > * { margin: 0 0 1.1em; }
.materia__texto a { color: var(--m17-accent); text-decoration: underline; text-underline-offset: 3px; }
.materia__texto h2, .materia__texto h3 { font-family: var(--m17-serif); line-height: 1.2; margin-top: 1.6em; }
.materia__texto blockquote { border-left: 4px solid var(--m17-accent); margin-left: 0; padding-left: 20px; font-style: italic; color: var(--m17-ink-2); }
.materia__texto img { border-radius: var(--m17-radius); }

.fonte {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
	background: var(--m17-soft); border-radius: var(--m17-radius-g); padding: 16px 20px;
}
.fonte p { margin: 0; }

.compartilhar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; border-top: 1px solid var(--m17-line); padding-top: 18px; }
.compartilhar__rotulo { font-weight: 700; font-size: 14px; margin-right: 4px; }
.compartilhar__botao {
	min-height: 40px; display: inline-flex; align-items: center; padding: 0 14px;
	border: 1px solid var(--m17-line); border-radius: 999px; font-size: 14px; font-weight: 600;
}
.compartilhar__botao--wa { background: var(--m17-wa); border-color: var(--m17-wa); color: #FFFFFF; }
.compartilhar__botao--wa:hover { color: #FFFFFF; background: #0B5E31; }

.relacionadas { display: flex; flex-direction: column; gap: 16px; }
.relacionadas .card__titulo { font-size: 18px; }

/* Páginas de evento, vaga e anúncio -------------------------------------- */

.item { display: flex; flex-direction: column; gap: 24px; }
.item__topo { display: flex; flex-direction: column; gap: 8px; }
.item__topo h1 { margin: 0; font: 800 clamp(28px, 4vw, 44px)/1.1 var(--m17-serif); letter-spacing: -0.015em; }
.item__grade { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.item__conteudo { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 20px; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(20px, 3vw, 32px); }

.ficha {
	flex: 1 1 280px; display: flex; flex-direction: column; gap: 16px;
	background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 22px;
	position: sticky; top: 88px;
}
.ficha__data { display: flex; flex-direction: column; align-items: center; align-self: flex-start; width: 76px; background: var(--m17-ipe); border-radius: var(--m17-radius); padding: 8px 0; }
.ficha__data .evento__dia { font-size: 32px; }
.ficha__lista { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; font-size: 15px; }
.ficha__lista dt { font-weight: 600; color: var(--m17-muted); }
.ficha__lista dd { margin: 0; }
.ficha__preco { margin: 0; font: 900 32px/1 var(--m17-marca); letter-spacing: -0.03em; color: var(--m17-accent); }
.ficha__aviso { margin: 0; font-size: 13px; color: var(--m17-muted); }

.pagina { max-width: 760px; display: flex; flex-direction: column; gap: 20px; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(20px, 4vw, 44px); }
.pagina h1 { margin: 0; font: 900 clamp(28px, 4vw, 44px)/1.05 var(--m17-marca); letter-spacing: -0.03em; }

/* Comentários e widgets --------------------------------------------------- */

.comentarios { display: flex; flex-direction: column; gap: 16px; border-top: 1px solid var(--m17-line); padding-top: 24px; }
.comentarios__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.comentarios textarea, .comentarios input[type="text"], .comentarios input[type="email"], .comentarios input[type="url"] {
	width: 100%; border: 1px solid #C9CED4; border-radius: var(--m17-radius); padding: 10px 12px; font: inherit;
}
.comentarios .submit { min-height: 44px; padding: 0 18px; background: var(--m17-accent); color: #FFFFFF; border: 0; border-radius: 999px; font: 600 15px var(--m17-sans); cursor: pointer; }

.widget { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 18px; }
.widget-title { margin: 0 0 10px; font: 700 13px/1.1 var(--m17-marca); }

/* Notas oficiais ---------------------------------------------------------- */

.selo--oficial { display: inline-flex; align-items: center; gap: 4px; background: var(--m17-blue); }
.selo-oficial {
	display: inline-flex; align-items: center; gap: 6px; align-self: flex-start;
	background: #FFFFFF; color: var(--m17-blue); border-radius: 999px; padding: 5px 11px 5px 8px;
	font: 700 11px/1 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase;
}
.selo-oficial--claro { background: #FFFFFF; }
.plantao__onde--oficial { display: inline-flex; align-items: center; gap: 5px; color: var(--m17-blue); font-weight: 600; }
.secao__link--oficial { color: var(--m17-blue); }

.etiqueta { display: inline-block; background: var(--m17-blue-soft); color: var(--m17-blue); border-radius: 999px; padding: 5px 10px; font: 700 11px/1 var(--m17-sans); letter-spacing: 0.06em; text-transform: uppercase; }
.etiqueta--alerta { background: #FDE8DC; color: #8A2E07; }
.etiqueta--clara { background: rgba(255, 255, 255, 0.16); color: #FFFFFF; }

.brasao {
	width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0; overflow: hidden;
	display: grid; place-items: center; background: var(--m17-blue); color: #FFFFFF;
	font: 900 13px/1 var(--m17-marca); letter-spacing: -0.02em;
}
.brasao--justica { background: var(--m17-ink-2); }
.brasao--img { background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--m17-line); }
.brasao--img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.brasao--p { width: 36px; height: 36px; font-size: 11px; }
.brasao--g { width: 56px; height: 56px; font-size: 17px; }
.brasao--xg { width: 96px; height: 96px; font-size: 26px; background: #FFFFFF; color: var(--m17-blue); }

.comunicados { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.comunicados--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
a.comunicado {
	display: flex; flex-direction: column; gap: 12px; min-width: 0;
	background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 18px; border-top: 4px solid var(--m17-blue);
}
a.comunicado--alerta { border-top-color: var(--m17-orange); }
a.comunicado:hover { color: var(--m17-ink); box-shadow: 0 6px 18px rgba(14, 16, 20, 0.08); }
.comunicado__quem { display: flex; align-items: center; gap: 10px; }
.comunicado__quem > span:not(.brasao) { display: flex; flex-direction: column; min-width: 0; }
.comunicado__quem b { font-size: 14px; }
.comunicado__quem small { font-size: 12px; color: var(--m17-muted); }
.comunicado__foto { display: block; aspect-ratio: 16 / 9; border-radius: var(--m17-radius); overflow: hidden; background: var(--m17-photo); }
.comunicado__foto img { width: 100%; height: 100%; object-fit: cover; }
.comunicado__titulo { font: 700 18px/1.25 var(--m17-serif); }
.comunicado__pe { margin-top: auto; display: flex; gap: 10px; align-items: center; }
.comunicado__pe small { font-size: 13px; color: var(--m17-muted); }

.materia--oficial { padding-top: 0; overflow: hidden; }
.faixa-oficial {
	display: flex; gap: 14px; align-items: center;
	margin: 0 calc(-1 * clamp(20px, 4vw, 44px)); padding: 16px clamp(20px, 4vw, 44px);
	background: var(--m17-blue); color: #D6E2EE; font-size: 14px;
}
.faixa-oficial svg { color: #FFFFFF; flex-shrink: 0; }
.faixa-oficial p { margin: 0; }
.faixa-oficial b { display: block; color: #FFFFFF; font: 900 15px/1.3 var(--m17-marca); }

.servico { background: var(--m17-blue-soft); border-radius: var(--m17-radius-g); padding: 20px 22px; display: flex; flex-direction: column; gap: 10px; }
.servico__titulo { margin: 0; font: 900 15px/1 var(--m17-marca); color: var(--m17-blue); }
.servico dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; font-size: 15px; }
.servico dt { font-weight: 600; color: var(--m17-ink-2); }
.servico dd { margin: 0; }

a.orgao-cartao { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; border: 1px solid var(--m17-line); border-radius: var(--m17-radius-g); padding: 18px; }
a.orgao-cartao:hover { border-color: var(--m17-blue); color: var(--m17-ink); }
.orgao-cartao__info { display: flex; flex-direction: column; gap: 3px; flex: 1 1 240px; min-width: 0; }
.orgao-cartao__info small { font-size: 13px; color: var(--m17-muted); }
.orgao-cartao__verificado { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--m17-blue); }
.orgao-cartao__ver { font-size: 14px; font-weight: 600; color: var(--m17-blue); }

.orgao-topo { background: var(--m17-blue); color: #FFFFFF; }
.orgao-topo__in { padding-top: 34px; padding-bottom: 28px; display: flex; flex-direction: column; gap: 22px; }
.orgao-topo .hoje__caminho, .orgao-topo .hoje__caminho a { color: #C9D8E8; }
.orgao-topo__quem { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.orgao-topo__nome { display: flex; flex-direction: column; gap: 10px; flex: 1 1 420px; min-width: 0; }
.orgao-topo__nome h1 { margin: 0; font: 900 clamp(30px, 5vw, 46px)/1 var(--m17-marca); letter-spacing: -0.035em; }
.orgao-topo__nome p { margin: 0; color: #D6E2EE; max-width: 60ch; }
.orgao-topo__contato { display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.orgao-topo__contato a { display: inline-flex; align-items: center; gap: 6px; color: #FFFFFF; background: rgba(255, 255, 255, 0.12); border-radius: 999px; padding: 10px 16px; font-weight: 600; }
.orgao-topo__contato span { color: #D6E2EE; padding: 0 16px; }
.orgao-topo .numeros { background: rgba(255, 255, 255, 0.18); }
.orgao-topo .num { background: var(--m17-blue); }
.numeros--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.caixa { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.caixa--oficial { background: var(--m17-blue-soft); color: #1E3A57; }
.caixa--oficial p { margin: 0; font-size: 14px; }
.caixa--oficial .botao { align-self: flex-start; }
.caixa__titulo { margin: 0 0 4px; font: 900 15px/1.2 var(--m17-marca); }
.caixa--oficial .caixa__titulo { color: var(--m17-blue); }
a.orgao-linha { display: flex; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--m17-line); }
.orgao-linha > span:not(.brasao) { display: flex; flex-direction: column; min-width: 0; }
.orgao-linha b { font-size: 14px; }
.orgao-linha small { font-size: 12px; color: var(--m17-muted); }

.botao--oficial { background: var(--m17-blue); }
.botao--oficial:hover { background: #163A5B; }
.botao--contorno-escuro { background: #FFFFFF; color: var(--m17-ink); box-shadow: inset 0 0 0 1.5px #C9CED4; }
.botao--contorno-escuro:hover { background: var(--m17-soft); color: var(--m17-ink); }

/* Formulários do órgão ---------------------------------------------------- */

.pagina--larga { max-width: none; background: transparent; padding: 0; }
.pagina--larga > .materia__titulo { display: none; }
.pagina--larga > .materia__texto { max-width: none; font: inherit; }
.pagina--larga > .materia__texto > * { margin: 0; }

.formulario { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(20px, 3vw, 28px); display: flex; flex-direction: column; gap: 16px; min-width: 0; font-family: var(--m17-sans); }
.formulario h2 { margin: 0; font: 900 24px/1.1 var(--m17-marca); letter-spacing: -0.02em; }
.formulario__dupla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.formulario__tripla { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.formulario__acoes { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.formulario__mel { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.campo { display: flex; flex-direction: column; gap: 6px; margin: 0; min-width: 0; border: 0; padding: 0; }
.campo label, .campo legend { font-weight: 600; font-size: 14px; padding: 0; }
.campo input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.campo select,
.campo textarea {
	width: 100%; min-height: 46px; border: 1.5px solid #C9CED4; border-radius: 10px; padding: 10px 14px;
	font: 400 16px/1.4 var(--m17-sans); color: var(--m17-ink); background: #FFFFFF;
}
.campo textarea { line-height: 1.6; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { border-color: var(--m17-blue); outline: 2px solid var(--m17-blue-soft); }
.campo__dica { font-size: 12px; color: var(--m17-muted); }
.campo--check { flex-direction: row; align-items: flex-start; gap: 10px; }
.campo--check input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--m17-blue); flex-shrink: 0; }
.campo--check label { font-weight: 400; color: var(--m17-ink-2); }
.opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.campo .opcao { display: inline-flex; align-items: center; gap: 6px; background: var(--m17-soft); border-radius: 999px; padding: 9px 14px; font-size: 14px; font-weight: 600; cursor: pointer; }
.campo .opcao:has(input:checked) { background: var(--m17-blue); color: #FFFFFF; }
.campo .opcao input { margin: 0; accent-color: #FFFFFF; }
.campo-servico { background: var(--m17-blue-soft); border-radius: 12px; padding: 14px 18px; }
.campo-servico summary { font-weight: 700; color: var(--m17-blue); cursor: pointer; }
.campo-servico .formulario__dupla { margin-top: 12px; }
.aviso { margin: 0; border-radius: 10px; padding: 12px 14px; font-size: 15px; }
.aviso--ok { background: #E2F3EA; color: #0B5E31; }
.aviso--erro { background: #FDE3E4; color: #8E1218; }
.aviso--espera { background: #FFF1CC; color: #5C3D00; }

.oficial-cadastro { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.oficial-cadastro > .formulario { flex: 999 1 540px; }
.oficial-cadastro__lado { flex: 1 1 340px; min-width: 0; background: var(--m17-blue); color: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(22px, 3vw, 32px); display: flex; flex-direction: column; gap: 18px; }
.oficial-cadastro__lado h2 { margin: 0; font: 900 clamp(26px, 3vw, 32px)/1.05 var(--m17-marca); letter-spacing: -0.03em; }
.oficial-cadastro__lado p { margin: 0; color: #D6E2EE; }
.oficial-passos { margin: 0; padding: 0; list-style: none; counter-reset: passo; display: flex; flex-direction: column; gap: 12px; color: #D6E2EE; font-size: 15px; }
.oficial-passos li { counter-increment: passo; position: relative; padding-left: 38px; }
.oficial-passos li::before { content: counter(passo); position: absolute; left: 0; top: -1px; font: 900 20px/1.1 var(--m17-marca); color: var(--m17-ipe); }
.oficial-passos b { color: #FFFFFF; }
.oficial-cadastro__nota { font-size: 13px; border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: 14px; }

.oficial-entrar { max-width: 520px; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 28px; display: flex; flex-direction: column; gap: 14px; }
.oficial-entrar h2 { margin: 0; font: 900 24px/1.1 var(--m17-marca); }
.oficial-entrar p { margin: 0; }
.oficial-entrar form p { display: flex; flex-direction: column; gap: 6px; margin: 0 0 12px; }
.oficial-entrar input[type="text"], .oficial-entrar input[type="password"] { min-height: 46px; border: 1.5px solid #C9CED4; border-radius: 10px; padding: 10px 14px; font: 400 16px var(--m17-sans); }
.oficial-entrar .login-remember label { display: flex; gap: 8px; align-items: center; font-weight: 400; }
.oficial-entrar input[type="submit"] { min-height: 48px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--m17-blue); color: #FFFFFF; font: 600 15px var(--m17-sans); cursor: pointer; align-self: flex-start; }

.oficial-painel { display: flex; flex-direction: column; gap: 18px; }
.oficial-painel__quem { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--m17-ink); color: #FFFFFF; border-radius: var(--m17-radius-g); padding: 14px 18px; }
.oficial-painel__quem > span:not(.brasao) { display: flex; flex-direction: column; margin-right: auto; }
.oficial-painel__quem small { color: #9BA1AA; font-size: 13px; }
.oficial-painel__quem a { color: #C9CED4; font-size: 14px; }
.oficial-painel__quem a:hover { color: #FFFFFF; }
.oficial-painel__grade { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; }
.oficial-painel__grade > .formulario { flex: 999 1 560px; }
.oficial-minhas { flex: 1 1 300px; min-width: 0; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.oficial-minhas h2 { margin: 0 0 6px; font: 900 15px/1 var(--m17-marca); }
.oficial-minhas ul { list-style: none; margin: 0; padding: 0; }
.oficial-minhas li { display: flex; flex-direction: column; gap: 5px; padding: 12px 0; border-top: 1px solid var(--m17-line); font-size: 14px; }
.oficial-minhas li small { color: var(--m17-muted); }
.oficial-minhas li > a { font-weight: 600; color: var(--m17-blue); }
.oficial-minhas__motivo { background: var(--m17-soft); border-radius: 8px; padding: 8px 10px; font-size: 13px; color: var(--m17-ink-2); }
.oficial-minhas__como { margin-top: 8px; background: var(--m17-blue-soft); border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: #1E3A57; }
.situacao { align-self: flex-start; border-radius: 999px; padding: 4px 9px; font: 700 11px/1 var(--m17-sans); letter-spacing: 0.06em; text-transform: uppercase; background: var(--m17-soft); color: var(--m17-ink-2); }
.situacao--ok { background: #E2F3EA; color: #0B5E31; }
.situacao--espera { background: #FFF1CC; color: #6B4700; }
.situacao--erro { background: #FDE3E4; color: #A3141B; }

/* Serviços ---------------------------------------------------------------- */

.botao--mini { min-height: 34px; padding: 0 14px; font-size: 13px; }
.situacao--neutro { background: var(--m17-soft); color: var(--m17-ink-2); }
.situacao--oficial { background: var(--m17-blue-soft); color: var(--m17-blue); }
.aviso--solto { margin-top: 16px; }
.tabela-rolagem { overflow-x: auto; background: #FFFFFF; border-radius: var(--m17-radius-g); }
.tabela { width: 100%; border-collapse: collapse; font-size: 15px; }
.tabela th, .tabela td { text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--m17-line-2); white-space: nowrap; }
.tabela thead th { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--m17-muted); }
.tabela tbody tr:last-child > * { border-bottom: 0; }
.tabela tbody th { font-weight: 600; }
.variacao { font-size: 13px; font-weight: 700; color: var(--m17-muted); white-space: nowrap; }
.variacao--subiu { color: var(--m17-accent-esc); }
.variacao--desceu { color: var(--m17-wa); }
.caixa p { margin: 0; font-size: 14px; color: var(--m17-ink-2); }
.caixa--escura { background: var(--m17-ink); color: #FFFFFF; }
.caixa--escura .caixa__titulo { color: #FFFFFF; }

.sv-pagina { display: flex; flex-direction: column; gap: 22px; padding: 28px 0 56px; }
.sv-pagina--estreito { max-width: 820px; }
.sv-pagina__topo { display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: flex-end; justify-content: space-between; }
.sv-pagina__titulos { display: flex; flex-direction: column; gap: 10px; max-width: 760px; min-width: 0; }
.sv-pagina__caminho { margin: 0; font-size: 13px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--m17-muted); }
.sv-pagina__caminho a { color: var(--m17-muted); }
.sv-pagina__selo { align-self: flex-start; background: var(--m17-ipe); border-radius: 999px; padding: 5px 10px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.sv-pagina__titulo { margin: 0; font: 900 clamp(30px, 4.4vw, 44px)/1.04 var(--m17-marca); letter-spacing: -0.03em; }
.sv-pagina__texto { margin: 0; font-size: 17px; color: var(--m17-ink-2); }
.sv-pagina__lado { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.sv-pagina__corpo { display: flex; flex-direction: column; gap: 24px; }
.sv-pagina__grade { display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-start; }
.sv-pagina__principal { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.sv-pagina__lateral { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.sv-pagina__fonte { margin: 0; font-size: 13px; color: var(--m17-muted); }
.sv-pagina__fonte a { color: var(--m17-blue); font-weight: 600; }
.sv-pagina__barra { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.seletor-cidade { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.seletor-cidade select, .filtros select, .filtros input[type="search"], .busca-bairro {
	height: 44px; border: 1.5px solid #C9CED4; border-radius: 999px; padding: 0 14px; background: #FFFFFF;
	font: 500 14px var(--m17-sans); color: var(--m17-ink); max-width: 100%;
}
.filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 12px; }
.filtros__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.filtros .filtro__item { min-height: 40px; }
.filtro__sep { flex: 0 0 1px; background: var(--m17-line); margin: 6px 4px; }
.filtro__item--leve { font-weight: 500; }
.segmentos { display: inline-flex; background: #FFFFFF; border-radius: 999px; padding: 4px; }
.segmentos__item { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 16px; border-radius: 999px; font-size: 14px; font-weight: 600; }
.segmentos__item.is-ativo { background: var(--m17-ink); color: #FFFFFF; }
.busca-bairro { margin-left: auto; width: 240px; font-weight: 400; }

.sv-numeros { display: flex; gap: 10px; }
.sv-numeros__item { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 12px 16px; display: flex; flex-direction: column; font-size: 12px; color: var(--m17-muted); }
.sv-numeros__item b { font: 900 28px/1.1 var(--m17-marca); color: var(--m17-ink); }
.sv-numeros__item--escuro { background: var(--m17-ink); color: #C9CED4; }
.sv-numeros__item--escuro b { color: #FFFFFF; }
.sv-numeros__item--aberta b { color: var(--m17-accent); }
.sv-numeros__item--respondida b { color: var(--m17-blue); }
.sv-numeros__item--resolvida b { color: var(--m17-wa); }

/* Faixa "Serviços de hoje" */
.faixa-servicos { display: flex; flex-direction: column; gap: 14px; }
.mural > .faixa-servicos { margin-bottom: 22px; }
.faixa-servicos.is-carregando { opacity: 0.55; transition: opacity 0.2s; }
.faixa-servicos__topo { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; justify-content: space-between; }
.faixa-servicos__titulo { margin: 0; font: 900 clamp(18px, 2.2vw, 22px)/1.1 var(--m17-marca); letter-spacing: -0.02em; }
.faixa-servicos__titulo span { color: var(--m17-accent); }
.faixa-servicos__grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sv-tile { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; min-width: 0; border-top: 4px solid var(--m17-line); }
.sv-tile--farmacia { border-top-color: var(--m17-wa); }
.sv-tile--gasolina { border-top-color: var(--m17-ipe); }
.sv-tile--agua { border-top-color: var(--m17-blue); }
.sv-tile--falecimentos { border-top-color: var(--m17-ink-2); }
.sv-tile--concursos { border-top-color: var(--m17-orange); }
.sv-tile--fala { border-top-color: var(--m17-accent); }
.sv-tile__cab { margin: 0; display: flex; justify-content: space-between; gap: 8px; align-items: center; font: 700 11px/1.2 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--m17-muted); }
.sv-tile__cab a { color: var(--m17-ink); }
.sv-tile__agora { background: #E2F3EA; color: #0B5E31; border-radius: 999px; padding: 3px 8px; letter-spacing: 0.04em; }
.sv-tile__agora--alerta { background: #FDE3E4; color: #A3141B; }
.sv-tile__fonte { letter-spacing: 0.04em; text-transform: none; font-weight: 600; }
.sv-tile__grande { font: 700 21px/1.2 var(--m17-serif); }
.sv-tile__grande small { font: 700 13px var(--m17-sans); }
.sv-tile__medio { font-size: 16px; line-height: 1.3; }
.sv-tile__linha { font-size: 14px; color: var(--m17-ink-2); }
.sv-tile__linha--fraca { color: var(--m17-muted); font-size: 13px; }
.sv-tile__acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 4px; }
.sv-tile__mais { font-size: 14px; font-weight: 600; color: var(--m17-accent); margin-top: auto; }

/* Lista de serviços (/servicos/) */
.sv-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sv-card { height: 100%; background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 18px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--m17-ink-2); }
.sv-card b { font: 900 16px/1.2 var(--m17-marca); color: var(--m17-ink); }
.sv-card:hover { box-shadow: inset 0 0 0 2px var(--m17-ink); color: var(--m17-ink-2); }
.sv-card__icone { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--m17-soft); color: var(--m17-accent); margin-bottom: 4px; }

/* Inscrição nos avisos */
.avisos { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 20px; display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 90px; }
.avisos--escuro { background: var(--m17-ink); color: #FFFFFF; }
.avisos__titulo { margin: 0; font: 900 16px/1.2 var(--m17-marca); }
.avisos__texto { margin: 0; font-size: 14px; color: var(--m17-ink-2); }
.avisos--escuro .avisos__texto { color: #C9CED4; }
.avisos__form { display: flex; flex-direction: column; gap: 10px; }
.avisos__form select, .avisos__form input[type="email"] { height: 44px; border: 0; border-radius: 999px; padding: 0 16px; font: 400 14px var(--m17-sans); background: #FFFFFF; color: var(--m17-ink); box-shadow: inset 0 0 0 1.5px #C9CED4; }
.avisos--escuro .avisos__form select, .avisos--escuro .avisos__form input[type="email"] { box-shadow: none; }
.avisos__temas { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.avisos__temas input { width: 16px; height: 16px; accent-color: var(--m17-accent); vertical-align: -3px; margin: 0 6px 0 0; }
.avisos__form .botao { align-self: flex-start; }
.sv-pagina__corpo > .avisos { max-width: 760px; }
.sv-pagina__corpo > .avisos .avisos__form { flex-direction: row; flex-wrap: wrap; align-items: center; }
.sv-pagina__corpo > .avisos .avisos__temas { flex-direction: row; flex-wrap: wrap; gap: 6px 16px; flex-basis: 100%; order: -1; }

/* Farmácia */
.plantao-agora { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(20px, 3vw, 28px); display: flex; flex-direction: column; gap: 10px; box-shadow: inset 0 0 0 2px var(--m17-wa); }
.plantao-agora--vazio { box-shadow: none; }
.plantao-agora--vazio p { margin: 0; color: var(--m17-ink-2); }
.plantao-agora__cab { margin: 0; display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; font-size: 14px; color: var(--m17-muted); }
.plantao-agora .aovivo { color: var(--m17-wa); }
.plantao-agora .aovivo::before { background: var(--m17-wa); }
.plantao-agora__nome { margin: 0; font: 800 clamp(26px, 3.4vw, 36px)/1.1 var(--m17-serif); letter-spacing: -0.01em; }
.plantao-agora__end { margin: 0; font-size: 17px; color: var(--m17-ink-2); }
.plantao-agora__acoes { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0; }
.plantao-dias { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.plantao-dias li { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-top: 1px solid var(--m17-line-2); font-size: 14px; }
.plantao-dias li:first-child { border-top: 0; }
.plantao-dias__dia { width: 44px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--m17-muted); }
.plantao-dias__dia b { font: 900 19px/1.1 var(--m17-marca); color: var(--m17-ink); }
.plantao-dias__nome { flex: 1; min-width: 0; display: flex; flex-direction: column; font-weight: 600; }
.plantao-dias__nome small { font-weight: 400; color: var(--m17-muted); }
.plantao-dias li > a { font-weight: 600; color: var(--m17-blue); white-space: nowrap; }
.plantao-vizinhas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.plantao-vizinhas li { background: var(--m17-soft); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.plantao-vizinhas small { color: var(--m17-muted); font-weight: 500; }

/* Guia */
.guia-emergencia { background: var(--m17-ink); color: #C9CED4; border-radius: var(--m17-radius-g); padding: 18px; display: flex; flex-direction: column; gap: 12px; }
.guia-emergencia p { margin: 0; font-size: 13px; }
.guia-emergencia__grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.guia-emergencia__num { background: #1A1D23; border-radius: 12px; padding: 14px; display: flex; flex-direction: column; color: #FFFFFF; }
.guia-emergencia__num b { font: 900 32px/1 var(--m17-marca); color: var(--m17-ipe); }
.guia-emergencia__num span { font-size: 14px; font-weight: 600; margin-top: 4px; }
.guia-emergencia__num:hover { color: #FFFFFF; box-shadow: inset 0 0 0 2px var(--m17-ipe); }
.guia-secoes { display: flex; flex-direction: column; gap: 28px; }
.guia-secao { display: flex; flex-direction: column; gap: 12px; scroll-margin-top: 90px; }
.guia-itens { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.guia-itens--feiras { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.guia-item { background: #FFFFFF; border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.guia-item__dia { font: 700 11px/1.3 var(--m17-sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--m17-orange); }
.guia-item__nome { font-size: 16px; }
.guia-item__info { font-size: 14px; color: var(--m17-muted); }
.guia-item__acoes { display: flex; gap: 8px; margin-top: 6px; }

/* Alertas */
.alerta { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: clamp(20px, 3vw, 28px); display: flex; flex-direction: column; gap: 10px; border-left: 6px solid var(--m17-line); }
.alerta--amarelo { border-left-color: var(--m17-ipe); }
.alerta--laranja { border-left-color: #F28C28; }
.alerta--vermelho { border-left-color: var(--m17-accent); }
.alerta--nenhum { border-left-color: var(--m17-wa); }
.alerta p { margin: 0; }
.alerta__nivel { font: 700 12px/1.2 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--m17-muted); }
.alerta__titulo { margin: 0; font: 800 clamp(24px, 3vw, 32px)/1.15 var(--m17-serif); }
.alerta__riscos { font-size: 16px; color: var(--m17-ink-2); }
.alerta__sub { margin: 6px 0 0; font: 900 15px/1.2 var(--m17-marca); }
.alerta__dicas { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.alerta__emergencia { background: var(--m17-soft); border-radius: 10px; padding: 10px 14px; font-weight: 600; }
.alerta__emergencia a { color: var(--m17-accent-esc); }
.alerta__cidades { font-size: 14px; color: var(--m17-ink-2); }
.alerta-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.alerta-lista__item { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-left: 4px solid var(--m17-line); font-size: 14px; }
.alerta-lista__item span { color: var(--m17-muted); }
.alerta-lista__item--amarelo { border-left-color: var(--m17-ipe); }
.alerta-lista__item--laranja { border-left-color: #F28C28; }
.alerta-lista__item--vermelho { border-left-color: var(--m17-accent); }
.sv-niveis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sv-niveis__item { border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; font-size: 13px; }
.sv-niveis__item b { font-size: 15px; }
.sv-niveis__item--amarelo { background: #FFF1CC; color: #5C3D00; }
.sv-niveis__item--laranja { background: #FDE6D2; color: #7A3306; }
.sv-niveis__item--vermelho { background: #FDE3E4; color: #8E1218; }
.tempo__agora { display: flex; gap: 14px; align-items: center; }
.tempo__agora b { font: 900 48px/1 var(--m17-marca); letter-spacing: -0.04em; }
.tempo__dias { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; text-align: center; font-size: 12px; }
.tempo__dias li { background: var(--m17-soft); border-radius: 10px; padding: 8px 4px; display: flex; flex-direction: column; }
.tempo__dias span { text-transform: uppercase; font-weight: 700; color: var(--m17-muted); }
.tempo__dias b { font-size: 15px; }
.tempo__dias small { color: var(--m17-muted); }
.sangue__local { font-weight: 600; }
.sangue__grade { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.sangue__tipo { border-radius: 10px; padding: 8px 4px; display: flex; flex-direction: column; align-items: center; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; background: var(--m17-soft); color: var(--m17-muted); }
.sangue__tipo b { font: 900 17px/1.2 var(--m17-marca); letter-spacing: 0; text-transform: none; }
.sangue__tipo--critico { background: #FDE3E4; color: #8E1218; }
.sangue__tipo--alerta { background: #FFF1CC; color: #5C3D00; }
.sangue__tipo--estavel { background: #E2F3EA; color: #0B5E31; }
.sangue .botao { align-self: flex-start; margin-top: 4px; }

/* Faixa de alerta no topo */
.faixa-alerta { background: #F28C28; color: #1A0E00; }
.faixa-alerta--amarelo { background: var(--m17-ipe); }
.faixa-alerta--vermelho { background: var(--m17-accent); color: #FFFFFF; }
.faixa-alerta__in { display: flex; align-items: center; gap: 12px; padding-top: 10px; padding-bottom: 10px; }
.faixa-alerta__nivel { flex-shrink: 0; background: rgba(0, 0, 0, 0.82); color: #FFFFFF; border-radius: 4px; padding: 4px 8px; font: 700 11px/1 var(--m17-sans); letter-spacing: 0.08em; text-transform: uppercase; }
.faixa-alerta__texto { margin: 0; flex: 1; min-width: 0; font-size: 14px; }
.faixa-alerta__link { flex-shrink: 0; font-weight: 700; font-size: 14px; color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.faixa-alerta__link:hover { color: inherit; }

/* Fala 17 */
.fala { background: #FFFFFF; border-radius: var(--m17-radius-g); overflow: hidden; display: grid; grid-template-columns: 240px minmax(0, 1fr); scroll-margin-top: 90px; }
.fala--sem-foto { grid-template-columns: minmax(0, 1fr); }
.fala__foto img { width: 100%; height: 100%; object-fit: cover; min-height: 180px; }
.fala__texto { padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.fala__rotulos { margin: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; color: var(--m17-muted); }
.fala__titulo { margin: 0; font: 700 21px/1.25 var(--m17-serif); }
.fala__relato p { margin: 0 0 8px; font-size: 15px; color: var(--m17-ink-2); }
.fala__relato p:last-child { margin: 0; }
.fala__meta, .fala__espera { margin: 0; font-size: 13px; color: var(--m17-muted); }
.fala__resposta { background: var(--m17-blue-soft); border-radius: 12px; padding: 12px 14px; color: #1E3A57; font-size: 15px; }
.fala__resposta p { margin: 0 0 6px; }
.fala__resposta p:last-child { margin: 0; }
.fala__de { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--m17-blue); }
.brasao--mini { width: 26px; height: 26px; font-size: 10px; }
.fala__eu { margin: 2px 0 0; }
.fala__eu button:disabled { opacity: 1; cursor: default; box-shadow: inset 0 0 0 1.5px var(--m17-wa); color: var(--m17-wa); }
.fala-form { scroll-margin-top: 90px; }
.fala-form h2 { font-size: 20px; }
.paginacao { display: flex; gap: 10px; justify-content: center; }

/* Combustível */
.comb-grafico { gap: 14px; }
.comb-grafico__cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: baseline; }
.comb-grafico__legenda { display: inline-flex; gap: 8px; align-items: center; font-size: 13px; color: var(--m17-muted); }
.comb-grafico__l-faixa { width: 22px; height: 8px; border-radius: 999px; background: #F7D47A; }
.comb-grafico__l-media { width: 10px; height: 10px; border-radius: 50%; background: var(--m17-ink); }
.comb-grafico__linhas { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.comb-grafico__linha { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 12px; align-items: center; font-size: 14px; }
.comb-grafico__cidade { display: flex; justify-content: space-between; gap: 8px; }
.comb-grafico__linha.is-sua .comb-grafico__cidade { color: var(--m17-accent-esc); font-weight: 700; }
.comb-grafico__trilho { position: relative; height: 22px; background: var(--m17-soft); border-radius: 999px; }
.comb-grafico__faixa { position: absolute; top: 5px; bottom: 5px; border-radius: 999px; background: #F7D47A; }
.comb-grafico__media { position: absolute; top: 3px; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: var(--m17-ink); box-shadow: 0 0 0 3px #FFFFFF; }
.comb-grafico__escala { position: relative; height: 18px; margin-left: 182px; font-size: 11px; color: var(--m17-muted); }
.comb-grafico__escala span { position: absolute; transform: translateX(-50%); }
.etanol__num { font-size: 15px; }
.etanol__num b { font: 900 34px/1 var(--m17-marca); letter-spacing: -0.03em; }
.caixa p.etanol__veredito { align-self: flex-start; border-radius: 999px; padding: 6px 12px; font-weight: 700; }
.etanol__veredito--etanol { background: #E2F3EA; color: #0B5E31 !important; }
.etanol__veredito--gasolina { background: #FFF1CC; color: #5C3D00 !important; }
.caixa p.calc__resultado { font-weight: 700; color: var(--m17-ink); }

/* Falta de água e luz */
.sv-agora { display: flex; align-items: center; gap: 12px; }
.sv-agora__ponto { width: 12px; height: 12px; border-radius: 50%; background: var(--m17-accent); box-shadow: 0 0 0 5px #FDE3E4; }
.falta { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 20px 22px; display: flex; flex-direction: column; gap: 10px; border-left: 5px solid var(--m17-blue); }
.falta--energia { border-left-color: var(--m17-orange); }
.falta p { margin: 0; }
.falta__rotulos { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; color: var(--m17-muted); }
.falta__tipo { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 4px 10px; font-weight: 700; background: var(--m17-blue-soft); color: var(--m17-blue); }
.falta--energia .falta__tipo { background: #FCEBDD; color: #9A3412; }
.falta__titulo { margin: 0; font: 700 22px/1.25 var(--m17-serif); }
.falta__bairros { font-size: 15px; color: var(--m17-ink-2); }
.falta__tempo { display: flex; flex-direction: column; gap: 6px; }
.falta__tempo p { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; font-size: 13px; font-weight: 600; }
.falta__tempo b { color: var(--m17-blue); }
.falta--energia .falta__tempo b { color: #9A3412; }
.falta__barra { height: 8px; background: var(--m17-blue-soft); border-radius: 999px; overflow: hidden; }
.falta__barra span { display: block; height: 100%; background: var(--m17-blue); }
.falta--energia .falta__barra { background: #FCEBDD; }
.falta--energia .falta__barra span { background: var(--m17-orange); }
.falta__obs { font-size: 13px; color: var(--m17-muted); }
.falta__acoes { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--m17-line-2); padding-top: 12px; }
.faltas-prog { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.falta-prog { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.falta-prog__quando { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--m17-blue); }
.falta-prog--energia .falta-prog__quando { color: var(--m17-orange); }
.falta-prog small { color: var(--m17-muted); }
.faltas-ok { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.faltas-ok small { color: var(--m17-wa); font-weight: 600; }
.sv-dupla { display: flex; gap: 10px; }
.sv-dupla__item { flex: 1; background: #1A1D23; border-radius: 10px; padding: 12px; display: flex; flex-direction: column; font-size: 12px; color: #C9CED4; }
.sv-dupla__item b { font: 900 26px/1.1 var(--m17-marca); }
.sv-dupla__item--agua b { color: #8DB4DB; }
.sv-dupla__item--energia b { color: var(--m17-ipe); }

/* Concursos */
.concurso { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 18px 22px; display: flex; flex-wrap: wrap; gap: 14px 20px; align-items: center; box-shadow: inset 4px 0 0 var(--m17-wa); }
.concurso--erro { box-shadow: inset 4px 0 0 var(--m17-accent); }
.concurso--espera { box-shadow: inset 4px 0 0 var(--m17-orange); }
.concurso__texto { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.concurso__rotulos { margin: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; color: var(--m17-muted); }
.concurso__titulo { margin: 0; font: 700 21px/1.25 var(--m17-serif); }
.concurso__linha { margin: 0; font-size: 14px; color: var(--m17-ink-2); }
.concurso__valor { display: flex; flex-direction: column; gap: 2px; min-width: 140px; }
.concurso__valor span { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--m17-muted); }
.concurso__valor b { font-size: 18px; }
.concurso__valor small { font-size: 13px; color: var(--m17-ink-2); }
.concurso__botao { background: var(--m17-ink); }
.lista-datas { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lista-datas li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--m17-line-2); font-size: 14px; }
.lista-datas li:first-child { border-top: 0; }
.ficha__mais { font-size: 14px; font-weight: 600; color: var(--m17-blue); }

/* Falecimentos */
.falecimento { background: #FFFFFF; border-radius: var(--m17-radius-g); padding: 18px 22px; display: flex; flex-direction: column; gap: 12px; }
.falecimento--completo { padding: 22px 24px; box-shadow: inset 0 0 0 2px var(--m17-ink); }
.falecimento__cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; align-items: baseline; }
.falecimento__nome { margin: 0; font: 700 22px/1.2 var(--m17-serif); }
.falecimento--completo .falecimento__nome { font-size: 28px; }
.falecimento__quem { font-size: 14px; color: var(--m17-ink-2); }
.falecimento__texto p { margin: 0; font: 400 17px/1.6 var(--m17-serif); color: var(--m17-ink-2); }
.falecimento__blocos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.falecimento__bloco { background: var(--m17-soft); border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; }
.falecimento__bloco span { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--m17-muted); }
.falecimento__bloco small { font-size: 13px; color: var(--m17-ink-2); }
.falecimento__rodape { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; border-top: 1px solid var(--m17-line-2); padding-top: 12px; font-size: 13px; color: var(--m17-muted); }
.falecimento__acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.falecimento__resumo { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; font-size: 14px; }
.falecimento__resumo span { display: flex; flex-direction: column; }
.falecimento__resumo small { color: var(--m17-muted); }
.falecimento__ver { margin-left: auto; font-weight: 600; color: var(--m17-blue); }

/* Painel do órgão: abas e respostas */
.painel-abas { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.painel-abas__item { flex-shrink: 0; min-height: 40px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: 999px; background: #FFFFFF; font-size: 14px; font-weight: 600; }
.painel-abas__item.is-ativo { background: var(--m17-blue); color: #FFFFFF; }
.painel-linha-acoes { display: flex; gap: 12px; align-items: center; }
.painel-linha-acoes a { font-weight: 600; color: var(--m17-blue); }
.painel-linha-acoes form { margin: 0; }
.campo__rotulo { font-weight: 600; font-size: 14px; }
.painel-fala { display: flex; flex-direction: column; gap: 14px; }
.painel-fala > h2 { margin: 0; font: 900 22px/1.1 var(--m17-marca); }
.painel-fala__item h3 { margin: 0; font: 700 19px/1.25 var(--m17-serif); }
.painel-fala__meta { margin: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; color: var(--m17-muted); }
.painel-fala__texto p { margin: 0 0 6px; font-size: 15px; }
.painel-fala__foto { border-radius: 10px; max-width: 240px; }
.painel-fala__resposta { display: flex; flex-direction: column; gap: 10px; }
.painel-fala__resposta .botao { align-self: flex-start; }

@media (max-width: 1080px) {
	.faixa-servicos__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sv-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.guia-itens--feiras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
	.sv-pagina { padding-top: 20px; gap: 18px; }
	.sv-pagina__lado, .seletor-cidade, .seletor-cidade select { width: 100%; }
	.seletor-cidade label { flex-shrink: 0; }
	.seletor-cidade select { flex: 1; min-width: 0; }
	.faixa-servicos__grade { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
	.faixa-servicos__grade::-webkit-scrollbar { display: none; }
	.sv-tile { flex: 0 0 78%; scroll-snap-align: start; }
	.sv-lista, .guia-itens, .faltas-prog, .falecimento__blocos { grid-template-columns: minmax(0, 1fr); }
	.guia-emergencia__grade, .guia-itens--feiras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sv-niveis { grid-template-columns: minmax(0, 1fr); }
	.fala { grid-template-columns: minmax(0, 1fr); }
	.fala__foto img { max-height: 220px; }
	.comb-grafico__linha { grid-template-columns: minmax(0, 1fr); gap: 4px; }
	.comb-grafico__escala { margin-left: 0; }
	.busca-bairro { margin-left: 0; width: 100%; }
	.filtros select, .filtros input[type="search"] { flex: 1 1 100%; }
	.faixa-alerta__in { flex-wrap: wrap; gap: 6px 10px; }
	.faixa-alerta__texto { flex-basis: 100%; order: 3; font-size: 13px; }
	.faixa-alerta__link { margin-left: auto; }
	.sv-numeros { width: 100%; }
	.sv-numeros__item { flex: 1; }
	.plantao-vizinhas { grid-template-columns: minmax(0, 1fr); }
	.concurso__valor { min-width: 0; }
}

/* Rodapé ------------------------------------------------------------------ */

.rodape { background: var(--m17-ink); color: #B9BEC5; font-size: 14px; }
.rodape a { color: #C9CED4; }
.rodape a:hover { color: #FFFFFF; }
.rodape__grade { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 32px; padding-top: 48px; padding-bottom: 44px; }
.rodape__marca { display: flex; flex-direction: column; gap: 14px; }
.rodape__marca p { margin: 0; max-width: 36ch; }
.marca__logo--rodape img { height: 28px; }
.rodape__redes { display: flex; gap: 8px; }
.rodape__redes a { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #2E3238; border-radius: 50%; }
.rodape__titulo { margin: 0 0 12px; font: 700 13px/1.1 var(--m17-marca); color: #FFFFFF; }
.rodape__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rodape__lista--extra { margin-top: 8px; }
.rodape__base { border-top: 1px solid #23262C; padding: 16px 0; font-size: 13px; color: #9AA1A9; }

/* Barra de abas (celular) ------------------------------------------------- */

.abas { display: none; }

/* Responsivo -------------------------------------------------------------- */

@media (max-width: 1180px) {
	.nav__lista a { padding: 9px 9px; }
}

@media (max-width: 1080px) {
	.t--manchete { grid-column: span 12; grid-row: auto; }
	.t--plantao, .t--lidas { grid-column: span 6; grid-row: auto; }
	.t--evento, .t--vaga, .t--transito { grid-column: span 6; }
	.t--envie, .t--classif { grid-column: span 6; }
	.t--pub { grid-column: span 6; min-height: 150px; }
	.lugares, .grade-classificados--home { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.comunicados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.semana { grid-template-columns: repeat(7, minmax(140px, 1fr)); overflow-x: auto; padding-bottom: 6px; }
	.rodape__grade { grid-template-columns: 1fr 1fr; }

	.cab__in { position: relative; }
	.menu-abrir { display: inline-flex; margin-left: -10px; }
	.nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #FFFFFF; border-bottom: 1px solid var(--m17-line); box-shadow: 0 16px 30px rgba(14, 16, 20, 0.08); }
	.nav.is-aberto { display: block; }
	.nav.is-aberto .nav__lista { flex-direction: column; gap: 0; padding: 8px max(16px, env(safe-area-inset-left, 0px)); }
	.nav.is-aberto .nav__lista a { padding: 14px 4px; border-radius: 0; border-bottom: 1px solid var(--m17-line-2); font-size: 16px; }
	.nav.is-aberto .nav__busca { display: block; padding: 12px max(16px, env(safe-area-inset-left, 0px)) 16px; }
	.nav__busca .busca { max-width: none; }
	.cab__acoes { margin-left: auto; }
}

@media (max-width: 760px) {
	.wrap {
		padding-left: max(16px, env(safe-area-inset-left, 0px));
		padding-right: max(16px, env(safe-area-inset-right, 0px));
	}
	body { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
	.admin-bar .cab { top: 0; }

	.cab__in { gap: 10px; min-height: 60px; }
	.marca__logo img { height: 24px; }
	.cidade-botao { display: none; }
	.cab__enviar { display: none; }

	.hoje__in { padding-top: 24px; gap: 20px; }
	.hoje__minha { margin-left: 0; }
	.numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.num { padding: 14px 16px; }

	.bento { grid-auto-rows: auto; }
	.bento > .t { grid-column: span 12; grid-row: auto; }
	.t__foto { min-height: 0; aspect-ratio: 16 / 10; flex: none; }
	.t__texto { padding: 16px 18px 20px; }
	.t--evento__data b { font-size: 60px; }
	.t--classif__foto { width: 38%; }

	.lugares { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 -16px; padding: 0 16px; }
	.lugares::-webkit-scrollbar { display: none; }
	.lugar { flex: 0 0 82%; scroll-snap-align: start; }
	.comunicados, .comunicados--2, .formulario__dupla, .formulario__tripla { grid-template-columns: minmax(0, 1fr); }
	.sua-cidade__lista { grid-template-columns: minmax(0, 1fr); }
	.convite { padding: 14px 16px; }
	.grade-classificados--home, .grade-classificados { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

	.principal { padding-top: 18px; gap: 28px; }
	.secao { padding-top: 32px; }
	.card--grande .card__titulo { font-size: 28px; }
	.card__titulo { font-size: 18px; }
	.card--lateral .card__midia { flex-basis: 110px; }
	.materia__linha-fina { font-size: 18px; }
	.materia__texto { font-size: 18px; }
	.anuncio--728 { padding: 0 16px; }
	.rodape__grade { grid-template-columns: 1fr; gap: 24px; }

	.abas {
		display: grid; grid-template-columns: repeat(5, 1fr);
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
		background: #FFFFFF; border-top: 1px solid var(--m17-line);
		padding: 8px max(8px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
	}
	.abas__item {
		display: flex; flex-direction: column; align-items: center; gap: 4px;
		background: none; border: 0; padding: 4px 0; cursor: pointer;
		font: 600 11px/1 var(--m17-sans); color: var(--m17-muted);
	}
	.abas__item.is-ativo { color: var(--m17-accent); }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}