@charset "utf-8";

@media (max-width: 768px) {

	/* Logo */
	.logo-container {
		position: relative;
		/* remove absolute */
		top: auto;
		left: auto;
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.logo {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.logo_bernardes {
		max-width: 280px;
	}

	.logo-text {
		margin-top: -40px;
		font-size: 2.0rem;
	}

	.hero-content {
		top: 65%;
	}

	.dados-container {
		display: none;
	}

	.dados-container-mobile {
		display: block;
		position: relative;
		text-align: center;
		z-index: 100;
		opacity: 0;
		animation: fadeInLogo 1s ease forwards;
		animation-delay: 0.5s;
		color: #a3b4ba;
		font-size: 18px;
		line-height: 30px;
		margin-top: 55px;
	}

	.container {
		max-width: 90%;
		margin: 0 auto;
	}

	/* About Section */
	.about-content {
		display: grid;
		grid-template-columns: 1fr;
		gap: 30px;
		margin: 50px 0;
	}

	.about-text {
		width: 95%;
	}

	.about-text p {
		text-align: justify;
		text-justify: inter-word;
	}

	.about-visual {
		position: relative;
		height: 300px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 50px !important;
	}

	.img_leo {
		max-height: 500px;
	}

	/* 3D Carousel Features Section */
	.features-container {
		position: relative;
		height: 520px;
		perspective: 1200px;
		margin: 50px 0;
	}

	.servicos-svg {
		display: none;
	}

	.servicos-mobile {
		display: block;
	}

	.item-servico {
		border-radius: 20px;
		padding: 15px;
		display: flex;
		align-items: center;
		gap: 15px;
		background: rgba(255, 255, 255, 0.03);
		backdrop-filter: blur(24px);
		-webkit-backdrop-filter: blur(24px);
		border: 1px solid rgba(255, 255, 255, 0.12);
		box-shadow:
			0 8px 32px rgba(0, 0, 0, 0.1),
			inset 0 1px 0 rgba(255, 255, 255, 0.2);
		color: #fff;
		font-size: 18px;
		line-height: 25px;
		height: 50px;
		margin-bottom: 10px;
	}

	.img-servico {
		max-width: 60px;
		flex-shrink: 0;
	}

	.marcas-carousel {
		width: 130%;
		margin-left: -55px;
	}

	.marcas-track {
		gap: 60px;
		animation: scrollMarcas 7s linear infinite;
	}

	@keyframes scrollMarcas {
		from {
			transform: translateX(0);
		}

		to {
			transform: translateX(-50%);
		}
	}

	.logo_footer {
		max-width: 150px;
	}

	/* Footer Section */
	.footer {
		background: linear-gradient(180deg, var(--dark) 0%, #0a0a0f 100%);
		color: #fff;
		padding: 60px 5% 30px;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		position: relative;
		overflow: hidden;
	}

	.footer::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 1px;
		background: linear-gradient(90deg, #c2070a, #dd080c);
		animation: glow-line 3s ease-in-out infinite;
	}

	@keyframes glow-line {

		0%,
		100% {
			opacity: 0.5;
		}

		50% {
			opacity: 1;
		}
	}

	.footer-container {
		max-width: 1300px;
		margin: auto;
		display: grid;
		grid-template-columns: 1fr;
		/* 👈 agora é 1 coluna */
		gap: 40px;
		text-align: center;
		/* opcional */
	}

	.footer-col h3 {
		font-size: 25px;
		text-align: left;
	}

	/* Logo */
	.logo-col {
		display: flex;
		justify-content: center;
	}

	.logo_footer {
		max-width: 220px;
		margin-top: -40px;
		margin-bottom: -30px;
	}

	.footer-list li {
		text-align: left;
		font-size: 17px;
	}

	.link_footer {
		font-size: 17px;
	}

}