/* lista estilo */
#whatsapp h2 {
	font-size: 1.35rem;
}
#whatsapp .head {
	background-color: var(--color-laranja);
	padding: 10px 10.5% 10px;
}
#whatsapp .head h2 {
	font-size: clamp(1.125rem, 1.45vw, 1.5rem);
}
#whatsapp .head .image {
	display: flex;
	justify-content: center;
	margin-bottom: 50px;
}
#whatsapp .head .icon_1 {
   animation: moving 4s infinite both;
   max-width: 52px;
   max-height: 52px;
}
#whatsapp .head .intro {
	padding: 0 12.5%;
	text-align: center;
	color: #fff;
	margin-bottom: 12px;
}

#whatsapp .list {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}ca

#whatsapp .list .estate-control {
	min-width: 20%;
}

#whatsapp .list .city-control {
	min-width: 40%;
}

#whatsapp .bottom-container {
	padding: 0 10.5%;
}

#whatsapp .bottom-container .state-empty__hand {
	margin-top: 30px;
	text-align: center;
}

#whatsapp .state-empty__text {
	text-align: center;
}

.whatsapp-page-cards {
	padding: 32px 0;
   transition: padding 500ms ease;
}
.whatsapp-page-cards.hidden {
   padding: 0;
}


/*
   * Card único
*/

.card-default {
	padding: 10px 10px 6px;
	margin: 0;
	box-shadow: 0 0.02rem 0.08rem 0 rgba(0, 0, 0, 0.4);
	border-radius: 5px;
}
.card-default .card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 16px;
}
.card-default .card-header .card-logo {
	position: relative;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(
		var(--color-azul) 20%,
		var(--color-laranja) 65%,
		var(--color-laranja)
	); /* cor de fundo opcional, caso a imagem não carregue */
}
.card-default .card-header .card-logo img {
	width: 100%;
	height: 100%;
}
.card-default .card-header .card-info {
	flex: 1;
	display: flex;
	/*flex-direction: column;*/
	justify-content: center;
	align-items: center;
}
.card-default .card-header .card-info p {
	margin-bottom: 0;
	font-size: 18px;
	color: #000;
}
.card-default .card-header .card-info p.card-title {
	font-weight: 500;
}
.card-default .card-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background-color: #24d366;
	color: var(--color-default);
	width: 100%;
	height: 40px;
	border-radius: 0.2rem;
	margin: 0 0 0.16rem;
	text-align: center;
	vertical-align: middle;
}

/* Fim */

.whatsapp-page-cards__card {
	padding-top: 10px;
	margin: 0;
}

.whatsapp-page-cards__card .card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 16px;
}

.whatsapp-page-cards__card .card-header .card-logo {
	position: relative;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(
		var(--color-azul) 20%,
		var(--color-laranja) 65%,
		var(--color-laranja)
	);
}

.whatsapp-page-cards__card .card-header .card-logo img {
	width: 100%;
	height: 100%;
}

.whatsapp-page-cards__card .card-header .card-info {
	flex: 1;
	display: flex;
	/*flex-direction: column;*/
	justify-content: center;
	align-items: center;
}
.whatsapp-page-cards__card .card-header .card-info i {
    font-size: 1.25rem;
}
.whatsapp-page-cards__card .card-header .card-info p {
	margin-bottom: 0;
	font-size: 18px;
	color: #000;
}

.whatsapp-page-cards__card .card-header .card-info p.card-title {
	font-weight: 500;
}

.whatsapp-page-cards__card .card-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

@media (max-width: 992px) {
	#whatsapp .head {
		padding-inline: 3.5%;
	}
	#whatsapp .head .intro {
		padding: 0;
	}
}

@keyframes moving {
   25% {
      transform: rotate(15deg);
      scale: 1.1;
   }
   50% {
      transform: rotate(-15deg);
      scale: 1.05;
   }
   75% {
      transform: rotate(15deg);
      scale: 1.1;
   }
   100% {
      transform: rotate(0deg);
      scale: 1;
   }
}