/* ==========================================================================
   AVSEG — folha de estilo única
   Tokens da marca no topo. Amarelo e preto extraídos do logotipo oficial.
   ========================================================================== */

.avseg {
	--tinta: #0e0e0e;
	--tinta-2: #161616;
	--tinta-3: #1f1f1f;
	--amarelo: #f7f000;
	--amarelo-fundo: rgba(247, 240, 0, 0.12);
	--amarelo-borda: rgba(247, 240, 0, 0.34);
	--papel: #ffffff;
	--areia: #f3f3ef;
	--fumaca: #9a9a94;
	--linha: rgba(255, 255, 255, 0.11);
	--linha-forte: rgba(255, 255, 255, 0.24);
	--linha-clara: rgba(14, 14, 14, 0.1);

	--display: "Montserrat", system-ui, sans-serif;
	--texto: "Roboto", system-ui, sans-serif;

	--max: 1240px;
	--r: 16px;
	--gap-secao: clamp(72px, 10vw, 140px);

	font-family: var(--texto);
	font-size: 17px;
	line-height: 1.62;
	color: var(--tinta);
	background: var(--papel);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

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

.avseg :where(p, h1, h2, h3, h4, ul, ol, li, figure, form) {
	margin: 0;
	padding: 0;
}

.avseg :where(ul, ol) {
	list-style: none;
}

.avseg :where(img) {
	max-width: 100%;
	height: auto;
	display: block;
}

.avseg :where(a) {
	color: inherit;
	text-decoration: none;
}

.avseg :where(h1, h2, h3, h4) {
	font-family: var(--display);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.025em;
	text-wrap: balance;
}

/* ---------------- blindagem contra o tema ----------------
   Temas como o Kava pintam h2 e h3 de cinza e aplicam em todo botão
   caixa alta, texto numa linha só e fonte própria. Estas regras
   devolvem o controle ao site sem ganhar dos componentes abaixo. */

.avseg :where(h1, h2, h3, h4, h5, h6) {
	color: inherit;
	font-style: normal;
	text-align: inherit;
}

.avseg :where(button, input, select, textarea) {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
	text-transform: none;
	letter-spacing: inherit;
	white-space: normal;
	text-overflow: clip;
	max-width: none;
	min-height: 0;
	box-shadow: none;
}

.avseg :focus-visible {
	outline: 3px solid var(--amarelo);
	outline-offset: 3px;
	border-radius: 4px;
}

.avseg section[id] {
	scroll-margin-top: 90px;
}

.av-wrap {
	width: min(100% - 40px, var(--max));
	margin-inline: auto;
}

.av-progresso {
	position: fixed;
	inset: 0 auto auto 0;
	height: 3px;
	width: 0;
	background: var(--amarelo);
	z-index: 95;
}

/* ---------------- abertura ---------------- */

.av-loader {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: var(--tinta);
	display: grid;
	place-items: center;
	padding: 26px;
	text-align: center;
}

.av-loader.is-fim {
	transform: translateY(-101%);
	transition: transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
}

.av-loader__frase {
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(26px, 6.6vw, 50px);
	line-height: 1.16;
	letter-spacing: -0.02em;
	color: var(--papel);
	max-width: 16ch;
	min-height: 4.7em;
}

.av-cursor {
	display: inline-block;
	width: 4px;
	height: 0.9em;
	background: var(--amarelo);
	vertical-align: -0.06em;
	margin-left: 5px;
	animation: av-pisca 0.62s steps(1) infinite;
}

@keyframes av-pisca {
	50% {
		opacity: 0;
	}
}

.av-loader__marca {
	position: absolute;
	opacity: 0;
	transform: scale(0.88);
	width: min(78vw, 380px);
}

.av-loader__marca.is-ativa {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.55s ease, transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------------- topo ---------------- */

.av-aviso {
	background: var(--amarelo);
	color: var(--tinta);
	font-size: 14.5px;
	font-weight: 500;
}

.av-aviso__linha {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 24px;
	align-items: center;
	justify-content: space-between;
	padding: 9px 0;
}

.av-aviso a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.av-aviso a:hover {
	text-decoration: underline;
}

.av-header {
	position: sticky;
	top: 0;
	z-index: 90;
	background: rgba(14, 14, 14, 0.86);
	backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid transparent;
	transition: border-color 0.3s ease;
}

.av-header.is-fixo {
	border-bottom-color: var(--linha);
}

/* --av-encolhe vai de 0 no topo da página a 1 depois de 140px de
   rolagem; o script atualiza a cada quadro, então a marca acompanha o
   dedo em vez de saltar de um tamanho para o outro */
.av-header__linha {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	padding: calc(16px - 6px * var(--av-encolhe, 0)) 0;
}

.av-marca {
	display: block;
	height: calc(64px - 28px * var(--av-encolhe, 0));
}

.av-marca img {
	height: 100%;
	width: auto;
}

/* sem script, ou com movimento reduzido, vale o degrau de antes: o
   script marca is-fluido quando assume a conta quadro a quadro */
.av-header.is-fixo:not(.is-fluido) .av-header__linha {
	--av-encolhe: 1;
}

.av-nav {
	display: flex;
	align-items: center;
	gap: 4px;
}

.av-nav a {
	font-size: 15px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.72);
	padding: 9px 14px;
	border-radius: 999px;
	transition: color 0.25s ease, background 0.25s ease;
}

.av-nav a:hover {
	color: var(--papel);
	background: rgba(255, 255, 255, 0.08);
}

.av-nav a.is-ativo {
	color: var(--amarelo);
}

.av-header__acoes {
	display: flex;
	align-items: center;
	gap: 10px;
}

.av-menu-btn {
	display: none;
	width: 46px;
	height: 44px;
	border: 1px solid var(--linha-forte);
	border-radius: 12px;
	background: transparent;
	cursor: pointer;
	position: relative;
}

.av-menu-btn span,
.av-menu-btn span::before,
.av-menu-btn span::after {
	position: absolute;
	left: 50%;
	width: 19px;
	height: 2px;
	background: var(--papel);
	transform: translateX(-50%);
	transition: transform 0.3s ease, background 0.2s ease;
}

.av-menu-btn span {
	top: 50%;
	margin-top: -1px;
}

.av-menu-btn span::before {
	content: "";
	top: -6px;
	left: 0;
	transform: none;
}

.av-menu-btn span::after {
	content: "";
	top: 6px;
	left: 0;
	transform: none;
}

.av-menu-btn.is-aberto span {
	background: transparent;
}

.av-menu-btn.is-aberto span::before {
	transform: translateY(6px) rotate(45deg);
}

.av-menu-btn.is-aberto span::after {
	transform: translateY(-6px) rotate(-45deg);
}

/* ---------------- botões ---------------- */

.avseg .av-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	font-family: var(--display);
	font-weight: 700;
	font-size: 15px;
	padding: 14px 26px;
	border-radius: 999px;
	border: 1px solid transparent;
	cursor: pointer;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), background 0.25s ease, color 0.25s ease,
		border-color 0.25s ease;
}

.avseg .av-btn:hover {
	transform: translateY(-2px);
}

.avseg .av-btn svg {
	width: 18px;
	height: 18px;
	flex: none;
}

.avseg .av-btn--acao {
	background: var(--amarelo);
	color: var(--tinta);
}

.avseg .av-btn--acao:hover {
	background: var(--papel);
}

.avseg .av-btn--vidro {
	border-color: var(--linha-forte);
	color: var(--papel);
}

.avseg .av-btn--vidro:hover {
	background: rgba(255, 255, 255, 0.09);
	border-color: var(--papel);
}

.avseg .av-btn--tinta {
	background: var(--tinta);
	color: var(--papel);
}

.avseg .av-btn--tinta:hover {
	background: var(--tinta-3);
}

.avseg .av-btn--contorno {
	border-color: var(--linha-clara);
	color: var(--tinta);
}

.avseg .av-btn--contorno:hover {
	border-color: var(--tinta);
}

.avseg .av-btn--pequeno {
	padding: 11px 20px;
	font-size: 14px;
}

.av-hero .av-btn {
	padding: clamp(11px, 1.7vh, 14px) clamp(20px, 2.4vw, 26px);
	font-size: clamp(13.5px, 1.7vh, 15px);
}

.avseg .av-btn--largo {
	width: 100%;
}

/* ---------------- hero ---------------- */

.av-hero {
	position: relative;
	background: var(--tinta);
	color: var(--papel);
	overflow: hidden;
	display: grid;
	align-items: center;
	/* --av-topo é medido pelo script: barra amarela mais cabeçalho */
	height: calc(100svh - var(--av-topo, 122px) - var(--av-barra, 0px));
	min-height: 540px;
	/* a faixa amarela mora no rodapé do topo; --av-esteira vem do script */
	padding: clamp(16px, 3vh, 56px) 0 calc(clamp(16px, 3vh, 56px) + var(--av-esteira, 52px));
}

.av-grade {
	position: absolute;
	inset: 0;
	background-image: linear-gradient(var(--linha) 1px, transparent 1px),
		linear-gradient(90deg, var(--linha) 1px, transparent 1px);
	background-size: 82px 82px;
	mask-image: radial-gradient(115% 88% at 66% 14%, #000 22%, transparent 76%);
	pointer-events: none;
}

.av-brilho {
	position: absolute;
	width: 620px;
	height: 620px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(247, 240, 0, 0.13), transparent 66%);
	right: -140px;
	top: -170px;
	pointer-events: none;
}

.av-hero__linha {
	position: relative;
	display: grid;
	grid-template-columns: 1.08fr 0.92fr;
	gap: clamp(34px, 5vw, 72px);
	align-items: center;
}

.av-selo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: clamp(12.5px, 1.6vh, 14px);
	font-weight: 500;
	color: rgba(255, 255, 255, 0.82);
	border: 1px solid var(--linha);
	background: rgba(255, 255, 255, 0.04);
	border-radius: 999px;
	padding: 6px 16px 6px 11px;
	margin-bottom: clamp(12px, 2.4vh, 26px);
}

.av-selo i {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--amarelo);
	box-shadow: 0 0 0 0 rgba(247, 240, 0, 0.55);
	animation: av-pulso 2.2s infinite;
}

@keyframes av-pulso {
	70% {
		box-shadow: 0 0 0 12px rgba(247, 240, 0, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(247, 240, 0, 0);
	}
}

.av-hero h1 {
	font-size: clamp(44px, min(13vw, 9.5vh), 92px);
	color: var(--papel);
	text-transform: uppercase;
	letter-spacing: -0.015em;
}

.av-linha-mascara {
	display: block;
	overflow: hidden;
}

.av-linha-mascara > span {
	display: block;
	transform: translateY(105%);
}

.avseg.is-pronto .av-linha-mascara > span {
	transform: none;
	transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1);
}

.avseg.is-pronto .av-linha-mascara:nth-of-type(2) > span {
	transition-delay: 0.1s;
}

.avseg.is-pronto .av-linha-mascara:nth-of-type(3) > span {
	transition-delay: 0.2s;
}

.av-hero em {
	font-style: normal;
	color: var(--amarelo);
}

.av-hero__texto {
	margin-top: clamp(12px, 2.2vh, 24px);
	font-size: clamp(15px, min(1.4vw, 1.9vh), 18.5px);
	color: rgba(255, 255, 255, 0.7);
	max-width: 47ch;
}

.av-hero__botoes {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: clamp(16px, 2.8vh, 34px);
}

.av-provas {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(10px, 1.6vh, 16px) clamp(22px, 3vw, 40px);
	margin-top: clamp(18px, 3.4vh, 44px);
	padding-top: clamp(14px, 2.4vh, 30px);
	border-top: 1px solid var(--linha);
}

.av-prova strong {
	display: block;
	font-family: var(--display);
	font-size: clamp(21px, 2.9vh, 30px);
	font-weight: 700;
	color: var(--papel);
	line-height: 1.05;
}

.av-prova span {
	display: block;
	margin-top: 2px;
	font-size: clamp(12.5px, 1.6vh, 14.5px);
	line-height: 1.3;
	min-height: 2.6em;
	color: var(--fumaca);
}

/* radar */

.av-radar {
	position: relative;
	aspect-ratio: 1;
	max-width: 470px;
	width: 100%;
	margin-inline: auto;
}

.av-radar__anel {
	position: absolute;
	inset: 0;
	border: 1px solid var(--linha);
	border-radius: 50%;
}

.av-radar__anel:nth-child(2) {
	inset: 12%;
}

.av-radar__anel:nth-child(3) {
	inset: 25%;
}

.av-radar__anel:nth-child(4) {
	inset: 38%;
}

.av-radar__varredura {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: conic-gradient(from 0deg, var(--amarelo-fundo), rgba(247, 240, 0, 0) 42%);
	mask-image: radial-gradient(circle, transparent 24%, #000 62%);
	-webkit-mask-image: radial-gradient(circle, transparent 24%, #000 62%);
	animation: av-gira 4.8s linear infinite;
}

@keyframes av-gira {
	to {
		transform: rotate(360deg);
	}
}

.av-radar__onda {
	position: absolute;
	inset: 38%;
	border: 1px solid var(--amarelo-borda);
	border-radius: 50%;
	animation: av-onda 3.6s cubic-bezier(0.22, 0.6, 0.3, 1) infinite;
}

.av-radar__onda:nth-of-type(2) {
	animation-delay: 1.8s;
}

@keyframes av-onda {
	0% {
		inset: 38%;
		opacity: 0.85;
	}
	100% {
		inset: -2%;
		opacity: 0;
	}
}

.av-radar__escudo img {
	width: 100%;
	height: auto;
	filter: drop-shadow(0 14px 34px rgba(0, 0, 0, 0.6));
}

.av-radar__escudo {
	position: absolute;
	inset: 31%;
	display: grid;
	place-items: center;
	animation: av-flutua 6s ease-in-out infinite;
}

@keyframes av-flutua {
	50% {
		transform: translateY(-9px);
	}
}

.av-radar__ponto {
	position: absolute;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--amarelo);
	transform: translate(-50%, -50%);
}

.av-radar__ponto::after {
	content: "";
	position: absolute;
	inset: -7px;
	border: 1px solid var(--amarelo-borda);
	border-radius: 50%;
}

.av-etiqueta {
	position: absolute;
	background: rgba(22, 22, 22, 0.92);
	border: 1px solid var(--linha);
	border-radius: 12px;
	padding: 10px 15px;
	font-size: 14px;
	line-height: 1.35;
	color: rgba(255, 255, 255, 0.68);
	white-space: nowrap;
	animation: av-flutua 7s ease-in-out infinite;
}

.av-etiqueta:nth-of-type(2) {
	animation-delay: 1.4s;
}

.av-etiqueta strong {
	display: block;
	font-family: var(--display);
	font-weight: 700;
	font-size: 14px;
	color: var(--papel);
}

/* ---------------- esteira ---------------- */

.av-hero > .av-esteira {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
}

.av-esteira {
	background: var(--amarelo);
	color: var(--tinta);
	overflow: hidden;
	padding: 16px 0;
}

.av-esteira__trilho {
	display: flex;
	width: max-content;
	animation: av-corre 38s linear infinite;
}

.av-esteira ul {
	display: flex;
	align-items: center;
	gap: 46px;
	padding-right: 46px;
	font-family: var(--display);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.av-esteira li {
	display: flex;
	align-items: center;
	gap: 46px;
}

.av-esteira li::after {
	content: "";
	width: 7px;
	height: 7px;
	background: var(--tinta);
	border-radius: 50%;
}

@keyframes av-corre {
	to {
		transform: translateX(-50%);
	}
}

/* ---------------- seções ---------------- */

.av-secao {
	padding: var(--gap-secao) 0;
	position: relative;
}

.av-secao--areia {
	background: var(--areia);
}

.av-secao--escura {
	background: var(--tinta);
	color: var(--papel);
	overflow: hidden;
}

.av-secao--escura h2,
.av-secao--escura h3 {
	color: var(--papel);
}

.av-titulo {
	font-size: clamp(32px, 4.8vw, 56px);
	max-width: 17ch;
	text-transform: uppercase;
	letter-spacing: -0.005em;
}

.av-intro {
	margin-top: 20px;
	color: #4a4a46;
	max-width: 58ch;
	font-size: 18px;
}

.av-secao--escura .av-intro {
	color: rgba(255, 255, 255, 0.66);
}

.av-cabeca {
	max-width: 660px;
	margin-bottom: clamp(40px, 5vw, 64px);
}

/* ---------------- quem somos ---------------- */

.av-video {
	position: relative;
	border-radius: 22px;
	overflow: hidden;
	background: var(--tinta);
	aspect-ratio: 16 / 9;
}

.av-video__capa {
	position: absolute;
	inset: 0;
	width: 100%;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
	display: block;
}

.av-video__capa img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* a miniatura de reserva do YouTube vem com faixas pretas em cima e
   embaixo; a ampliação corta as faixas */
.av-video__capa img.is-reserva {
	transform: scale(1.34);
}

.av-video__capa::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(14, 14, 14, 0.72), rgba(14, 14, 14, 0.08) 62%);
}

.av-video__play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 76px;
	height: 76px;
	border-radius: 50%;
	background: var(--amarelo);
	color: var(--tinta);
	display: grid;
	place-items: center;
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	z-index: 1;
}

.av-video__play svg {
	width: 30px;
	height: 30px;
	margin-left: 4px;
}

.av-video__capa:hover .av-video__play {
	transform: translate(-50%, -50%) scale(1.08);
}

.av-video__texto {
	position: absolute;
	left: 24px;
	bottom: 22px;
	z-index: 1;
	font-family: var(--display);
	font-weight: 700;
	font-size: 17px;
	color: var(--papel);
}

.av-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* ---------------- cards ---------------- */

.av-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

.av-card {
	position: relative;
	background: var(--papel);
	border: 1px solid var(--linha-clara);
	border-radius: var(--r);
	padding: 30px 28px 34px;
	overflow: hidden;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}

.av-card::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 0%), var(--amarelo-fundo), transparent 70%);
	opacity: 0;
	transition: opacity 0.35s ease;
	pointer-events: none;
}

.av-card:hover {
	transform: translateY(-5px);
	border-color: var(--tinta);
}

.av-card:hover::after {
	opacity: 1;
}

.av-card__icone {
	width: 50px;
	height: 50px;
	display: grid;
	place-items: center;
	border-radius: 14px;
	background: var(--amarelo);
	color: var(--tinta);
	margin-bottom: 22px;
}

.av-card__icone svg {
	width: 25px;
	height: 25px;
}

.av-card h3 {
	font-size: 20.5px;
	position: relative;
}

.av-card p {
	margin-top: 11px;
	font-size: 16px;
	color: #56564f;
	position: relative;
}

/* ---------------- rastreamento ---------------- */

.av-rastreio {
	display: grid;
	grid-template-columns: 1.02fr 0.98fr;
	gap: clamp(36px, 5vw, 70px);
	align-items: center;
}

.av-mapa {
	position: relative;
	border: 1px solid var(--linha);
	border-radius: 22px;
	background: var(--tinta-2);
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.av-mapa > svg {
	color: var(--amarelo);
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.av-mapa__rota {
	fill: none;
	stroke: var(--amarelo);
	stroke-width: 3;
	stroke-linecap: round;
	stroke-dasharray: 640;
	stroke-dashoffset: 640;
}

.av-mapa.is-visivel .av-mapa__rota {
	animation: av-tracar 5s ease-in-out infinite;
}

@keyframes av-tracar {
	0% {
		stroke-dashoffset: 640;
	}
	58%,
	100% {
		stroke-dashoffset: 0;
	}
}

.av-hud {
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: 18px;
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
}

.av-hud div {
	background: rgba(14, 14, 14, 0.9);
	border: 1px solid var(--linha);
	border-radius: 12px;
	padding: 9px 14px;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.72);
}

.av-hud strong {
	display: block;
	font-family: var(--display);
	font-size: 14.5px;
	color: var(--papel);
}

/* ---------------- planos ---------------- */

.av-planos {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
}

.av-plano {
	background: var(--papel);
	border: 1px solid var(--linha-clara);
	border-radius: 22px;
	padding: 36px 34px 38px;
	display: flex;
	flex-direction: column;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}

.av-plano:hover {
	transform: translateY(-5px);
	border-color: var(--tinta);
}

.av-plano__topo {
	display: flex;
	align-items: center;
	gap: 15px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--linha-clara);
}

.av-plano__icone {
	width: 42px;
	height: 42px;
	color: var(--tinta);
	flex: none;
}

.av-plano h3 {
	font-size: 25px;
}

.av-plano__topo span {
	display: block;
	font-family: var(--texto);
	font-size: 15px;
	font-weight: 500;
	color: #6a6a62;
}

.av-plano ul {
	display: grid;
	gap: 12px;
	padding: 26px 0 30px;
}

.av-plano li {
	display: flex;
	gap: 11px;
	font-size: 16.5px;
	color: #3c3c37;
}

.av-plano li svg {
	width: 20px;
	height: 20px;
	flex: none;
	margin-top: 4px;
	color: var(--tinta);
}

.av-plano .av-btn {
	margin-top: auto;
}

/* ---------------- dúvidas ---------------- */

.av-cabeca--centro {
	margin-inline: auto;
	text-align: center;
}

.av-cabeca--centro .av-titulo,
.av-cabeca--centro .av-intro {
	margin-inline: auto;
}

.av-faq {
	border-top: 1px solid var(--linha-clara);
	max-width: 880px;
}

.av-faq--centro {
	margin-inline: auto;
}

.av-item {
	border-bottom: 1px solid var(--linha-clara);
}

.av-item button {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	background: none;
	border: none;
	padding: 24px 4px;
	text-align: left;
	cursor: pointer;
	font-family: var(--display);
	font-weight: 700;
	font-size: clamp(18px, 2.4vw, 22px);
	color: var(--tinta);
	letter-spacing: -0.015em;
}

.av-item button i {
	width: 34px;
	height: 34px;
	flex: none;
	border-radius: 50%;
	border: 1px solid var(--linha-clara);
	display: grid;
	place-items: center;
	font-style: normal;
	font-size: 21px;
	line-height: 1;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), background 0.25s ease, border-color 0.25s ease;
}

.av-item.is-aberto button i {
	transform: rotate(45deg);
	background: var(--amarelo);
	border-color: var(--amarelo);
}

.av-item__corpo {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-item.is-aberto .av-item__corpo {
	grid-template-rows: 1fr;
}

.av-item__corpo > div {
	overflow: hidden;
}

.av-item__corpo p {
	padding: 0 4px 26px;
	color: #52524b;
	max-width: 62ch;
}

/* ---------------- contato ---------------- */

.av-contato {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(30px, 4vw, 56px);
}

.av-canais {
	display: grid;
	gap: 13px;
	align-content: start;
}

.av-canal {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	background: var(--tinta-2);
	border: 1px solid var(--linha);
	border-radius: var(--r);
	padding: 22px 24px;
	transition: border-color 0.3s ease;
}

.av-canal:hover {
	border-color: var(--linha-forte);
}

.av-canal > svg {
	width: 24px;
	height: 24px;
	color: var(--amarelo);
	flex: none;
	margin-top: 3px;
}

.av-canal h3 {
	font-family: var(--texto);
	font-size: 14px;
	font-weight: 500;
	color: var(--fumaca);
}

.av-canal p,
.av-canal a {
	display: block;
	font-size: 18px;
	color: var(--papel);
	margin-top: 5px;
	line-height: 1.45;
}

.av-canal a:hover {
	color: var(--amarelo);
}

.av-plantao {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 16px;
	margin-top: 6px;
}

.av-plantao li {
	position: relative;
}

.av-plantao li + li::before {
	content: "·";
	position: absolute;
	left: -10px;
	opacity: 0.55;
}

.av-canal .av-plantao a {
	display: inline-block;
	margin-top: 0;
	font-size: 16.5px;
	white-space: nowrap;
}

.av-canal--urgencia {
	background: var(--amarelo);
	border-color: var(--amarelo);
}

.av-canal--urgencia > svg {
	color: var(--tinta);
}

.av-canal--urgencia h3 {
	color: #4a4a1e;
}

.av-canal--urgencia p,
.av-canal--urgencia a {
	color: var(--tinta);
}

.av-canal--urgencia a:hover {
	color: var(--tinta);
	text-decoration: underline;
}

.av-form {
	background: var(--tinta-2);
	border: 1px solid var(--linha);
	border-radius: 22px;
	padding: 34px 32px 36px;
}

.av-form h3 {
	font-size: 24px;
}

.av-form > p {
	margin-top: 10px;
	color: rgba(255, 255, 255, 0.62);
	font-size: 16px;
}

.av-campo {
	margin-top: 18px;
}

.av-campo label {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.72);
	margin-bottom: 7px;
}

.av-campo input,
.av-campo select {
	width: 100%;
	height: 52px;
	padding: 0 16px;
	font-family: var(--texto);
	font-size: 16px;
	color: var(--papel);
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid var(--linha);
	border-radius: 12px;
	appearance: none;
	transition: border-color 0.25s ease, background 0.25s ease;
}

.av-campo select option {
	color: #0e0e0e;
}

.av-campo input::placeholder {
	color: rgba(255, 255, 255, 0.58);
}

.av-campo input:focus,
.av-campo select:focus {
	border-color: var(--amarelo);
	background: rgba(255, 255, 255, 0.08);
	outline: none;
}

.av-erro {
	display: none;
	margin-top: 7px;
	font-size: 14px;
	color: #ff9a9a;
}

.av-campo.is-erro .av-erro {
	display: block;
}

.av-campo.is-erro input,
.av-campo.is-erro select {
	border-color: #ff9a9a;
}

.av-form .av-btn {
	margin-top: 26px;
}

.av-form small {
	display: block;
	margin-top: 14px;
	font-size: 13.5px;
	color: rgba(255, 255, 255, 0.62);
	text-align: center;
}

/* ---------------- rodapé ---------------- */

.av-rodape {
	background: var(--tinta);
	color: rgba(255, 255, 255, 0.62);
	border-top: 1px solid var(--linha);
	padding: 66px 0 0;
	font-size: 15.5px;
	overflow: hidden;
}

.av-rodape__grade {
	display: grid;
	grid-template-columns: 1.7fr 0.9fr 0.9fr;
	gap: 42px;
	padding-bottom: 46px;
}

.av-rodape .av-marca {
	height: 46px;
}

.av-rodape h4 {
	font-size: 13px;
	color: var(--papel);
	margin-bottom: 14px;
	letter-spacing: 0.02em;
}

.av-rodape ul {
	display: grid;
	gap: 8px;
	font-size: 14px;
}

.av-rodape a:hover {
	color: var(--amarelo);
}

.av-rodape__sobre p {
	margin-top: 20px;
	max-width: 40ch;
}

.av-sociais {
	display: flex;
	gap: 10px;
	margin-top: 22px;
}

.av-sociais a {
	width: 44px;
	height: 44px;
	border: 1px solid var(--linha);
	border-radius: 50%;
	display: grid;
	place-items: center;
	color: var(--papel);
	transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.av-sociais a:hover {
	background: var(--amarelo);
	border-color: var(--amarelo);
	color: var(--tinta);
}

.av-sociais svg {
	width: 19px;
	height: 19px;
}

.av-rodape__fim {
	border-top: 1px solid var(--linha);
	padding: 22px 0 26px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
	justify-content: space-between;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.64);
}

/* ---------------- flutuantes ---------------- */

.av-flutuante {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 80;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-end;
}

.avseg .av-zap {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #25d366;
	color: #05331a;
	font-family: var(--display);
	font-weight: 700;
	font-size: 15px;
	padding: 14px 21px;
	border-radius: 999px;
	box-shadow: 0 14px 34px rgba(37, 211, 102, 0.32);
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.avseg .av-zap:hover {
	transform: translateY(-3px);
}

.avseg .av-zap svg {
	width: 22px;
	height: 22px;
}

.av-topo {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--tinta);
	color: var(--amarelo);
	border: 1px solid var(--linha-forte);
	display: grid;
	place-items: center;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.av-topo.is-visivel {
	opacity: 1;
	pointer-events: auto;
}

/* ---------------- revelação ---------------- */

.av-sobe {
	opacity: 0;
	transform: translateY(30px);
}

.av-sobe.is-visivel {
	opacity: 1;
	transform: none;
	transition: opacity 0.8s ease, transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------------- responsivo ---------------- */

@media (max-width: 1080px) {
	.av-cards {
		grid-template-columns: repeat(2, 1fr);
	}

	.av-hero__linha,
	.av-sobre,
	.av-rastreio,
	.av-contato {
		grid-template-columns: 1fr;
	}

	.av-radar {
		max-width: 400px;
	}

	.av-rodape__grade {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 900px) {
	.av-menu-btn {
		display: block;
	}

	.av-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		background: var(--tinta);
		border-bottom: 1px solid var(--linha);
		padding: 8px 20px 22px;
		display: none;
	}

	.av-nav.is-aberta {
		display: flex;
	}

	.av-nav a {
		padding: 15px 6px;
		border-bottom: 1px solid var(--linha);
		border-radius: 0;
		font-size: 17px;
	}

	.av-header__acoes .av-btn--acao {
		display: none;
	}

	.av-aviso__linha {
		justify-content: center;
		text-align: center;
	}

	.av-aviso__endereco,
	.av-aviso__linha a:last-of-type {
		display: none;
	}

	.av-tempo {
		padding-left: 34px;
	}

	.av-etapa__marca {
		left: -34px;
	}
}

@media (max-width: 720px) {
	.avseg {
		font-size: 16px;
	}

	.av-cards,
	.av-planos,
	.av-rodape__grade {
		grid-template-columns: 1fr;
	}

	.av-depo {
		flex: 0 0 280px;
		padding: 26px 24px;
	}

	.av-etiqueta {
		display: none;
	}

	.av-radar {
		max-width: min(230px, 34vh);
	}

	.av-zap span {
		display: none;
	}

	.av-zap {
		padding: 15px;
	}

	.av-provas {
		gap: 18px 28px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.avseg *,
	.avseg *::before,
	.avseg *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.av-sobe,
	.av-linha-mascara > span {
		opacity: 1;
		transform: none;
	}
}

/* ---------------- linha do tempo ---------------- */

.av-tempo {
	position: relative;
	padding-left: 56px;
}

.av-tempo__trilho {
	position: absolute;
	left: 5px;
	top: 10px;
	bottom: 10px;
	width: 2px;
	background: var(--linha);
	border-radius: 2px;
	overflow: hidden;
}

.av-tempo__trilho span {
	display: block;
	width: 100%;
	height: 0;
	background: var(--amarelo);
	border-radius: 2px;
}

.av-tempo__lista {
	display: grid;
	gap: clamp(40px, 5vw, 62px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.av-etapa {
	position: relative;
}

.av-etapa__marca {
	position: absolute;
	left: -56px;
	top: 7px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--tinta-2);
	border: 2px solid var(--linha-forte);
	transition: background 0.45s ease, border-color 0.45s ease, transform 0.45s ease;
}

.av-etapa.is-visivel .av-etapa__marca {
	background: var(--amarelo);
	border-color: var(--amarelo);
	transform: scale(1.2);
}

.av-etapa__n {
	display: block;
	font-family: var(--display);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.16em;
	color: var(--amarelo);
	margin-bottom: 10px;
}

.av-etapa h3 {
	font-size: clamp(24px, 3.2vw, 34px);
}

.av-etapa p {
	margin-top: 12px;
	color: rgba(255, 255, 255, 0.68);
	max-width: 56ch;
}

/* ---------------- depoimentos em fita ---------------- */

.av-fita {
	position: relative;
	overflow: hidden;
	mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}

.av-fita__trilho {
	display: flex;
	gap: 16px;
	width: max-content;
	padding: 4px 0;
}

.av-fita.is-rodando .av-fita__trilho {
	animation: av-fita 28s linear infinite;
}

.av-fita:hover .av-fita__trilho,
.av-fita:focus-within .av-fita__trilho {
	animation-play-state: paused;
}

@keyframes av-fita {
	to {
		transform: translateX(calc(-50% - 8px));
	}
}

.av-depo {
	flex: 0 0 340px;
	background: var(--papel);
	border: 1px solid var(--linha-clara);
	border-radius: 20px;
	padding: 30px 28px;
	display: flex;
	flex-direction: column;
}

.av-estrelas {
	display: flex;
	gap: 3px;
	color: var(--tinta);
	margin-bottom: 16px;
}

.av-estrelas svg {
	width: 16px;
	height: 16px;
}

.av-depo p {
	font-size: 16.5px;
	color: #46463f;
}

.av-depo__autor {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
	padding-top: 18px;
	border-top: 1px solid var(--linha-clara);
}

.av-inicial {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--tinta);
	color: var(--amarelo);
	display: grid;
	place-items: center;
	font-family: var(--display);
	font-weight: 700;
	flex: none;
}

.av-depo__autor strong {
	font-family: var(--display);
	font-size: 16px;
}

.av-depo__autor span {
	display: block;
	font-size: 14px;
	color: #75756c;
}

/* ---------------- escolha de tipo e retorno do formulário ---------------- */

.av-campo__rotulo {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.72);
	margin-bottom: 7px;
}

.av-opcoes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.av-opcoes label {
	position: relative;
	display: block;
}

.av-opcoes input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.av-opcoes span {
	display: grid;
	place-items: center;
	height: 52px;
	border: 1px solid var(--linha);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.05);
	font-family: var(--display);
	font-weight: 700;
	font-size: 15px;
	color: var(--papel);
	transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.av-opcoes input:checked + span {
	background: var(--amarelo);
	border-color: var(--amarelo);
	color: var(--tinta);
}

.av-opcoes input:focus-visible + span {
	outline: 3px solid var(--amarelo);
	outline-offset: 3px;
}

.av-sucesso {
	margin-top: 18px;
	padding: 16px 18px;
	border-radius: 12px;
	background: var(--amarelo-fundo);
	border: 1px solid var(--amarelo-borda);
	color: var(--papel);
	font-size: 15.5px;
	line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
	.av-fita.is-rodando .av-fita__trilho {
		animation: none;
	}

	.av-tempo__trilho span {
		height: 100% !important;
	}
}

/* ---------------- sprite de ícones ---------------- */

.av-sprite {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

.avseg .av-topo svg {
	width: 20px;
	height: 20px;
}

/* ---------------- tudo centralizado no celular ---------------- */

@media (max-width: 900px) {
	.av-hero__texto-col,
	.av-cabeca,
	.av-sobre > div,
	.av-rastreio > div,
	.av-cta__linha,
	.av-cta__linha > div,
	.av-card,
	.av-plano,
	.av-depo,
	.av-canal,
	.av-etapa,
	.av-form,
	.av-rodape {
		text-align: center;
	}

	.av-cabeca,
	.av-titulo,
	.av-intro,
	.av-hero__texto,
	.av-etapa p,
	.av-rodape__sobre p,
	.av-cta h2,
	.av-cta p {
		margin-inline: auto;
	}

	.av-selo,
	.av-hero__botoes,
	.av-provas,
	.av-cta__linha,
	.av-estrelas,
	.av-depo__autor,
	.av-sociais,
	.av-rodape__fim,
	.av-opcoes {
		justify-content: center;
	}

	.av-provas {
		gap: 20px 34px;
	}

	.av-card__icone,
	.av-marca img {
		margin-inline: auto;
	}

	.av-marca {
		height: calc(48px - 16px * var(--av-encolhe, 0));
	}

	/* cada item vira um bloco centrado, com o texto alinhado à esquerda
	   por dentro, para não ficar irregular quando quebra em duas linhas */
	.av-lista,
	.av-plano ul {
		justify-items: center;
	}

	.av-lista li,
	.av-plano li {
		text-align: left;
		max-width: 30ch;
	}

	.av-plano__topo {
		flex-direction: column;
		gap: 12px;
	}

	.av-canal {
		flex-direction: column;
		align-items: center;
		gap: 10px;
	}

	.av-canal > svg {
		margin-top: 0;
	}

	.av-video__texto {
		left: 0;
		right: 0;
		text-align: center;
	}

	/* a linha do tempo desce pelo meio, com um marcador centralizado
	   acima de cada etapa */
	.av-tempo {
		padding-left: 0;
	}

	/* o traço contínuo cruzaria o texto centralizado, então cada etapa
	   ganha um segmento curto acima do marcador, que acende ao entrar */
	.av-tempo__trilho {
		display: none;
	}

	.av-tempo__lista {
		gap: clamp(30px, 4.5vw, 44px);
	}

	.av-etapa {
		padding-top: 48px;
	}

	.av-etapa::before {
		content: "";
		position: absolute;
		left: 50%;
		top: 0;
		width: 2px;
		height: 24px;
		border-radius: 2px;
		background: var(--linha-forte);
		transform: translateX(-50%);
		transition: background 0.55s ease;
	}

	.av-etapa.is-visivel::before {
		background: var(--amarelo);
	}

	.av-etapa__marca {
		left: 50%;
		top: 24px;
		transform: translateX(-50%);
	}

	.av-etapa.is-visivel .av-etapa__marca {
		transform: translateX(-50%) scale(1.2);
	}

	.av-etapa__n {
		font-size: 15px;
	}

	/* pergunta acima, sinal de mais abaixo */
	.av-item button {
		flex-direction: column;
		gap: 14px;
		text-align: center;
		padding: 22px 4px;
	}

	.av-rodape__grade {
		justify-items: center;
	}

	.av-form .av-campo label,
	.av-form .av-campo__rotulo,
	.av-form .av-erro {
		text-align: center;
	}
}

/* ---------------- topo em uma tela só, no celular ---------------- */

@media (max-width: 900px) {
	.av-hero {
		min-height: 500px;
	}

	/* no celular o radar vira só o escudo, acima do texto, para o topo
	   inteiro caber sem rolagem */
	.av-radar {
		position: static;
		aspect-ratio: auto;
		max-width: none;
		height: auto;
		display: flex;
		justify-content: center;
		order: -1;
		margin-bottom: clamp(6px, 1.2vh, 14px);
	}

	.av-radar__anel,
	.av-radar__varredura,
	.av-radar__onda,
	.av-radar__ponto {
		display: none;
	}

	.av-radar__escudo {
		position: static;
		inset: auto;
		height: auto;
		width: auto;
	}

	/* a altura vai direto na imagem: porcentagem dentro de grid centrado
	   não resolve e a marca voltava ao tamanho natural */
	.av-radar__escudo img {
		width: auto;
		height: clamp(46px, 6.6vh, 80px);
		max-width: none;
	}

	.av-hero__linha {
		gap: clamp(8px, 1.6vh, 34px);
	}

	.av-hero__texto {
		max-width: 44ch;
		font-size: clamp(14px, 1.8vh, 17px);
	}

	/* os dois botões lado a lado economizam quase 60px de altura,
	   o que tira os números de baixo do botão flutuante.
	   Vale só no topo: nas outras seções eles quebram normalmente */
	.av-hero .av-hero__botoes {
		gap: 8px;
		flex-wrap: nowrap;
	}

	.av-hero .av-btn {
		padding: 12px 14px;
		font-size: clamp(12.5px, 1.6vh, 14px);
		white-space: nowrap;
	}

	.av-provas {
		flex-wrap: nowrap;
		gap: 6px 12px;
		margin-top: clamp(14px, 2.6vh, 44px);
		padding-top: clamp(12px, 2vh, 30px);
	}

	.av-prova {
		flex: 1;
		min-width: 0;
	}

	.av-prova span {
		font-size: 12px;
		letter-spacing: -0.005em;
	}

	.av-prova strong {
		font-size: clamp(22px, 3.2vh, 30px);
	}
}

/* ---------------- ajustes finos do celular ---------------- */

@media (max-width: 900px) {
	/* os cartões de status saem de dentro do mapa e viram uma faixa
	   abaixo dele, senão cobrem a rota */
	.av-mapa {
		aspect-ratio: auto;
		background: none;
		border: none;
		border-radius: 0;
		overflow: visible;
		display: grid;
		gap: 10px;
	}

	.av-mapa > svg {
		position: relative;
		width: 100%;
		height: clamp(190px, 30vh, 260px);
		background: var(--tinta-2);
		border: 1px solid var(--linha);
		border-radius: 18px;
	}

	/* três colunas espremiam os textos em duas linhas cada; no celular
	   vira uma lista, rótulo à esquerda e estado à direita */
	.av-hud {
		position: static;
		display: grid;
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.av-hud div {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		padding: 12px 16px;
		font-size: 14px;
		line-height: 1.3;
		text-align: left;
	}

	.av-hud strong {
		display: flex;
		align-items: center;
		gap: 9px;
		font-size: 15px;
		margin: 0;
	}

	.av-hud strong::before {
		content: "";
		width: 7px;
		height: 7px;
		border-radius: 50%;
		background: var(--amarelo);
		flex: none;
	}

	/* um telefone por linha, para nenhum número quebrar no meio */
	.av-plantao {
		flex-direction: column;
		align-items: center;
		gap: 4px;
	}

	.av-plantao li + li::before {
		display: none;
	}
}

/* ---------------- rótulo das seções ---------------- */

.av-tag {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--texto);
	font-size: 14.5px;
	font-weight: 500;
	letter-spacing: 0.01em;
	color: #6d6d64;
	border: 1px solid var(--linha-clara);
	border-radius: 999px;
	padding: 6px 18px;
	margin-bottom: 18px;
}

.av-tag::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--amarelo);
}

.av-secao--escura .av-tag {
	color: var(--fumaca);
	border-color: var(--linha);
	background: rgba(255, 255, 255, 0.04);
}

/* ---------------- barra fixa do celular ---------------- */

.av-barra {
	display: none;
}

@media (max-width: 900px) {
	.av-barra {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 85;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		background: rgba(14, 14, 14, 0.9);
		backdrop-filter: saturate(160%) blur(16px);
		-webkit-backdrop-filter: saturate(160%) blur(16px);
		border-top: 1px solid var(--linha);
		padding-bottom: env(safe-area-inset-bottom);
	}

	.av-barra a {
		position: relative;
		display: grid;
		justify-items: center;
		align-content: center;
		gap: 6px;
		padding: 11px 6px 13px;
		min-height: 62px;
		color: var(--papel);
		font-size: 11px;
		line-height: 1.2;
		text-align: center;
		letter-spacing: 0.01em;
		transition: background 0.2s ease;
	}

	.av-barra a + a::before {
		content: "";
		position: absolute;
		left: 0;
		top: 22%;
		bottom: 22%;
		width: 1px;
		background: var(--linha);
	}

	.av-barra a:active {
		background: rgba(255, 255, 255, 0.07);
	}

	.av-barra svg {
		width: 22px;
		height: 22px;
		color: var(--amarelo);
	}

	/* a bolha do WhatsApp sai, já está na barra */
	.avseg .av-zap {
		display: none;
	}

	.av-flutuante {
		bottom: calc(74px + env(safe-area-inset-bottom));
	}

	/* espaço para a barra não cobrir o fim do rodapé */
	.av-rodape__fim {
		padding-bottom: calc(88px + env(safe-area-inset-bottom));
	}
}

/* ---------------- depoimentos no celular ---------------- */

@media (max-width: 900px) {
	/* a regra de 280px vinha antes no arquivo e era vencida pela
	   definição da fita, que veio depois */
	.av-depo {
		flex: 0 0 280px;
		padding: 26px 24px;
	}

	.av-fita.is-rodando .av-fita__trilho {
		animation-duration: 22s;
	}
}

/* ---------------- linhas vazias do título ---------------- */

.av-linha-mascara > span:empty,
.av-linha-mascara > span:has(> em:empty) {
	display: none;
}

/* ---------------- vídeo alinhado ao texto ---------------- */

@media (min-width: 1081px) {
	/* lado a lado, o vídeo acompanha a altura da coluna de texto,
	   do rótulo até os botões */
	.av-video {
		aspect-ratio: auto;
		height: 100%;
		min-height: 300px;
	}
}

/* ---------------- linha do tempo em zigue-zague ---------------- */

@media (min-width: 901px) {
	.av-tempo {
		padding-left: 0;
	}

	.av-tempo__trilho {
		left: 50%;
		transform: translateX(-50%);
	}

	.av-tempo__lista {
		gap: clamp(24px, 3vw, 46px);
	}

	/* ímpares à esquerda da linha, pares à direita */
	.av-etapa {
		padding-right: calc(50% + 48px);
		text-align: right;
	}

	.av-etapa:nth-child(even) {
		padding-right: 0;
		padding-left: calc(50% + 48px);
		text-align: left;
	}

	.av-etapa p {
		max-width: none;
	}

	.av-etapa__marca {
		left: 50%;
		top: 7px;
		transform: translateX(-50%);
	}

	.av-etapa.is-visivel .av-etapa__marca {
		transform: translateX(-50%) scale(1.2);
	}

	/* traço curto ligando cada etapa à linha central */
	.av-etapa::before {
		content: "";
		position: absolute;
		top: 12px;
		width: 32px;
		height: 2px;
		right: calc(50% + 8px);
		background: var(--linha-forte);
		transition: background 0.55s ease;
	}

	.av-etapa:nth-child(even)::before {
		right: auto;
		left: calc(50% + 8px);
	}

	.av-etapa.is-visivel::before {
		background: var(--amarelo);
	}
}

/* ---------------- telas baixas ---------------- */

@media (max-width: 1080px) and (min-width: 901px) {
	/* nessa faixa o radar já está empilhado e come altura demais */
	.av-radar {
		max-width: min(320px, 32vh);
	}
}

@media (max-height: 700px) and (max-width: 900px) {
	/* celular deitado ou tela curta: o escudo sai para o título respirar */
	.av-radar {
		display: none;
	}
}

/* ---------------- cartões de proteção, versão escura ---------------- */

.avseg .av-plano {
	position: relative;
	overflow: hidden;
	background: var(--tinta);
	border: 1px solid rgba(14, 14, 14, 0.9);
	border-radius: 22px;
	padding: 32px 30px 30px;
	color: var(--papel);
}

.av-plano::after {
	content: "";
	position: absolute;
	width: 300px;
	height: 300px;
	right: -130px;
	top: -150px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--amarelo-fundo), transparent 62%);
	pointer-events: none;
}

.avseg .av-plano:hover {
	transform: translateY(-5px);
	border-color: var(--amarelo);
}

.av-plano__topo {
	position: relative;
	align-items: flex-start;
	gap: 16px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--linha);
}

.avseg .av-plano__icone {
	width: 52px;
	height: 52px;
	padding: 12px;
	border-radius: 15px;
	background: var(--amarelo);
	color: var(--tinta);
	box-sizing: border-box;
}

.av-plano h3 {
	color: var(--papel);
	font-size: 24px;
}

.avseg .av-plano__topo span {
	color: var(--fumaca);
	margin-top: 3px;
}

/* a lista vira uma tabela de especificações */
.avseg .av-plano ul {
	position: relative;
	display: block;
	padding: 6px 0 26px;
}

.avseg .av-plano li {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 2px;
	margin: 0;
	font-size: 16px;
	color: rgba(255, 255, 255, 0.8);
	border-bottom: 1px solid var(--linha);
	transition: color 0.25s ease;
}

.avseg .av-plano li:last-child {
	border-bottom: none;
}

.avseg .av-plano li:hover {
	color: var(--papel);
}

.avseg .av-plano li svg {
	width: 26px;
	height: 26px;
	padding: 5px;
	margin: 0;
	flex: none;
	box-sizing: border-box;
	border: 1px solid var(--linha-forte);
	border-radius: 8px;
	color: var(--amarelo);
	transition: background 0.25s ease, border-color 0.25s ease;
}

.avseg .av-plano li:hover svg {
	background: var(--amarelo-fundo);
	border-color: var(--amarelo);
}

.avseg .av-plano .av-btn {
	position: relative;
}

/* o cartão ficou escuro, então o botão preto precisa virar contorno */
.avseg .av-plano .av-btn--tinta {
	background: transparent;
	border-color: var(--linha-forte);
	color: var(--papel);
}

.avseg .av-plano .av-btn--tinta:hover {
	background: var(--papel);
	border-color: var(--papel);
	color: var(--tinta);
}

@media (max-width: 900px) {
	/* estes cartões fogem da centralização geral: lista alinhada
	   à esquerda é o que mantém os itens legíveis */
	.avseg .av-plano {
		text-align: left;
		padding: 28px 22px 26px;
	}

	.av-plano__topo {
		flex-direction: row;
		align-items: center;
	}

	.avseg .av-plano ul {
		justify-items: stretch;
	}

	.avseg .av-plano li {
		max-width: none;
		text-align: left;
		font-size: 15.5px;
		padding: 13px 0;
	}
}

/* ---------------- barra flutuante do celular ---------------- */

@media (max-width: 900px) {
	.av-barra {
		left: 12px;
		right: 12px;
		bottom: calc(12px + env(safe-area-inset-bottom));
		padding: 6px;
		gap: 4px;
		border: 1px solid rgba(255, 255, 255, 0.16);
		border-radius: 999px;
		background: transparent;
		box-shadow: 0 18px 44px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.07);
	}

	/* o vidro fica numa camada própria, atrás da pílula: quando estava
	   no fundo da barra, ele escurecia o amarelo em 28% */
	.av-barra::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		border-radius: inherit;
		background: rgba(18, 18, 18, 0.72);
		backdrop-filter: saturate(180%) blur(22px);
		-webkit-backdrop-filter: saturate(180%) blur(22px);
	}

	/* as divisórias verticais não combinam com a pílula */
	.av-barra a + a::before {
		display: none;
	}

	.av-barra a {
		min-height: 56px;
		padding: 8px 4px;
		gap: 5px;
		border-radius: 999px;
		font-size: 10.5px;
		letter-spacing: 0.015em;
	}

	.av-barra svg {
		width: 21px;
		height: 21px;
	}

	/* nenhum item nasce selecionado: a pílula amarela desliza até o
	   item sob o cursor, ou sob o dedo no toque */
	.av-barra__gota {
		position: absolute;
		z-index: 1;
		left: 0;
		top: 6px;
		bottom: 6px;
		width: 0;
		border-radius: 999px;
		background: var(--amarelo);
		opacity: 0;
		pointer-events: none;
		transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
			width 0.42s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease;
	}

	.av-barra.is-ativa .av-barra__gota {
		opacity: 1;
	}

	.av-barra a {
		position: relative;
		z-index: 2;
		transition: color 0.25s ease, font-weight 0.2s ease;
	}

	.av-barra a.is-alvo,
	.av-barra a.is-alvo svg {
		color: var(--tinta);
	}

	.av-barra a.is-alvo {
		font-weight: 700;
	}

	.av-flutuante {
		bottom: calc(96px + env(safe-area-inset-bottom));
	}

	.av-rodape__fim {
		padding-bottom: calc(106px + env(safe-area-inset-bottom));
	}
}

/* ================================================================
   Reformulação: quem somos, chamada, depoimentos, rastreamento
   e contato
   ================================================================ */

/* ---------------- quem somos ---------------- */

.av-quadro {
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: clamp(20px, 2.6vw, 34px);
	align-items: stretch;
}

.av-quadro .av-video {
	height: 100%;
	min-height: 420px;
	aspect-ratio: auto;
	border-radius: 24px;
}

.av-pilares {
	display: grid;
	align-content: start;
	gap: 12px;
}

.av-pilar {
	display: grid;
	grid-template-columns: 44px 1fr;
	gap: 16px;
	align-items: start;
	padding: 20px 22px;
	border: 1px solid var(--linha-clara);
	border-radius: 18px;
	background: var(--papel);
	transition: border-color 0.3s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-pilar:hover {
	border-color: var(--tinta);
	transform: translateY(-3px);
}

.av-pilar__n {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 13px;
	background: var(--amarelo);
	color: var(--tinta);
	font-family: var(--display);
	font-weight: 700;
	font-size: 15px;
}

.av-pilar h3 {
	font-size: 18.5px;
}

.av-pilar p {
	margin-top: 6px;
	font-size: 15.5px;
	color: #56564f;
}

.av-quadro__nota {
	margin-top: 8px;
	font-size: 16px;
	color: #56564f;
}

/* ---------------- chamada 365 ---------------- */

.av-chamada {
	position: relative;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1.25fr 0.75fr;
	gap: clamp(28px, 4vw, 60px);
	align-items: center;
	padding: clamp(34px, 5vw, 64px);
	border-radius: 28px;
	background: var(--tinta);
	color: var(--papel);
}

.av-chamada > .av-grade {
	mask-image: radial-gradient(120% 100% at 80% 0%, #000 10%, transparent 70%);
}

.av-chamada > .av-brilho {
	right: -180px;
	top: -220px;
}

.av-chamada__texto {
	position: relative;
}

.av-chamada .av-tag {
	color: var(--fumaca);
	border-color: var(--linha);
	background: rgba(255, 255, 255, 0.04);
}

.av-chamada h2 {
	font-size: clamp(28px, 3.8vw, 46px);
	color: var(--papel);
	text-transform: uppercase;
	letter-spacing: -0.005em;
	max-width: 18ch;
}

.av-chamada p {
	margin-top: 16px;
	max-width: 48ch;
	color: rgba(255, 255, 255, 0.68);
}

.av-chamada__itens {
	position: relative;
	display: grid;
	gap: 10px;
}

.av-chamada__itens li {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 14px 18px;
	border: 1px solid var(--linha);
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.04);
	font-size: 15.5px;
	color: rgba(255, 255, 255, 0.86);
}

.av-chamada__itens svg {
	width: 20px;
	height: 20px;
	flex: none;
	color: var(--amarelo);
}

/* ---------------- depoimentos ---------------- */

.avseg .av-depo {
	position: relative;
	flex: 0 0 360px;
	padding: 34px 30px 30px;
	border-radius: 22px;
	background: var(--areia);
	border: 1px solid var(--linha-clara);
}

.av-depo__aspas {
	position: absolute;
	top: 14px;
	right: 26px;
	font-family: var(--display);
	font-size: 72px;
	font-weight: 700;
	line-height: 1;
	color: var(--amarelo);
	pointer-events: none;
}

.avseg .av-depo p {
	position: relative;
	font-size: 16.5px;
	color: #3f3f39;
}

.av-inicial {
	overflow: hidden;
	background-size: cover;
	background-position: center;
}

.av-inicial.tem-foto {
	color: transparent;
	background-color: var(--areia);
}

/* ---------------- rastreamento ---------------- */

.avseg .av-rastreio {
	grid-template-columns: 1.1fr 0.9fr;
	align-items: start;
}

.av-recursos {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.av-recurso {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 18px 18px;
	border: 1px solid var(--linha);
	border-radius: 16px;
	background: var(--tinta-2);
	transition: border-color 0.3s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-recurso:hover {
	border-color: var(--amarelo-borda);
	transform: translateY(-3px);
}

.av-recurso svg {
	width: 22px;
	height: 22px;
	flex: none;
	color: var(--amarelo);
}

.av-recurso p {
	font-size: 15.5px;
	color: rgba(255, 255, 255, 0.8);
}

.av-recursos .av-btn {
	grid-column: 1 / -1;
}

/* ---------------- contato ---------------- */

.avseg .av-contato {
	grid-template-columns: 1.05fr 0.95fr;
	align-items: start;
}

.avseg .av-canais {
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.av-canal--urgencia {
	grid-column: 1 / -1;
}

.avseg .av-canal {
	border-radius: 18px;
	padding: 20px 22px;
}

.av-form__par {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.av-form__par .av-campo {
	margin-top: 18px;
}

@media (max-width: 1080px) {
	.av-quadro,
	.av-chamada {
		grid-template-columns: 1fr;
	}

	.av-quadro .av-video {
		min-height: 0;
		aspect-ratio: 16 / 9;
	}

	.avseg .av-rastreio,
	.avseg .av-contato {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {
	.av-recursos,
	.avseg .av-canais,
	.av-form__par {
		grid-template-columns: 1fr;
	}

	.avseg .av-depo {
		flex: 0 0 290px;
		padding: 28px 24px 24px;
	}

	.av-depo__aspas {
		font-size: 56px;
		right: 20px;
	}

	.av-pilar {
		grid-template-columns: 38px 1fr;
		gap: 13px;
		text-align: left;
	}

	.av-pilar__n {
		width: 38px;
		height: 38px;
		border-radius: 11px;
	}

	.av-chamada__itens li {
		justify-content: flex-start;
		text-align: left;
	}
}

/* ---------------- acertos finais ---------------- */

.avseg .av-rastreio .av-mapa {
	aspect-ratio: 1.55;
}

.av-inicial {
	color: var(--amarelo);
	font-size: 17px;
}

.av-inicial.tem-foto {
	color: transparent;
}

/* ==========================================================================
   3.1: chamada com palavras na rolagem, depoimentos, globo e mapa
   ========================================================================== */

/* ---------------- chamada 365 ---------------- */

@media (min-width: 901px) {
	.avseg .av-secao--chamada {
		background: var(--papel);
	}
}

.avseg .av-chamada h2 .av-palavra {
	display: inline-block;
	will-change: opacity, filter, transform;
}

@media (max-width: 900px) {
	.avseg .av-chamada__texto {
		text-align: center;
	}

	.avseg .av-chamada h2,
	.avseg .av-chamada p {
		margin-inline: auto;
	}

	.avseg .av-chamada .av-hero__botoes {
		justify-content: center;
	}
}

/* ---------------- depoimentos ---------------- */

.avseg .av-secao--vozes {
	overflow: hidden;
}

.av-vozes__resumo {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	margin-top: 26px;
	padding: 7px 20px 7px 7px;
	border: 1px solid rgba(14, 14, 14, 0.08);
	border-radius: 999px;
	background: var(--papel);
	font-size: 15px;
	line-height: 1.3;
	color: #56564f;
	box-shadow: 0 1px 2px rgba(14, 14, 14, 0.04), 0 10px 28px -14px rgba(14, 14, 14, 0.2);
}

.av-vozes__rostos {
	display: flex;
}

.avseg .av-vozes__rostos .av-voz__foto {
	width: 34px;
	height: 34px;
	font-size: 13px;
	border: 2px solid var(--papel);
	margin-left: -10px;
}

.avseg .av-vozes__rostos .av-voz__foto:first-child {
	margin-left: 0;
}

.av-voz__foto {
	display: grid;
	place-items: center;
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--tinta) center / cover no-repeat;
	color: var(--amarelo);
	font-family: var(--display);
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
}

.av-voz__foto.tem-foto {
	color: transparent;
}

.av-vozes {
	display: grid;
	gap: 4px;
	margin-top: clamp(40px, 5vw, 64px);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
}

.av-vozes__linha {
	overflow: hidden;
	padding: 10px 0 26px;
}

.av-vozes__trilho {
	display: flex;
	width: max-content;
}

.av-vozes.is-rodando .av-vozes__trilho {
	animation: av-vozes var(--av-duracao, 60s) linear infinite;
}

.av-vozes.is-rodando .av-vozes__linha--volta .av-vozes__trilho {
	animation-direction: reverse;
}

/* no toque o hover fica grudado depois do tap e a fita travava, então a
   pausa vale só onde existe ponteiro de verdade */
@media (hover: hover) and (pointer: fine) {
	.av-vozes__linha:hover .av-vozes__trilho {
		animation-play-state: paused;
	}
}

@keyframes av-vozes {
	from {
		transform: translate3d(0, 0, 0);
	}
	to {
		transform: translate3d(-50%, 0, 0);
	}
}

.av-voz {
	position: relative;
	flex: none;
	display: flex;
	flex-direction: column;
	gap: 22px;
	width: clamp(290px, 28vw, 390px);
	margin: 0 18px 0 0;
	padding: 28px 28px 24px;
	border: 1px solid rgba(14, 14, 14, 0.07);
	border-radius: 26px;
	background: var(--papel);
	color: var(--tinta);
	overflow: hidden;
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.03), 0 14px 34px -18px rgba(14, 14, 14, 0.22);
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-voz:hover {
	transform: translateY(-6px) rotate(-0.6deg);
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.03), 0 30px 50px -24px rgba(14, 14, 14, 0.32);
}

.av-voz__topo {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.av-voz__aspas {
	width: 34px;
	height: 34px;
	color: var(--tinta);
}

.av-voz__estrelas {
	display: flex;
	gap: 3px;
	color: var(--tinta);
}

.av-voz__estrelas svg {
	width: 14px;
	height: 14px;
}

.av-voz__texto {
	position: relative;
	flex: 1;
}

.avseg .av-voz__texto p {
	font-size: 17px;
	line-height: 1.62;
	letter-spacing: -0.005em;
	color: inherit;
}

.av-voz__autor {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding-top: 18px;
	border-top: 1px solid rgba(14, 14, 14, 0.08);
	text-align: left;
}

.av-voz__autor strong {
	display: block;
	font-family: var(--display);
	font-size: 15px;
	line-height: 1.2;
}

.av-voz__autor small {
	display: block;
	margin-top: 3px;
	font-size: 13px;
	line-height: 1.2;
	color: #7a7a73;
}

.av-voz--escuro {
	background: var(--tinta);
	border-color: rgba(255, 255, 255, 0.06);
	color: rgba(255, 255, 255, 0.9);
}

.av-voz--escuro::before {
	content: "";
	position: absolute;
	right: -90px;
	top: -110px;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(247, 240, 0, 0.2), transparent 65%);
	pointer-events: none;
}

.av-voz--escuro .av-voz__aspas,
.av-voz--escuro .av-voz__estrelas {
	color: var(--amarelo);
}

.av-voz--escuro .av-voz__autor {
	border-top-color: rgba(255, 255, 255, 0.1);
}

.av-voz--escuro .av-voz__autor strong {
	color: var(--papel);
}

.av-voz--escuro .av-voz__autor small {
	color: var(--fumaca);
}

.avseg .av-voz--escuro .av-voz__foto {
	background-color: var(--amarelo);
	color: var(--tinta);
}

.av-voz--amarelo {
	background: var(--amarelo);
	border-color: transparent;
}

.av-voz--amarelo .av-voz__autor {
	border-top-color: rgba(14, 14, 14, 0.14);
}

.av-voz--amarelo .av-voz__autor small {
	color: rgba(14, 14, 14, 0.62);
}

@media (max-width: 720px) {
	.av-voz {
		width: 292px;
		padding: 24px 22px 20px;
		gap: 18px;
		border-radius: 22px;
	}

	.avseg .av-voz__texto p {
		font-size: 16px;
	}

	.av-vozes {
		-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
		mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	}

	.av-vozes__resumo {
		font-size: 14px;
		text-align: left;
	}
}

@media (prefers-reduced-motion: reduce) {
	.av-vozes.is-rodando .av-vozes__trilho {
		animation: none;
	}

	.av-vozes__linha {
		overflow-x: auto;
	}
}

/* ---------------- globo do rastreamento ---------------- */

.avseg .av-rastreio {
	align-items: center;
}

.av-globo {
	position: relative;
	min-width: 0;
}

.av-globo__palco {
	position: relative;
	width: 100%;
	max-width: 600px;
	margin-inline: auto;
	aspect-ratio: 1;
}

.av-globo__tela {
	display: block;
	width: 100%;
	height: 100%;
	cursor: grab;
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent;
	user-select: none;
}

.av-globo__tela.is-arrastando {
	cursor: grabbing;
}

.av-globo__tela.is-sobre-ponto {
	cursor: pointer;
}

.av-globo__cartao {
	position: absolute;
	left: 2%;
	bottom: 6%;
	display: grid;
	gap: 4px;
	min-width: 220px;
	max-width: 72%;
	padding: 14px 18px 14px 16px;
	border: 1px solid var(--linha);
	border-radius: 16px;
	background: rgba(14, 14, 14, 0.72);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	text-align: left;
	pointer-events: none;
	transition: opacity 0.35s ease, transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-globo__cartao.is-trocando {
	opacity: 0;
	transform: translateY(8px);
}

.av-globo__status {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--amarelo);
}

.av-globo__status i {
	width: 7px;
	height: 7px;
	flex: none;
	border-radius: 50%;
	background: var(--amarelo);
	animation: av-globo-sinal 1.8s ease-out infinite;
}

@keyframes av-globo-sinal {
	0% {
		box-shadow: 0 0 0 0 rgba(247, 240, 0, 0.55);
	}
	100% {
		box-shadow: 0 0 0 10px rgba(247, 240, 0, 0);
	}
}

.avseg .av-globo__cartao strong {
	font-family: var(--display);
	font-size: 17px;
	line-height: 1.2;
	color: var(--papel);
}

.av-globo__cartao small {
	font-size: 12.5px;
	color: var(--fumaca);
	font-variant-numeric: tabular-nums;
}

.av-globo__dica {
	position: absolute;
	right: 2%;
	top: 4%;
	padding: 6px 12px;
	border: 1px solid var(--linha);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.04);
	font-size: 12px;
	color: var(--fumaca);
	pointer-events: none;
	transition: opacity 0.6s ease;
}

.av-globo.is-usado .av-globo__dica {
	opacity: 0;
}

.av-globo__lista {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 18px;
}

.avseg .av-globo__lista button {
	padding: 8px 14px;
	border: 1px solid var(--linha);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.03);
	color: rgba(255, 255, 255, 0.72);
	font-size: 13.5px;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.avseg .av-globo__lista button:hover {
	border-color: var(--linha-forte);
	color: var(--papel);
}

.avseg .av-globo__lista button[aria-pressed="true"] {
	background: var(--amarelo);
	border-color: var(--amarelo);
	color: var(--tinta);
}

@media (max-width: 720px) {
	.av-globo__lista {
		flex-wrap: nowrap;
		justify-content: flex-start;
		overflow-x: auto;
		margin-inline: -20px;
		padding: 0 20px 4px;
		scrollbar-width: none;
	}

	.av-globo__lista::-webkit-scrollbar {
		display: none;
	}

	.avseg .av-globo__lista button {
		flex: none;
	}

	.av-globo__cartao {
		left: 0;
		bottom: 0;
		min-width: 0;
		max-width: 86%;
		padding: 12px 14px;
	}

	.av-globo__dica {
		right: 0;
		top: 0;
	}
}

/* ---------------- localização no contato ---------------- */

.avseg .av-contato {
	align-items: stretch;
}

.av-local {
	position: relative;
	min-height: 460px;
	border: 1px solid var(--linha);
	border-radius: 24px;
	background: var(--tinta-2);
	overflow: hidden;
	isolation: isolate;
}

.av-local__mapa {
	position: absolute;
	inset: 0;
}

.av-local__mapa iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	filter: invert(0.92) hue-rotate(180deg) saturate(0.45) brightness(0.95) contrast(0.95);
}

.av-local::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 55%, rgba(14, 14, 14, 0.6));
	pointer-events: none;
}

.av-local__cartao {
	position: absolute;
	z-index: 2;
	left: 14px;
	right: 14px;
	bottom: 14px;
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 16px 16px 16px;
	border: 1px solid var(--linha);
	border-radius: 18px;
	background: rgba(14, 14, 14, 0.84);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}

.av-local__pino {
	display: grid;
	place-items: center;
	flex: none;
	width: 46px;
	height: 46px;
	border-radius: 14px;
	background: var(--amarelo);
	color: var(--tinta);
}

.av-local__pino svg {
	width: 22px;
	height: 22px;
}

.av-local__texto {
	flex: 1;
	min-width: 0;
	text-align: left;
}

.avseg .av-local__texto h3 {
	font-size: 16px;
	color: var(--papel);
}

.avseg .av-local__texto p {
	margin-top: 3px;
	font-size: 14.5px;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.82);
}

.av-local__texto small {
	display: block;
	margin-top: 4px;
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--fumaca);
}

.av-local .av-btn {
	flex: none;
}

@media (max-width: 720px) {
	.av-local {
		min-height: 540px;
	}

	.av-local__cartao {
		flex-wrap: wrap;
	}

	.av-local__texto {
		flex-basis: calc(100% - 62px);
	}

	.avseg .av-local .av-btn {
		width: 100%;
		justify-content: center;
	}
}

/* ajustes finais da 3.1 */

.avseg .av-canais > .av-canal:last-child:nth-child(even) {
	grid-column: 1 / -1;
}

@media (max-width: 720px) {
	.av-globo__cartao {
		position: relative;
		left: auto;
		bottom: auto;
		max-width: none;
		margin: -4% 0 0;
		text-align: center;
		justify-items: center;
	}

	.av-globo__status {
		justify-content: center;
	}
}

/* ==========================================================================
   3.2: faixa de estados do globo e dúvidas
   ========================================================================== */

/* ---------------- faixa de estados ---------------- */

.av-globo__faixa {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 600px;
	margin: 18px auto 0;
}

.avseg .av-globo__faixa .av-globo__lista {
	flex: 1;
	min-width: 0;
	flex-wrap: nowrap;
	justify-content: flex-start;
	gap: 8px;
	margin: 0;
	padding: 2px 0;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 36px, #000 calc(100% - 36px), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 36px, #000 calc(100% - 36px), transparent);
	cursor: grab;
	user-select: none;
}

.av-globo.lista-inicio .av-globo__lista {
	-webkit-mask-image: linear-gradient(90deg, #000, #000 calc(100% - 36px), transparent);
	mask-image: linear-gradient(90deg, #000, #000 calc(100% - 36px), transparent);
}

.av-globo.lista-fim .av-globo__lista {
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 36px, #000);
	mask-image: linear-gradient(90deg, transparent, #000 36px, #000);
}

.av-globo__lista.is-puxando {
	cursor: grabbing;
	scroll-behavior: auto;
}

.av-globo__lista::-webkit-scrollbar {
	display: none;
}

.avseg .av-globo__faixa .av-globo__lista button {
	flex: none;
	white-space: nowrap;
}

.avseg .av-globo__lista button.is-sede:not([aria-pressed="true"]) {
	border-color: var(--amarelo-borda);
	color: var(--amarelo);
}

.avseg .av-globo__seta {
	display: grid;
	place-items: center;
	flex: none;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 1px solid var(--linha);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.04);
	color: var(--papel);
	cursor: pointer;
	transition: background-color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease;
}

.avseg .av-globo__seta:hover:not(:disabled) {
	background: var(--amarelo);
	border-color: var(--amarelo);
	color: var(--tinta);
}

.avseg .av-globo__seta:disabled {
	opacity: 0.3;
	cursor: default;
}

.av-globo__seta svg {
	width: 16px;
	height: 16px;
	transform: rotate(90deg);
}

.av-globo__seta--volta svg {
	transform: rotate(-90deg);
}

@media (max-width: 720px), (hover: none) {
	.avseg .av-globo__seta {
		display: none;
	}

	.avseg .av-globo__faixa {
		margin-inline: -20px;
	}

	.avseg .av-globo__faixa .av-globo__lista {
		padding-inline: 20px;
		cursor: auto;
	}
}

/* ---------------- dúvidas ---------------- */

.avseg .av-secao--duvidas {
	background: var(--areia);
}

.av-duvidas {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.25fr);
	gap: clamp(40px, 6vw, 96px);
	align-items: start;
}

.av-duvidas__lado {
	position: sticky;
	top: 110px;
	display: grid;
	gap: 36px;
}

.avseg .av-duvidas__cabeca .av-titulo {
	max-width: 13ch;
}

.avseg .av-duvidas__cabeca .av-intro {
	max-width: 38ch;
}

.av-duvidas__ajuda {
	position: relative;
	display: grid;
	justify-items: start;
	gap: 10px;
	padding: 28px;
	border-radius: 24px;
	background: var(--tinta);
	color: var(--papel);
	overflow: hidden;
	isolation: isolate;
}

.av-duvidas__ajuda::before {
	content: "";
	position: absolute;
	z-index: -1;
	right: -80px;
	bottom: -120px;
	width: 280px;
	height: 280px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(247, 240, 0, 0.22), transparent 65%);
}

.av-duvidas__ajuda-icone {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-bottom: 6px;
	border-radius: 14px;
	background: var(--amarelo);
	color: var(--tinta);
}

.av-duvidas__ajuda-icone svg {
	width: 22px;
	height: 22px;
}

.avseg .av-duvidas__ajuda strong {
	font-family: var(--display);
	font-size: 20px;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.avseg .av-duvidas__ajuda p {
	margin-bottom: 10px;
	font-size: 15px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.7);
}

.av-duvidas__lista {
	display: grid;
	gap: 12px;
}

.av-duv {
	border: 1px solid rgba(14, 14, 14, 0.07);
	border-radius: 22px;
	background: var(--papel);
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.02), 0 10px 26px -18px rgba(14, 14, 14, 0.2);
	transition: background-color 0.45s ease, border-color 0.45s ease, box-shadow 0.45s ease, transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-duv:hover {
	transform: translateY(-2px);
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.02), 0 18px 34px -20px rgba(14, 14, 14, 0.28);
}

.av-duv.is-aberto {
	background: var(--tinta);
	border-color: var(--tinta);
	transform: none;
	box-shadow: 0 24px 50px -28px rgba(14, 14, 14, 0.55);
}

.avseg .av-duv__pergunta {
	display: flex;
	align-items: center;
	gap: 18px;
	width: 100%;
	padding: 22px 22px 22px 26px;
	border: 0;
	background: none;
	color: var(--tinta);
	text-align: left;
	cursor: pointer;
}

.avseg .av-duv__pergunta:focus-visible {
	outline: 2px solid var(--amarelo);
	outline-offset: 3px;
	border-radius: 22px;
}

.av-duv__n {
	flex: none;
	min-width: 26px;
	font-family: var(--display);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #a3a39c;
	font-variant-numeric: tabular-nums;
	transition: color 0.35s ease;
}

.av-duv__texto {
	flex: 1;
	font-family: var(--display);
	font-size: clamp(16px, 1.35vw, 19px);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
	transition: color 0.35s ease;
}

.av-duv__icone {
	position: relative;
	flex: none;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--areia);
	transition: background-color 0.35s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-duv__icone::before,
.av-duv__icone::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 14px;
	height: 2px;
	margin: -1px 0 0 -7px;
	border-radius: 2px;
	background: var(--tinta);
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-duv__icone::after {
	transform: rotate(90deg);
}

.av-duv:hover .av-duv__icone {
	background: var(--amarelo);
}

.av-duv.is-aberto .av-duv__icone {
	background: var(--amarelo);
	transform: rotate(45deg);
}

.av-duv.is-aberto .av-duv__n {
	color: var(--amarelo);
}

.avseg .av-duv.is-aberto .av-duv__pergunta {
	color: var(--papel);
}

.av-duv__corpo {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-duv.is-aberto .av-duv__corpo {
	grid-template-rows: 1fr;
}

.av-duv__corpo > div {
	min-height: 0;
	overflow: hidden;
}

.avseg .av-duv__corpo p {
	padding: 0 84px 26px 70px;
	font-size: 16px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.72);
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity 0.35s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-duv.is-aberto .av-duv__corpo p {
	opacity: 1;
	transform: none;
	transition-delay: 0.12s;
}

@media (max-width: 960px) {
	.av-duvidas {
		display: flex;
		flex-direction: column;
		gap: 32px;
		align-items: stretch;
	}

	.av-duvidas__lado {
		display: contents;
	}

	.av-duvidas__cabeca {
		order: 1;
		text-align: center;
	}

	.avseg .av-duvidas__cabeca .av-titulo,
	.avseg .av-duvidas__cabeca .av-intro {
		margin-inline: auto;
	}

	.av-duvidas__lista {
		order: 2;
	}

	.av-duvidas__ajuda {
		order: 3;
		justify-items: center;
		text-align: center;
	}
}

@media (max-width: 720px) {
	.avseg .av-duv__pergunta {
		gap: 12px;
		padding: 18px 16px 18px 18px;
	}

	.av-duv__n {
		min-width: 22px;
		font-size: 12px;
	}

	.av-duv__icone {
		width: 34px;
		height: 34px;
	}

	.avseg .av-duv__corpo p {
		padding: 0 18px 22px 52px;
		font-size: 15px;
	}

	.av-duvidas__ajuda {
		padding: 26px 22px;
	}

	.avseg .av-duvidas__ajuda .av-btn {
		width: 100%;
		justify-content: center;
	}
}

/* ==========================================================================
   3.3: sobre no computador, coberturas em órbita, rastreamento e contato
   ========================================================================== */

/* ---------------- sobre ---------------- */

@media (min-width: 1081px) {
	#associacao > .av-wrap {
		display: grid;
		grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
		gap: clamp(40px, 4.6vw, 84px);
		align-items: start;
	}

	#associacao .av-cabeca {
		grid-column: 1;
		grid-row: 1;
		margin: 0 0 30px;
		text-align: left;
	}

	.avseg #associacao .av-cabeca .av-titulo,
	.avseg #associacao .av-cabeca .av-intro {
		margin-inline: 0;
		max-width: 22ch;
	}

	.avseg #associacao .av-cabeca .av-intro {
		max-width: 46ch;
	}

	#associacao .av-quadro {
		display: contents;
	}

	#associacao .av-pilares {
		grid-column: 1;
		grid-row: 2;
		gap: 0;
	}

	#associacao .av-video {
		grid-column: 2;
		grid-row: 1 / span 2;
		position: sticky;
		top: 104px;
		min-height: 560px;
		overflow: hidden;
		will-change: transform;
	}

	#associacao .av-video__capa img {
		transition: transform 1.4s cubic-bezier(0.16, 1, 0.3, 1);
	}

	#associacao .av-video:hover .av-video__capa img {
		transform: scale(1.07);
	}

	#associacao .av-pilar {
		position: relative;
		grid-template-columns: 40px 1fr;
		gap: 18px;
		padding: 0 0 30px;
		border: 0;
		border-radius: 0;
	}

	#associacao .av-pilar::before,
	#associacao .av-pilar::after {
		content: "";
		position: absolute;
		left: 19px;
		top: 44px;
		width: 2px;
		border-radius: 2px;
	}

	#associacao .av-pilar::before {
		bottom: 2px;
		background: rgba(14, 14, 14, 0.12);
	}

	#associacao .av-pilar::after {
		height: 0;
		background: var(--amarelo);
		transition: height 0.7s cubic-bezier(0.16, 1, 0.3, 1);
	}

	#associacao .av-pilar.is-marcado::after {
		height: calc(100% - 46px);
	}

	#associacao .av-pilar:last-of-type::before,
	#associacao .av-pilar:last-of-type::after {
		display: none;
	}

	.avseg #associacao .av-pilar__n {
		display: grid;
		place-items: center;
		width: 40px;
		height: 40px;
		border: 1px solid var(--linha-clara);
		border-radius: 50%;
		background: var(--papel);
		font-size: 12px;
		transition: background-color 0.5s ease, border-color 0.5s ease, color 0.5s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
	}

	#associacao .av-pilar.is-marcado .av-pilar__n {
		background: var(--amarelo);
		border-color: var(--amarelo);
		color: var(--tinta);
		transform: scale(1.08);
	}

	#associacao .av-pilar h3 {
		margin-top: 9px;
	}

	#associacao .av-quadro__nota {
		margin-top: 4px;
	}
}

/* ---------------- coberturas em órbita ---------------- */

.av-orbe {
	display: grid;
	justify-items: center;
	gap: 28px;
	margin-top: clamp(30px, 4vw, 52px);
}

.av-orbe__palco {
	position: relative;
	width: min(100%, 640px);
	aspect-ratio: 1;
	--raio: clamp(170px, 23vw, 262px);
}

.av-orbe__palco::before {
	content: "";
	position: absolute;
	inset: calc(50% - var(--raio));
	border: 1px dashed rgba(14, 14, 14, 0.14);
	border-radius: 50%;
}

.av-orbe__anel {
	position: absolute;
	inset: 0;
	animation: av-orbe-gira 52s linear infinite;
}

@keyframes av-orbe-gira {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

@keyframes av-orbe-volta {
	from {
		transform: rotate(calc(var(--i) * var(--passo) * -1));
	}
	to {
		transform: rotate(calc(var(--i) * var(--passo) * -1 - 360deg));
	}
}

.avseg .av-orbe__item {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 62px;
	height: 62px;
	margin: -31px 0 0 -31px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	transform: rotate(calc(var(--i) * var(--passo))) translateY(calc(var(--raio) * -1));
}

.av-orbe__item > span {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	border: 1px solid var(--linha-clara);
	border-radius: 50%;
	background: var(--papel);
	color: var(--tinta);
	box-shadow: 0 12px 26px -18px rgba(14, 14, 14, 0.5);
	animation: av-orbe-volta 52s linear infinite;
	transition: background-color 0.45s ease, border-color 0.45s ease, color 0.45s ease, box-shadow 0.45s ease;
}

.av-orbe__item svg {
	width: 26px;
	height: 26px;
	transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-orbe__item:hover > span {
	border-color: var(--amarelo);
}

.av-orbe__item.is-ativo > span {
	background: var(--amarelo);
	border-color: var(--amarelo);
	box-shadow: 0 0 0 8px rgba(247, 240, 0, 0.16), 0 14px 30px -16px rgba(14, 14, 14, 0.5);
}

.av-orbe__item.is-ativo svg {
	transform: scale(1.12);
}

.av-orbe__palco:hover .av-orbe__anel,
.av-orbe__palco:hover .av-orbe__item > span {
	animation-play-state: paused;
}

.av-orbe__centro {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: grid;
	justify-items: center;
	align-content: center;
	gap: 8px;
	width: min(62%, 310px);
	aspect-ratio: 1;
	padding: 28px;
	border: 1px solid var(--linha-clara);
	border-radius: 50%;
	background: radial-gradient(circle at 50% 24%, #ffffff, #f4f4f0);
	box-shadow: 0 34px 60px -34px rgba(14, 14, 14, 0.45);
	text-align: center;
}

.av-orbe__escudo {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin-bottom: 4px;
	border-radius: 16px;
	background: var(--tinta);
	color: var(--amarelo);
}

.av-orbe__escudo svg {
	width: 26px;
	height: 26px;
}

.av-orbe__rotulo {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #8d8d86;
}

.avseg .av-orbe__centro strong {
	max-width: 15ch;
	font-family: var(--display);
	font-size: clamp(17px, 1.7vw, 22px);
	line-height: 1.2;
	letter-spacing: -0.01em;
	transition: opacity 0.3s ease, transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-orbe__centro.is-trocando strong {
	opacity: 0;
	transform: translateY(6px);
}

.av-orbe__conta {
	font-size: 12px;
	color: #a3a39c;
	font-variant-numeric: tabular-nums;
}

.av-orbe__faixa {
	display: none;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}

.avseg .av-orbe__chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 15px;
	border: 1px solid var(--linha-clara);
	border-radius: 999px;
	background: var(--papel);
	color: var(--tinta);
	font-size: 13.5px;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.av-orbe__chip svg {
	width: 16px;
	height: 16px;
	color: var(--tinta);
}

.avseg .av-orbe__chip.is-ativo {
	background: var(--amarelo);
	border-color: var(--amarelo);
}

.avseg .av-orbe__acao {
	margin-top: 4px;
}

.av-orbe__nota {
	max-width: 56ch;
	text-align: center;
	font-size: 14.5px;
	line-height: 1.6;
	color: #7a7a73;
}

@media (max-width: 860px) {
	.av-orbe__palco {
		width: 100%;
		aspect-ratio: auto;
	}

	.av-orbe__palco::before,
	.av-orbe__anel {
		display: none;
	}

	.av-orbe__centro {
		position: static;
		transform: none;
		width: 100%;
		aspect-ratio: auto;
		padding: 30px 24px;
		border-radius: 26px;
	}

	.av-orbe__faixa {
		display: flex;
	}
}

@media (prefers-reduced-motion: reduce) {
	.av-orbe__anel,
	.av-orbe__item > span {
		animation: none;
	}
}

/* ---------------- estrutura completa ---------------- */

@media (min-width: 1081px) {
	.avseg .av-secao--chamada {
		padding-block: clamp(34px, 3.2vw, 54px);
	}
}

/* ---------------- rastreamento no computador ---------------- */

@media (min-width: 1081px) {
	#rastreamento > .av-wrap {
		display: grid;
		grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
		gap: clamp(40px, 4.6vw, 80px);
		align-items: center;
	}

	#rastreamento .av-cabeca {
		grid-column: 1;
		grid-row: 1;
		margin: 0 0 28px;
		text-align: left;
	}

	.avseg #rastreamento .av-cabeca .av-titulo,
	.avseg #rastreamento .av-cabeca .av-intro {
		margin-inline: 0;
		max-width: 20ch;
	}

	.avseg #rastreamento .av-cabeca .av-intro {
		max-width: 46ch;
	}

	#rastreamento .av-rastreio {
		display: contents;
	}

	#rastreamento .av-recursos {
		grid-column: 1;
		grid-row: 2;
	}

	#rastreamento .av-globo {
		grid-column: 2;
		grid-row: 1 / span 2;
	}
}

/* estados correndo sozinhos */
.av-globo__trilho {
	display: flex;
	gap: 8px;
	width: max-content;
}

.av-globo__lista.corre {
	overflow: hidden;
	cursor: default;
}

.av-globo__lista.corre .av-globo__trilho {
	animation: av-estados var(--av-duracao, 60s) linear infinite;
}

.av-globo__faixa:hover .av-globo__lista.corre .av-globo__trilho {
	animation-play-state: paused;
}

@keyframes av-estados {
	from {
		transform: translate3d(0, 0, 0);
	}
	to {
		transform: translate3d(calc(-50% - 4px), 0, 0);
	}
}

.av-globo__lista.corre ~ .av-globo__seta,
.av-globo__seta:has(~ .av-globo__lista.corre) {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.av-globo__lista.corre .av-globo__trilho {
		animation: none;
	}
}

/* ---------------- contato no computador ---------------- */

@media (min-width: 1081px) {
	.avseg .av-local {
		min-height: 0;
		height: 100%;
	}

	.avseg .av-canal {
		align-items: center;
	}

	.avseg .av-canal > svg {
		margin-top: 0;
	}
}

/* ==========================================================================
   3.4: faixas do topo, sobre, coberturas, dúvidas e subida geral
   ========================================================================== */

/* ---------------- faixa de aviso ---------------- */

.av-aviso {
	position: relative;
	overflow: hidden;
	background: linear-gradient(180deg, #fff65f 0%, var(--amarelo) 58%, #e6df00 100%);
	border-bottom: 1px solid rgba(14, 14, 14, 0.18);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.av-aviso::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 34%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.7), transparent);
	transform: translateX(-150%);
	animation: av-lustro 11s ease-in-out infinite;
	pointer-events: none;
}

.av-aviso__linha {
	position: relative;
	z-index: 1;
}

@keyframes av-lustro {
	0% {
		transform: translateX(-150%);
	}
	55%,
	100% {
		transform: translateX(340%);
	}
}

/* ---------------- esteira do hero ---------------- */

.av-esteira {
	position: relative;
	background: linear-gradient(180deg, #fff65f 0%, var(--amarelo) 46%, #ddd700 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 -1px 0 rgba(14, 14, 14, 0.16);
}

.av-esteira::before {
	content: "";
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(118deg, rgba(14, 14, 14, 0.045) 0 2px, transparent 2px 18px);
	pointer-events: none;
}

.av-esteira::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 36%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.62), transparent);
	transform: translateX(-150%);
	animation: av-lustro 7.5s ease-in-out infinite;
	pointer-events: none;
	z-index: 2;
}

.av-esteira__trilho {
	position: relative;
	z-index: 1;
}

.av-esteira:hover .av-esteira__trilho {
	animation-play-state: paused;
}

.av-esteira li span {
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
}

.av-esteira li::after {
	width: 17px;
	height: 17px;
	border-radius: 0;
	opacity: 0.9;
	background: var(--tinta);
	-webkit-mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 3 5.4v6.1c0 5 3.8 9.4 9 10.5 5.2-1.1 9-5.5 9-10.5V5.4L12 2Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 3 5.4v6.1c0 5 3.8 9.4 9 10.5 5.2-1.1 9-5.5 9-10.5V5.4L12 2Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (prefers-reduced-motion: reduce) {
	.av-aviso::before,
	.av-esteira::after {
		animation: none;
		opacity: 0;
	}
}

/* ---------------- hero no celular ---------------- */

@media (max-width: 720px) {
	/* o topo termina exatamente onde a barra flutuante começa, então a
	   faixa amarela encosta nela sem sobra preta no meio */
	.av-hero {
		height: calc(100svh - var(--av-topo, 122px) - var(--av-barra, 82px));
		min-height: 420px;
		padding: 10px 0 calc(8px + var(--av-esteira, 52px));
	}

	.av-hero > .av-esteira {
		bottom: 0;
	}
}

/* ---------------- sobre ---------------- */

@media (min-width: 1081px) {
	#associacao > .av-wrap {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	#associacao .av-cabeca {
		grid-column: 1 / -1;
		grid-row: 1;
		margin: 0 0 clamp(28px, 3.2vw, 48px);
		text-align: center;
	}

	.avseg #associacao .av-cabeca .av-titulo,
	.avseg #associacao .av-cabeca .av-intro {
		margin-inline: auto;
		max-width: 24ch;
	}

	.avseg #associacao .av-cabeca .av-intro {
		max-width: 64ch;
	}

	#associacao .av-video {
		grid-column: 1;
		grid-row: 2;
		align-self: start;
		min-height: 440px;
	}

	#associacao .av-pilares {
		grid-column: 2;
		grid-row: 2;
	}
}

/* ---------------- coberturas ---------------- */

@media (min-width: 1081px) {
	/* o respiro vem da margem de baixo do cabeçalho, igual às outras
	   seções; somar as duas deixava esta com folga a mais */
	.av-orbe {
		gap: 24px;
		margin-top: 0;
	}

	.av-orbe__palco {
		width: min(100%, 580px);
		--raio: clamp(170px, 17.5vw, 232px);
	}

	.avseg .av-orbe__item {
		width: 62px;
		height: 62px;
		margin: -31px 0 0 -31px;
	}

	.av-orbe__item svg {
		width: 26px;
		height: 26px;
	}

	.av-orbe__centro {
		width: min(58%, 272px);
		padding: 24px;
	}

	.av-orbe__escudo {
		width: 50px;
		height: 50px;
		border-radius: 16px;
	}

	.av-orbe__escudo svg {
		width: 25px;
		height: 25px;
	}

	.avseg .av-orbe__centro strong {
		font-size: clamp(16px, 1.4vw, 20px);
		max-width: 14ch;
	}
}

/* telas de notebook mais baixas: encolhe só a animação, o resto da seção
   segue o padrão do site */
@media (min-width: 1081px) and (max-height: 880px) {
	.av-orbe {
		gap: 16px;
		margin-top: 0;
	}

	.av-orbe__palco {
		width: min(100%, 430px);
		--raio: clamp(130px, 13vw, 172px);
	}

	.avseg .av-orbe__item {
		width: 50px;
		height: 50px;
		margin: -25px 0 0 -25px;
	}

	.av-orbe__item svg {
		width: 21px;
		height: 21px;
	}

	.av-orbe__centro {
		width: min(62%, 212px);
		padding: 16px;
		gap: 4px;
	}

	.av-orbe__escudo {
		width: 38px;
		height: 38px;
		margin-bottom: 0;
		border-radius: 12px;
	}

	.av-orbe__escudo svg {
		width: 19px;
		height: 19px;
	}

	.av-orbe__rotulo {
		font-size: 10px;
	}

	.avseg .av-orbe__centro strong {
		font-size: 14.5px;
	}
}

.av-orbe__setas {
	display: none;
}

/* o duplo toque nesses controles dava zoom no celular */
.avseg .av-btn,
.avseg .av-orbe__seta,
.avseg .av-orbe__chip,
.avseg .av-orbe__item {
	touch-action: manipulation;
}

@media (max-width: 860px) {
	.av-orbe__faixa {
		display: none;
	}

	/* altura travada: o cartão não cresce nem encolhe conforme o nome da
	   cobertura, então nada pula na troca */
	.av-orbe__centro {
		position: relative;
		left: auto;
		top: auto;
		transform: none;
		min-height: 268px;
		padding: 28px 62px;
		align-content: center;
	}

	.avseg .av-orbe__centro strong {
		display: grid;
		align-content: center;
		min-height: 3.6em;
		max-width: 16ch;
		font-size: 19px;
	}

	.av-orbe__setas {
		position: absolute;
		left: 12px;
		right: 12px;
		top: 50%;
		display: flex;
		justify-content: space-between;
		transform: translateY(-50%);
		pointer-events: none;
	}

	.avseg .av-orbe__seta {
		display: grid;
		place-items: center;
		width: 42px;
		height: 42px;
		padding: 0;
		border: 1px solid var(--linha-clara);
		border-radius: 50%;
		background: var(--papel);
		color: var(--tinta);
		box-shadow: 0 8px 20px -14px rgba(14, 14, 14, 0.5);
		cursor: pointer;
		pointer-events: auto;
		transition: background-color 0.3s ease, border-color 0.3s ease;
	}

	.avseg .av-orbe__seta:active {
		background: var(--amarelo);
		border-color: var(--amarelo);
	}

	.av-orbe__seta svg {
		width: 16px;
		height: 16px;
		transform: rotate(-90deg);
	}

	.av-orbe__seta[data-av-orbe-passo="1"] svg {
		transform: rotate(90deg);
	}
}

/* ---------------- rastreamento ---------------- */

@media (min-width: 1081px) {
	#rastreamento > .av-wrap {
		align-items: start;
		row-gap: 14px;
	}

	#rastreamento .av-cabeca {
		margin-bottom: 4px;
	}

	#rastreamento .av-globo {
		align-self: start;
	}
}

/* ---------------- depoimentos no celular ---------------- */

@media (max-width: 720px) {
	.av-vozes__linha--volta {
		display: none;
	}
}

/* ---------------- dúvidas com as cores trocadas ---------------- */

.av-duv {
	background: var(--tinta);
	border-color: rgba(255, 255, 255, 0.08);
	box-shadow: 0 18px 36px -28px rgba(14, 14, 14, 0.6);
}

.av-duv:hover {
	box-shadow: 0 22px 42px -26px rgba(14, 14, 14, 0.7);
}

.avseg .av-duv__pergunta {
	color: var(--papel);
}

.av-duv__n {
	color: #8b8b84;
}

.av-duv__icone {
	background: rgba(255, 255, 255, 0.09);
}

.av-duv__icone::before,
.av-duv__icone::after {
	background: var(--papel);
}

.av-duv:hover .av-duv__icone {
	background: var(--amarelo);
}

.av-duv:hover .av-duv__icone::before,
.av-duv:hover .av-duv__icone::after {
	background: var(--tinta);
}

.av-duv.is-aberto {
	background: var(--papel);
	border-color: rgba(14, 14, 14, 0.08);
	box-shadow: 0 26px 52px -30px rgba(14, 14, 14, 0.4);
}

.avseg .av-duv.is-aberto .av-duv__pergunta {
	color: var(--tinta);
}

.av-duv.is-aberto .av-duv__n {
	color: #a3a39c;
}

.av-duv.is-aberto .av-duv__icone,
.av-duv.is-aberto:hover .av-duv__icone {
	background: var(--amarelo);
}

.av-duv.is-aberto .av-duv__icone::before,
.av-duv.is-aberto .av-duv__icone::after {
	background: var(--tinta);
}

.avseg .av-duv__corpo p {
	color: rgba(14, 14, 14, 0.72);
}

/* fundos alternados: coberturas em branco, depoimentos em areia,
   dúvidas em branco e contato no escuro */

.avseg .av-secao--vozes {
	background: var(--areia);
}

.avseg .av-secao--duvidas {
	background: var(--papel);
}

.avseg .av-duv__icone {
	background: rgba(255, 255, 255, 0.09);
}

.avseg .av-duv.is-aberto .av-duv__icone {
	background: var(--amarelo);
}

/* o topo não pode passar da largura da tela: a coluna pode encolher e os
   dois botões lado a lado dividem o espaço em vez de esticar a coluna */

.av-hero__linha > *,
.av-hero__texto-col {
	min-width: 0;
}

@media (max-width: 720px) {
	.avseg .av-hero .av-hero__botoes {
		min-width: 0;
	}

	.avseg .av-hero .av-hero__botoes .av-btn {
		flex: 1 1 0;
		min-width: 0;
		padding-inline: clamp(10px, 3.2vw, 22px);
		font-size: clamp(12.5px, 3.5vw, 15px);
	}
}

/* ==========================================================================
   página da área do associado
   ========================================================================== */

.av-abertura {
	position: relative;
	background: var(--tinta);
	color: var(--papel);
	overflow: hidden;
	padding: clamp(56px, 9vw, 120px) 0 clamp(48px, 7vw, 96px);
	text-align: center;
}

.av-abertura .av-wrap {
	position: relative;
	z-index: 1;
	display: grid;
	justify-items: center;
	gap: 18px;
}

.avseg .av-abertura h1 {
	max-width: 20ch;
	font-size: clamp(34px, 5.6vw, 66px);
	text-transform: uppercase;
	letter-spacing: -0.015em;
	color: var(--papel);
}

.avseg .av-abertura p {
	max-width: 60ch;
	font-size: clamp(15px, 1.4vw, 17.5px);
	line-height: 1.7;
	color: var(--fumaca);
}

.av-acessos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: clamp(18px, 2.2vw, 26px);
}

.av-acesso {
	position: relative;
	display: grid;
	justify-items: start;
	gap: 14px;
	padding: clamp(28px, 3vw, 40px);
	border: 1px solid rgba(14, 14, 14, 0.08);
	border-radius: 26px;
	background: var(--papel);
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.03), 0 16px 38px -22px rgba(14, 14, 14, 0.28);
	overflow: hidden;
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-acesso:hover {
	transform: translateY(-6px);
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.03), 0 30px 54px -26px rgba(14, 14, 14, 0.36);
}

.av-acesso__n {
	position: absolute;
	top: clamp(20px, 2.4vw, 30px);
	right: clamp(20px, 2.4vw, 30px);
	font-family: var(--display);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #b4b4ad;
	font-variant-numeric: tabular-nums;
}

.av-acesso__icone {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 16px;
	background: var(--amarelo);
	color: var(--tinta);
}

.av-acesso__icone svg {
	width: 26px;
	height: 26px;
}

.avseg .av-acesso h2 {
	max-width: 20ch;
	font-size: clamp(19px, 1.7vw, 24px);
	line-height: 1.25;
}

.avseg .av-acesso p {
	max-width: 40ch;
	font-size: 15px;
	line-height: 1.6;
	color: #6f6f68;
}

.av-acesso .av-btn {
	margin-top: 6px;
}

.av-regra {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin-top: clamp(22px, 2.6vw, 34px);
	padding: clamp(22px, 2.6vw, 30px);
	border: 1px solid rgba(14, 14, 14, 0.08);
	border-radius: 22px;
	background: var(--areia);
}

.av-regra__icone {
	display: grid;
	place-items: center;
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 14px;
	background: var(--tinta);
	color: var(--amarelo);
}

.av-regra__icone svg {
	width: 22px;
	height: 22px;
}

.avseg .av-regra h3 {
	font-size: 16px;
	line-height: 1.3;
}

.avseg .av-regra p {
	margin-top: 6px;
	font-size: 14.5px;
	line-height: 1.65;
	color: #6f6f68;
}

@media (max-width: 720px) {
	.av-abertura {
		padding: clamp(36px, 10vw, 60px) 0 clamp(32px, 8vw, 52px);
	}

	.av-regra {
		flex-direction: column;
		gap: 14px;
	}
}

/* o atalho da área do associado só aparece dentro do menu do celular:
   no computador ele já está na faixa amarela */

.av-nav__area {
	display: none;
}

@media (max-width: 1080px) {
	.avseg .av-nav__area {
		display: block;
		color: var(--amarelo);
	}
}

/* ---------------- blocos da área do associado com imagem de fundo ------- */

.av-acesso.tem-fundo,
.av-regra.tem-fundo {
	position: relative;
	border-color: rgba(255, 255, 255, 0.1);
	background: var(--tinta);
	color: var(--papel);
	isolation: isolate;
}

.av-acesso.tem-fundo::before,
.av-regra.tem-fundo::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background: var(--av-fundo) center / cover no-repeat;
}

/* véu escuro por cima da foto, para o texto continuar legível */
.av-acesso.tem-fundo::after,
.av-regra.tem-fundo::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(14, 14, 14, 0.82), rgba(14, 14, 14, 0.92));
}

.avseg .av-acesso.tem-fundo h2,
.avseg .av-regra.tem-fundo h3 {
	color: var(--papel);
}

.avseg .av-acesso.tem-fundo p,
.avseg .av-regra.tem-fundo p {
	color: rgba(255, 255, 255, 0.78);
}

.av-acesso.tem-fundo .av-acesso__n {
	color: rgba(255, 255, 255, 0.55);
}

.av-acesso.tem-fundo:hover {
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.2), 0 30px 54px -26px rgba(14, 14, 14, 0.6);
}

/* ---------------- área do associado centralizada no celular ------------- */

@media (max-width: 860px) {
	.avseg .av-acesso {
		justify-items: center;
		text-align: center;
	}

	.avseg .av-acesso h2,
	.avseg .av-acesso p {
		max-width: none;
	}

	.av-acesso__n {
		position: static;
		order: -1;
	}

	.avseg .av-acesso .av-btn {
		width: 100%;
		justify-content: center;
	}

	.av-regra {
		align-items: center;
		text-align: center;
	}

	.avseg .av-regra h3,
	.avseg .av-regra p {
		text-align: center;
	}
}

/* fundo próprio nas seções da área do associado */

.av-abertura.tem-fundo,
.av-secao--escura.tem-fundo {
	position: relative;
	isolation: isolate;
}

.av-abertura.tem-fundo::before,
.av-secao--escura.tem-fundo::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background: var(--av-fundo) center / cover no-repeat;
}

.av-abertura.tem-fundo::after,
.av-secao--escura.tem-fundo::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(14, 14, 14, 0.86), rgba(14, 14, 14, 0.94));
}

/* ==========================================================================
   3.7: ajustes no computador
   ========================================================================== */

@media (min-width: 1081px) {
	/* quem somos: o bloco de texto fica no meio da tela, não só o texto */
	.avseg #associacao .av-cabeca {
		width: 100%;
		max-width: 760px;
		margin-inline: auto;
		justify-items: center;
	}

	.avseg #associacao .av-cabeca .av-titulo {
		max-width: 20ch;
	}

	.avseg #associacao .av-cabeca .av-intro {
		max-width: 58ch;
	}

	#associacao .av-video {
		transform: none !important;
	}

	/* títulos das seções um pouco menores, o do topo fica como está */
	.avseg .av-titulo {
		font-size: clamp(30px, 3.6vw, 46px);
	}

	.avseg .av-chamada h2,
	.avseg .av-abertura h1 {
		font-size: clamp(28px, 3.2vw, 42px);
	}

	.avseg .av-duvidas__cabeca .av-titulo {
		font-size: clamp(28px, 3.1vw, 40px);
	}

	/* dúvidas: as duas colunas terminam na mesma altura */
	.av-duvidas {
		align-items: stretch;
	}

	.av-duvidas__lado {
		position: sticky;
		align-self: start;
		display: flex;
		flex-direction: column;
		gap: 28px;
	}

	.av-duvidas__ajuda {
		margin-top: auto;
	}

	.av-duvidas__lista {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		gap: 12px;
	}

	/* botões flutuantes mais acima, para não cobrir o fim do rodapé */
	.av-flutuante {
		right: 26px;
		bottom: 34px;
		transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
	}

	.av-rodape__fim {
		padding-bottom: 34px;
	}
}

/* botão do WhatsApp com a cara da marca */
.avseg .av-zap {
	gap: 12px;
	padding: 13px 20px 13px 13px;
	background: var(--tinta);
	color: var(--papel);
	border: 1px solid rgba(247, 240, 0, 0.35);
	box-shadow: 0 16px 34px -14px rgba(14, 14, 14, 0.55);
}

.av-zap__marca {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--amarelo);
	color: var(--tinta);
}

.av-zap__marca svg {
	width: 19px;
	height: 19px;
}

.avseg .av-zap:hover {
	background: var(--amarelo);
	color: var(--tinta);
	border-color: var(--amarelo);
}

.avseg .av-zap:hover .av-zap__marca {
	background: var(--tinta);
	color: var(--amarelo);
}

.av-zap__texto {
	display: grid;
	gap: 1px;
	line-height: 1.15;
	text-align: left;
}

.av-zap__texto small {
	font-family: var(--texto);
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fumaca);
}

.avseg .av-zap:hover .av-zap__texto small {
	color: rgba(14, 14, 14, 0.66);
}

/* ================================================================
   Barra de atalhos no computador

   A mesma pílula do celular, agora também acima de 900px: centralizada,
   com largura máxima, sempre visível. Como o WhatsApp já está nela, a
   bolha "Fale conosco" sai, igual ao celular.
   ================================================================ */

@media (min-width: 901px) {
	.av-barra {
		position: fixed;
		left: 50%;
		bottom: 22px;
		z-index: 85;
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		width: min(520px, calc(100vw - 48px));
		transform: translateX(-50%);
		padding: 6px;
		gap: 4px;
		border: 1px solid rgba(255, 255, 255, 0.16);
		border-radius: 999px;
		background: transparent;
		box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.07);
	}

	/* o vidro fica numa camada própria, atrás da pílula amarela */
	.av-barra::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		border-radius: inherit;
		background: rgba(18, 18, 18, 0.72);
		backdrop-filter: saturate(180%) blur(22px);
		-webkit-backdrop-filter: saturate(180%) blur(22px);
	}

	.av-barra a {
		position: relative;
		z-index: 2;
		display: grid;
		justify-items: center;
		align-content: center;
		gap: 6px;
		min-height: 58px;
		padding: 9px 10px;
		border-radius: 999px;
		color: var(--papel);
		font-size: 11.5px;
		line-height: 1.2;
		letter-spacing: 0.015em;
		text-align: center;
		transition: color 0.25s ease;
	}

	.av-barra a + a::before {
		display: none;
	}

	.av-barra svg {
		width: 21px;
		height: 21px;
		color: var(--amarelo);
	}

	/* nada nasce selecionado: a pílula desliza até o item sob o cursor */
	.av-barra__gota {
		position: absolute;
		z-index: 1;
		left: 0;
		top: 6px;
		bottom: 6px;
		width: 0;
		border-radius: 999px;
		background: var(--amarelo);
		opacity: 0;
		pointer-events: none;
		transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
			width 0.42s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease;
	}

	.av-barra.is-ativa .av-barra__gota {
		opacity: 1;
	}

	.av-barra a.is-alvo,
	.av-barra a.is-alvo svg {
		color: var(--tinta);
	}

	.av-barra a.is-alvo {
		font-weight: 700;
	}

	/* o atalho do WhatsApp já está na barra */
	.avseg .av-zap {
		display: none;
	}

	/* o botão de voltar ao topo sobe para não brigar com a barra */
	.av-flutuante {
		bottom: 30px;
	}

	/* espaço para a barra não cobrir o fim do rodapé */
	.av-rodape__fim {
		padding-bottom: 104px;
	}
}

@media (min-width: 901px) and (prefers-reduced-motion: reduce) {
	.av-barra__gota {
		transition: opacity 0.25s ease;
	}
}

/* ================================================================
   Diferenciais em bento

   Grade de 4 colunas com tamanhos diferentes. A posição define o
   tamanho do card; o ícone escolhido no painel define a cena. Cada
   cena já nasce no quadro final, então sem animação ela fica completa.
   ================================================================ */

.av-cards.av-bento {
	grid-template-columns: repeat(10, minmax(0, 1fr));
	grid-auto-rows: auto;
	grid-auto-flow: dense;
	gap: 16px;
}

.av-bento__item {
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding: 18px 18px 26px;
}

.av-bento__item:not(.tem-cena) {
	padding: 30px 28px 34px;
}

.av-bento__acao {
	display: flex;
	justify-content: center;
	margin-top: clamp(28px, 3.4vw, 44px);
}

.av-bento__texto {
	position: relative;
	padding-inline: 8px;
}

/* localização com 40% da largura; ao lado, largos com 60% e pequenos com 30% */
.av-bento__item {
	grid-column: span 3;
}

.av-bento__item:nth-child(1) {
	grid-column: span 4;
	grid-row: span 2;
}

.av-bento__item:nth-child(2) {
	grid-column: span 6;
}

.av-bento__item:nth-child(5),
.av-bento__item:nth-child(6) {
	grid-column: span 5;
}

/* cards largos: texto à esquerda, cena à direita */
.av-bento__item:nth-child(2).tem-cena,
.av-bento__item:nth-child(5).tem-cena,
.av-bento__item:nth-child(6).tem-cena {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
	align-items: stretch;
	gap: 20px;
	padding: 18px;
}

.av-bento__item:nth-child(2).tem-cena .av-bento__texto,
.av-bento__item:nth-child(5).tem-cena .av-bento__texto,
.av-bento__item:nth-child(6).tem-cena .av-bento__texto {
	order: -1;
	align-self: center;
	padding: 12px 4px 12px 10px;
}

/* ---------- palco comum das cenas ---------- */

.av-cena {
	position: relative;
	flex: 1 1 auto;
	min-height: 132px;
	border-radius: 12px;
	overflow: hidden;
	container-type: inline-size;
	color: var(--papel);
	background-color: var(--tinta);
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
	background-size: 22px 22px;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
	transition: box-shadow 0.35s ease;
}

.av-bento__item:nth-child(1) .av-cena {
	min-height: 240px;
}

.av-bento__item:hover .av-cena {
	box-shadow: inset 0 0 0 1px var(--amarelo-borda), 0 0 0 4px var(--amarelo-fundo);
}

.av-cena__selo {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.12);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
	color: var(--papel);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.av-cena__selo i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--amarelo);
	box-shadow: 0 0 0 0 rgba(247, 240, 0, 0.6);
	animation: av-cena-pulso 1.8s ease-out infinite;
}

.av-cena__selo svg {
	width: 13px;
	height: 13px;
	color: var(--amarelo);
}

@keyframes av-cena-pulso {
	0% { box-shadow: 0 0 0 0 rgba(247, 240, 0, 0.55); }
	100% { box-shadow: 0 0 0 9px rgba(247, 240, 0, 0); }
}

/* ---------- localização: trajeto no mapa ---------- */

.av-cena__mapa {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.av-cena__ruas path {
	stroke: rgba(255, 255, 255, 0.14);
	stroke-width: 7;
}

.av-cena__ruas .av-cena__ruas--finas {
	stroke: rgba(255, 255, 255, 0.07);
	stroke-width: 3;
}

.av-cena__quadras rect {
	fill: rgba(255, 255, 255, 0.035);
	stroke: rgba(255, 255, 255, 0.06);
}

.av-cena__rota {
	stroke: rgba(247, 240, 0, 0.22);
	stroke-width: 3;
	stroke-dasharray: 2 9;
	stroke-linecap: round;
}

.av-cena__rastro {
	stroke: var(--amarelo);
	stroke-width: 4;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 520;
	stroke-dashoffset: 0;
	filter: drop-shadow(0 0 6px rgba(247, 240, 0, 0.55));
	animation: av-rastro 9s linear infinite;
}

.av-cena__pino {
	fill: var(--papel);
}

.av-cena__onda {
	fill: none;
	stroke: var(--papel);
	stroke-width: 1.5;
	transform-origin: center;
	transform-box: fill-box;
	animation: av-cena-onda 1.8s ease-out infinite;
}

.av-cena__veiculo {
	transform: translate(340px, 170px);
	animation: av-veiculo 9s linear infinite;
}

.av-cena__ponto {
	fill: var(--amarelo);
	stroke: var(--tinta);
	stroke-width: 3;
}

.av-cena__halo {
	fill: rgba(247, 240, 0, 0.18);
	transform-origin: center;
	transform-box: fill-box;
	transition: transform 0.4s ease;
}

.av-bento__item:hover .av-cena__halo {
	transform: scale(1.5);
}

/* trajeto de 520 unidades percorrido em 84% do ciclo; o resto é pausa */
@keyframes av-veiculo {
	0% { transform: translate(70px, 240px); }
	11.3% { transform: translate(70px, 170px); }
	29.1% { transform: translate(180px, 170px); }
	43.6% { transform: translate(180px, 80px); }
	61.4% { transform: translate(290px, 80px); }
	75.9% { transform: translate(290px, 170px); }
	84%, 100% { transform: translate(340px, 170px); }
}

@keyframes av-rastro {
	0% { stroke-dashoffset: 520; opacity: 1; }
	84% { stroke-dashoffset: 0; opacity: 1; }
	94% { stroke-dashoffset: 0; opacity: 1; }
	100% { stroke-dashoffset: 0; opacity: 0; }
}

@keyframes av-cena-onda {
	0% { transform: scale(0.6); opacity: 0.9; }
	100% { transform: scale(2.4); opacity: 0; }
}

/* ---------- central 24h: relógio ---------- */

.av-cena--relogio {
	display: grid;
	align-content: center;
	justify-items: center;
	gap: 12px;
	padding: 44px 18px 18px;
}

.av-cena__hora {
	font-family: var(--display);
	font-size: clamp(34px, 19cqi, 64px);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	color: var(--papel);
}

.av-cena__hora small {
	margin-left: 2px;
	font-size: 0.42em;
	font-weight: 600;
	color: var(--amarelo);
	vertical-align: 0.9em;
}

.av-cena__dia {
	display: grid;
	grid-template-columns: repeat(24, minmax(0, 1fr));
	gap: 3px;
	width: min(100%, 300px);
}

.av-cena__dia span {
	height: 14px;
	border-radius: 3px;
	background: rgba(255, 255, 255, 0.1);
}

.av-cena__dia span.is-passada {
	background: rgba(247, 240, 0, 0.32);
}

.av-cena__dia span.is-agora {
	background: var(--amarelo);
	box-shadow: 0 0 10px rgba(247, 240, 0, 0.7);
	animation: av-agora 1.6s ease-in-out infinite;
}

@keyframes av-agora {
	50% { opacity: 0.45; }
}

.av-cena__legenda {
	display: flex;
	justify-content: space-between;
	width: min(100%, 300px);
	font-size: 10px;
	color: var(--fumaca);
	letter-spacing: 0.06em;
}

/* ---------- tecnologia: canais de sinal ---------- */

.av-cena--monitor {
	display: grid;
	align-content: center;
	gap: 10px;
	padding: 18px clamp(16px, 9cqi, 34px);
}

.av-cena__canal {
	display: grid;
	grid-template-columns: 50px 1fr;
	align-items: center;
	gap: 12px;
	padding: 8px 12px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.07);
}

.av-cena__canal b {
	font-size: 11.5px;
	letter-spacing: 0.08em;
	color: var(--papel);
}

.av-cena__sinal {
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	gap: 4px;
	height: 18px;
}

.av-cena__sinal i {
	width: 6px;
	border-radius: 2px;
	background: var(--amarelo);
	animation: av-sinal 2.8s ease-in-out infinite;
	animation-delay: calc(var(--n) * 0.35s + var(--b, 0) * 0.12s);
}

.av-cena__sinal i:nth-child(1) { height: 30%; --b: 0; }
.av-cena__sinal i:nth-child(2) { height: 55%; --b: 1; }
.av-cena__sinal i:nth-child(3) { height: 78%; --b: 2; }
.av-cena__sinal i:nth-child(4) { height: 100%; --b: 3; }

@keyframes av-sinal {
	0%, 12% { background: rgba(255, 255, 255, 0.14); box-shadow: none; }
	30%, 80% { background: var(--amarelo); box-shadow: 0 0 8px rgba(247, 240, 0, 0.5); }
	100% { background: rgba(255, 255, 255, 0.14); box-shadow: none; }
}

/* ---------- equipe: rostos empilhados ---------- */

.av-cena--equipe {
	display: grid;
	place-items: center;
}

.av-cena__rostos {
	display: flex;
	align-items: center;
}

.av-cena__rostos span {
	--tam: clamp(38px, 17cqi, 58px);
	display: grid;
	place-items: center;
	width: var(--tam);
	height: var(--tam);
	margin-left: calc(var(--tam) * -0.28);
	border-radius: 50%;
	border: 3px solid var(--tinta);
	background: hsl(0 0% calc(22% + var(--n) * 7%));
	color: var(--papel);
	animation: av-rosto 3.6s ease-in-out infinite;
	animation-delay: calc(var(--n) * 0.25s);
	transition: margin 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-cena__rostos span:first-child {
	margin-left: 0;
}

.av-cena__rostos span svg {
	width: 46%;
	height: 46%;
}

.av-cena__rostos .av-cena__mais {
	background: var(--amarelo);
	color: var(--tinta);
}

.av-bento__item:hover .av-cena__rostos span:not(:first-child) {
	margin-left: 8px;
}

@keyframes av-rosto {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-5px); }
}

/* ---------- aplicativo: celular com avisos ---------- */

.av-cena__aparelho {
	position: absolute;
	top: 16px;
	left: 50%;
	width: clamp(150px, 58cqi, 220px);
	height: 160%;
	transform: translateX(-50%);
	padding: 30px 10px 0;
	border-radius: 28px;
	background: #1b1b1b;
	border: 1px solid rgba(255, 255, 255, 0.16);
	box-shadow: 0 -10px 40px rgba(247, 240, 0, 0.08);
	transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-bento__item:hover .av-cena__aparelho {
	transform: translateX(-50%) translateY(-6px);
}

.av-cena__ilha {
	position: absolute;
	top: 10px;
	left: 50%;
	width: 54px;
	height: 12px;
	border-radius: 999px;
	background: #000;
	transform: translateX(-50%);
}

.av-cena__avisos {
	display: grid;
	gap: 7px;
}

.av-cena__aviso {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 7px 8px;
	border-radius: 11px;
	background: rgba(255, 255, 255, 0.09);
	border: 1px solid rgba(255, 255, 255, 0.08);
	animation: av-aviso 7s cubic-bezier(0.16, 1, 0.3, 1) infinite;
	animation-delay: calc(var(--n) * 0.8s);
}

.av-cena__aviso span {
	flex: none;
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border-radius: 7px;
	background: var(--amarelo);
	color: var(--tinta);
}

.av-cena__aviso svg {
	width: 13px;
	height: 13px;
}

.av-cena__aviso b {
	overflow: hidden;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: var(--papel);
}

@keyframes av-aviso {
	0% { opacity: 0; transform: translateY(14px) scale(0.96); }
	8%, 78% { opacity: 1; transform: none; }
	90%, 100% { opacity: 0; transform: translateY(-6px); }
}

/* ---------- rastreamento: radar ---------- */

.av-cena__radar {
	position: absolute;
	top: 50%;
	left: 50%;
	width: clamp(150px, 64cqi, 250px);
	aspect-ratio: 1;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	background:
		radial-gradient(circle, transparent 0 22%, rgba(255, 255, 255, 0.1) 22.4% 22.8%, transparent 23% 45%, rgba(255, 255, 255, 0.1) 45.4% 45.8%, transparent 46% 68%, rgba(255, 255, 255, 0.1) 68.4% 68.8%, transparent 69%),
		linear-gradient(transparent calc(50% - 0.5px), rgba(255, 255, 255, 0.08) 0 calc(50% + 0.5px), transparent 0),
		linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(255, 255, 255, 0.08) 0 calc(50% + 0.5px), transparent 0);
	border: 1px solid rgba(255, 255, 255, 0.14);
	overflow: hidden;
}

.av-cena__varredura {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: conic-gradient(from 0deg, rgba(247, 240, 0, 0.5), rgba(247, 240, 0, 0.12) 50deg, transparent 90deg);
	animation: av-varre 4s linear infinite;
}

.av-cena__eco,
.av-cena__alvo {
	position: absolute;
	left: var(--x);
	top: var(--y);
	transform: translate(-50%, -50%);
}

.av-cena__eco {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--amarelo);
	opacity: 0.7;
	animation: av-eco 4s ease-out infinite;
	animation-delay: calc(0.6s + var(--n) * 1.7s);
}

.av-cena__alvo {
	width: 26px;
	height: 26px;
	border: 2px solid var(--amarelo);
	border-radius: 6px;
	box-shadow: 0 0 12px rgba(247, 240, 0, 0.5);
	animation: av-trava 4s cubic-bezier(0.16, 1, 0.3, 1) infinite;
}

.av-cena__alvo::after {
	content: "";
	position: absolute;
	inset: 8px;
	border-radius: 50%;
	background: var(--amarelo);
}

.av-cena__selo--trava {
	top: auto;
	bottom: 12px;
	left: auto;
	right: 12px;
}

@keyframes av-varre {
	to { transform: rotate(360deg); }
}

@keyframes av-eco {
	0% { opacity: 1; transform: translate(-50%, -50%) scale(1.3); }
	60%, 100% { opacity: 0.12; transform: translate(-50%, -50%) scale(1); }
}

@keyframes av-trava {
	0%, 20% { opacity: 0; transform: translate(-50%, -50%) scale(2.2); }
	40%, 88% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
	100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
}

/* ---------- desempenho e acessibilidade ---------- */

/* fora da tela, tudo parado; o script liga is-viva quando a seção aparece */
.av-bento:not(.is-viva) .av-cena,
.av-bento:not(.is-viva) .av-cena * {
	animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
	.av-cena,
	.av-cena * {
		animation: none !important;
	}
}

/* ---------- tablet ---------- */

@media (max-width: 1080px) {
	.av-cards.av-bento {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-auto-rows: auto;
	}

	.av-bento__item,
	.av-bento__item:nth-child(2),
	.av-bento__item:nth-child(5),
	.av-bento__item:nth-child(6) {
		grid-column: auto;
	}

	.av-bento__item:nth-child(1) {
		grid-column: span 2;
		grid-row: auto;
	}

	.av-bento__item:nth-child(2).tem-cena,
	.av-bento__item:nth-child(5).tem-cena,
	.av-bento__item:nth-child(6).tem-cena {
		display: flex;
		gap: 22px;
		padding: 18px 18px 26px;
	}

	.av-bento__item:nth-child(2).tem-cena .av-bento__texto,
	.av-bento__item:nth-child(5).tem-cena .av-bento__texto,
	.av-bento__item:nth-child(6).tem-cena .av-bento__texto {
		order: 0;
		padding: 0 8px;
	}

	.av-bento__item:nth-child(1) .av-cena {
		min-height: 240px;
	}

	.av-cena {
		min-height: 180px;
	}
}

/* ---------- celular ---------- */

@media (max-width: 900px) {
	.av-cards.av-bento {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
	}

	.av-bento__item:nth-child(1) {
		grid-column: auto;
	}

	.av-bento__item,
	.av-bento__item:nth-child(2).tem-cena,
	.av-bento__item:nth-child(5).tem-cena,
	.av-bento__item:nth-child(6).tem-cena {
		gap: 18px;
		padding: 14px 14px 24px;
	}

	.av-cena--satelite {
		min-height: 210px;
	}

	.av-cena__radar {
		width: 188px;
	}

	.av-bento__item:nth-child(1) .av-cena {
		min-height: 230px;
	}

	.av-cena {
		flex: none;
		min-height: 170px;
	}

	.av-cena__canal {
		text-align: left;
	}
}

/* ================================================================
   Rastreamento no computador: globo na altura dos dados

   O bloco do globo vira um contêiner de tamanho, então ele não empurra
   a altura da linha e só ocupa o que a coluna da esquerda definir. O
   globo se ajusta a esse espaço, descontando a faixa dos estados.
   ================================================================ */

@media (min-width: 1081px) {
	#rastreamento .av-globo {
		container-type: size;
		align-self: stretch;
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 420px;
	}

	#rastreamento .av-globo__palco {
		width: min(100cqw, 100cqh - 64px, 560px);
		max-width: none;
	}

	#rastreamento .av-globo__faixa {
		width: min(100cqw, 560px);
		margin-top: 14px;
	}
}

/* ================================================================
   Área do associado: cartões de acesso

   A imagem do painel ganha a faixa de cima, nas cores originais, sem
   véu. Embaixo, sobre fundo escuro: sistema, banco, etiqueta, texto e
   botão, sempre alinhado no pé do cartão.
   ================================================================ */

.av-acessos__dica {
	margin: 0 auto clamp(18px, 2.2vw, 26px);
	text-align: center;
	font-size: 15px;
	color: #6f6f68;
}

.av-acesso {
	display: flex;
	flex-direction: column;
	gap: 0;
	padding: 14px;
	border-color: rgba(255, 255, 255, 0.06);
	background: var(--tinta);
	color: var(--papel);
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.2), 0 22px 44px -26px rgba(14, 14, 14, 0.55);
}

.av-acesso:hover {
	box-shadow: 0 1px 1px rgba(14, 14, 14, 0.2), 0 34px 60px -28px rgba(14, 14, 14, 0.7);
}

.av-acesso__foto {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 16px;
	overflow: hidden;
	background: var(--tinta-3);
}

.av-acesso__foto img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-acesso:hover .av-acesso__foto img {
	transform: scale(1.05);
}

.av-acesso__corpo {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: flex-start;
	padding: clamp(20px, 2.2vw, 28px) clamp(12px, 1.6vw, 18px) clamp(10px, 1.2vw, 14px);
}

.av-acesso__sistema {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--fumaca);
}

.avseg .av-acesso h2 {
	max-width: none;
	margin-top: 6px;
	font-size: clamp(26px, 2.4vw, 34px);
	line-height: 1.1;
	color: var(--papel);
}

.av-acesso__etiqueta {
	margin-top: 14px;
	padding: 5px 12px;
	border-radius: 999px;
	border: 1px solid var(--amarelo-borda);
	background: var(--amarelo-fundo);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--amarelo);
}

.avseg .av-acesso p {
	max-width: 44ch;
	margin-top: 14px;
	color: rgba(255, 255, 255, 0.72);
}

/* o botão desce para o pé do cartão, então todos ficam na mesma linha */
.av-acesso .av-btn {
	margin-top: auto;
	gap: 10px;
}

.av-acesso__corpo > :nth-last-child(2) {
	margin-bottom: 24px;
}

.av-acesso__seta {
	width: 16px;
	height: 16px;
	transform: rotate(90deg);
	transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-acesso:hover .av-acesso__seta {
	transform: rotate(90deg) translateY(-3px);
}

@media (max-width: 860px) {
	.avseg .av-acesso {
		text-align: center;
	}

	.av-acesso__corpo {
		align-items: center;
	}
}

/* ================================================================
   Faixa amarela editável: no celular fica só o primeiro item
   ================================================================ */

@media (max-width: 900px) {
	.av-aviso__linha .av-aviso__item {
		display: inline-flex;
	}

	.av-aviso__linha .av-aviso__item:not(:first-child) {
		display: none;
	}
}

/* sem o botão do cabeçalho, o menu encosta na direita no computador */
@media (min-width: 1081px) {
	.av-header__acoes:not(:has(.av-btn)) {
		display: none;
	}
}

/* ================================================================
   Barra flutuante no computador: só depois de rolar
   ================================================================ */

@media (min-width: 901px) {
	.av-barra {
		opacity: 0;
		visibility: hidden;
		transform: translate(-50%, 24px);
		transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0.5s;
	}

	.av-barra.is-visivel {
		opacity: 1;
		visibility: visible;
		transform: translate(-50%, 0);
		transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s;
	}
}

/* a pílula amarela: no primeiro encaixe e no toque ela não desliza */
.av-barra__gota.is-sem-transicao {
	transition: opacity 0.2s ease !important;
}

/* ================================================================
   Área do associado toda escura, com cartões menores no computador
   ================================================================ */

.avseg .av-secao--acessos {
	padding-top: clamp(8px, 2vw, 28px);
}

.avseg .av-secao--acessos + #ajuda {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.av-secao--acessos .av-acessos__dica {
	color: rgba(255, 255, 255, 0.62);
}

.av-secao--acessos .av-acesso {
	border: 1px solid rgba(255, 255, 255, 0.09);
	background: var(--tinta-2);
	box-shadow: 0 24px 50px -30px rgba(0, 0, 0, 0.9);
}

.av-secao--acessos .av-acesso:hover {
	border-color: var(--amarelo-borda);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.95), 0 0 0 4px var(--amarelo-fundo);
}

.av-secao--acessos .av-regra {
	border: 1px solid var(--amarelo-borda);
	background: rgba(247, 240, 0, 0.05);
}

.av-secao--acessos .av-regra__icone {
	background: var(--amarelo);
	color: var(--tinta);
}

.avseg .av-secao--acessos .av-regra h3 {
	color: var(--papel);
}

.avseg .av-secao--acessos .av-regra p {
	color: rgba(255, 255, 255, 0.68);
}

@media (min-width: 861px) {
	.av-secao--acessos .av-acessos,
	.av-secao--acessos .av-acessos__dica,
	.av-secao--acessos .av-regra {
		max-width: 880px;
		margin-inline: auto;
	}

	.av-secao--acessos .av-acessos {
		grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		gap: 20px;
	}

	.av-secao--acessos .av-acesso {
		padding: 10px;
		border-radius: 22px;
	}

	.av-secao--acessos .av-acesso__foto {
		aspect-ratio: 2 / 1;
		border-radius: 14px;
	}

	.av-secao--acessos .av-acesso__corpo {
		padding: 18px 14px 12px;
	}

	.avseg .av-secao--acessos .av-acesso h2 {
		font-size: clamp(22px, 2vw, 27px);
	}

	.av-secao--acessos .av-acesso__etiqueta {
		margin-top: 10px;
	}

	.avseg .av-secao--acessos .av-acesso p {
		margin-top: 10px;
		font-size: 14.5px;
	}

	.av-secao--acessos .av-acesso__corpo > :nth-last-child(2) {
		margin-bottom: 18px;
	}

	.av-secao--acessos .av-acesso .av-btn {
		min-height: 44px;
		padding-block: 10px;
	}
}

/* ================================================================
   3.12: rodapé, abertura, depoimentos, como funciona, área,
   página não encontrada e aviso de cookies
   ================================================================ */

/* ---------------- aviso do regulamento no rodapé ---------------- */

.avseg .av-rodape__aviso {
	/* ocupa a linha inteira para descer abaixo do copyright; a folga
	   lateral segura o comprimento da linha no computador */
	flex: 0 0 100%;
	margin: 6px 0 0;
	padding-inline: clamp(0px, 9vw, 190px);
	text-wrap: balance;
	text-align: center;
	font-size: 12px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.46);
}

/* ---------------- abertura já vista: entra direto ---------------- */

.av-abertura-vista .av-loader {
	display: none !important;
}

/* ---------------- fotos dos depoimentos ---------------- */

.avseg .av-voz__foto {
	overflow: hidden;
}

.avseg .av-voz__foto img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 50%;
}

.avseg .av-voz .av-voz__foto.tem-foto,
.avseg .av-vozes__rostos .av-voz__foto.tem-foto {
	color: transparent;
	background-color: var(--tinta-3);
}

/* ---------------- botão no fim de como funciona ---------------- */

.av-tempo__acao {
	display: flex;
	justify-content: center;
	margin-top: clamp(40px, 5vw, 64px);
}

/* ---------------- área do associado ---------------- */

/* os blocos sobem: a abertura perde folga embaixo e a seção dos
   acessos começa colada nela */
.avseg .av-abertura {
	padding-bottom: clamp(26px, 3.6vw, 52px);
}

.avseg .av-secao--acessos {
	padding-top: 0;
}

/* ajuda em grade 2 x 2, todos do mesmo tamanho:
   assistência e WhatsApp em cima, rastreamento e e-mail embaixo */
.avseg #ajuda .av-canais {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 880px;
	margin-inline: auto;
}

.avseg #ajuda .av-canal--urgencia,
.avseg #ajuda .av-canais > .av-canal:last-child:nth-child(even) {
	grid-column: auto;
}

.avseg #ajuda .av-canal {
	align-items: center;
}

.avseg #ajuda .av-canal > svg {
	margin-top: 0;
}

@media (max-width: 720px) {
	.avseg #ajuda .av-canais {
		grid-template-columns: 1fr;
	}
}

/* ---------------- página não encontrada ---------------- */

.av-perdido {
	position: relative;
	display: grid;
	align-items: center;
	min-height: max(560px, calc(100svh - var(--av-topo, 122px)));
	padding: clamp(48px, 7vw, 96px) 0;
	overflow: hidden;
	background: var(--tinta);
	color: var(--papel);
}

.av-perdido__linha {
	position: relative;
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: clamp(34px, 5vw, 72px);
	align-items: center;
}

.av-perdido__texto {
	min-width: 0;
}

.avseg .av-perdido h1 {
	max-width: 12ch;
	font-size: clamp(40px, 6.2vw, 78px);
	text-transform: uppercase;
	letter-spacing: -0.015em;
	color: var(--papel);
}

.avseg .av-perdido__texto > p {
	max-width: 46ch;
	margin-top: clamp(14px, 2vw, 22px);
	font-size: clamp(15px, 1.4vw, 18px);
	color: rgba(255, 255, 255, 0.7);
}

.av-perdido__atalhos {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: clamp(26px, 3.4vw, 40px);
	padding-top: clamp(18px, 2.4vw, 26px);
	border-top: 1px solid var(--linha);
}

.avseg .av-perdido__atalhos a {
	padding: 7px 14px;
	border: 1px solid var(--linha);
	border-radius: 999px;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.78);
	transition: border-color 0.25s ease, color 0.25s ease;
}

.avseg .av-perdido__atalhos a:hover {
	border-color: var(--amarelo-borda);
	color: var(--amarelo);
}

/* o radar varre sem achar nada: o alvo pisca no vazio */
.av-radar--perdido .av-radar__escudo img {
	opacity: 0.9;
}

.av-perdido__alvo {
	position: absolute;
	width: 12px;
	height: 12px;
	border: 2px solid var(--amarelo);
	border-radius: 50%;
	transform: translate(-50%, -50%);
	animation: av-some 2.4s ease-in-out infinite;
}

@keyframes av-some {
	0%,
	100% {
		opacity: 0.15;
	}
	50% {
		opacity: 1;
	}
}

@media (max-width: 1080px) {
	.av-perdido__linha {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.av-perdido__texto {
		display: grid;
		justify-items: center;
	}

	.avseg .av-perdido h1 {
		max-width: 16ch;
	}

	.av-perdido .av-hero__botoes,
	.av-perdido__atalhos {
		justify-content: center;
	}

	.av-radar--perdido {
		order: -1;
	}
}

@media (max-width: 900px) {
	.av-perdido {
		min-height: 0;
	}

	.av-perdido__alvo {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.av-perdido__alvo {
		animation: none;
		opacity: 1;
	}
}

/* ---------------- aviso de cookies ---------------- */

.av-cookies {
	position: fixed;
	left: 22px;
	bottom: 22px;
	z-index: 96;
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 14px 16px;
	width: min(420px, calc(100vw - 44px));
	padding: 20px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 22px;
	background: rgba(22, 22, 22, 0.94);
	backdrop-filter: saturate(160%) blur(18px);
	-webkit-backdrop-filter: saturate(160%) blur(18px);
	box-shadow: 0 24px 60px -18px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.06);
	color: var(--papel);
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-cookies[hidden] {
	display: none;
}

.av-cookies.is-visivel {
	opacity: 1;
	transform: none;
}

.av-cookies__icone {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--amarelo);
	color: var(--tinta);
}

.av-cookies__icone svg {
	width: 20px;
	height: 20px;
}

.avseg .av-cookies h2 {
	font-size: 16px;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--papel);
}

.avseg .av-cookies p {
	margin-top: 5px;
	font-size: 13.5px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.68);
}

.avseg .av-cookies p a {
	color: var(--amarelo);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.av-cookies__botoes {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.avseg .av-cookies .av-btn {
	width: 100%;
}

/* botão nativo vem com fundo claro do navegador */
.avseg .av-cookies .av-btn--vidro {
	background: transparent;
}

.avseg .av-cookies .av-btn--vidro:hover {
	background: rgba(255, 255, 255, 0.09);
}

/* enquanto o aviso está aberto, a barra de atalhos e os botões
   flutuantes saem do caminho */
.avseg.tem-cookies .av-barra,
.avseg.tem-cookies .av-flutuante {
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none;
}

@media (max-width: 900px) {
	.av-cookies {
		left: 12px;
		right: 12px;
		bottom: calc(12px + env(safe-area-inset-bottom));
		width: auto;
		padding: 18px;
		border-radius: 20px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.av-cookies {
		transition: none;
		transform: none;
	}
}

/* ================================================================
   3.13: faixa amarela e botões do topo
   ================================================================ */

/* a faixa tem só a assistência: centralizada em qualquer tela */
.avseg .av-aviso__linha {
	justify-content: center;
	text-align: center;
}

/* topo: no computador, área do associado e rastreamento; no celular,
   só a cotação, na largura toda */
.avseg .av-hero .av-so-celular {
	display: none;
}

@media (max-width: 900px) {
	.avseg .av-hero .av-so-computador {
		display: none;
	}

	.avseg .av-hero .av-so-celular {
		display: inline-flex;
		flex: 1 1 100%;
	}
}

/* uma regra antiga do celular escondia o último link da faixa, que era
   a área do associado; agora o único item é a assistência */
.avseg .av-aviso__linha .av-aviso__item:first-child {
	display: inline-flex;
}
