	:root 			{ 
						--azul-escuro:#050d18;  
						--azul-medio:#0a1d35;  
						--azul-claro:#102b4d;	  
						--azul-destaque:#2d6cb5;  
						--azul-hover:#6ea8ff;  
						--cinza:#f4f7fb;  
						--branco:#ffffff;					
					}
	
* 					{ 	 		
					margin:0; 	 		
					padding:0; 	 		
					box-sizing:border-box;	 		
					font-family:Arial, Helvetica, sans-serif;	
					}
	
html 				{ 		 	
					scroll-behavior:smooth;	
					}
	
body 				{ 			
					background:var(--cinza);		 	
					color:#222; 		 	
					line-height:1.6;
					}

/* =========================   
menu
 ========================= */

nav 			{
 		 	
				width:100%;		 
	
				position:fixed; 		 	

				top:0;		 		

				left:0;		 

				display:flex; 		 	

				justify-content:space-between; 	
	 	
				align-items:center; 		
	
				padding:16px 8%; 		 	

				background:rgba(5,13,24,.95); 		
	
				backdrop-filter:blur(6px); 		 
	
				z-index:1000; 			

				border-bottom:1px solid rgba(255,255,255,.08);	

				}

.logo-area 		{ 		
	
				display:flex; 		
	
				align-items:center;			

				gap:18px;

				}

.logo 			{ 			

				width:58px;	
		
				height:58px; 	
		
				object-fit:contain; 		
	
				background:transparent; 	
		
				padding:0; 	
		
				border-radius:10%; 	
		
				box-shadow:none; 		
	
				transition:.3s;

				}

.logo:hover 	{ 	
			
				transform:scale(1.05);

				}

.logo-text h2 	{ 			
	
				color:#ffffff; 		
		
				font-size:1.7rem; 	
			
				letter-spacing:2px; 		
		
				font-weight:700;

				}

.logo-text p 	{ 				

				color:#9fb8d9; 	
			
				font-size:.78rem; 		
		
				letter-spacing:4px;

				}

nav ul 			{ 				

				display:flex; 		
		
				list-style:none; 		
		
				gap:30px;

				}

nav ul li a 		{ 				

				color:white; 		
		
				text-decoration:none; 		
		
				font-weight:bold; 	
			
				transition:.3s;

				}

nav ul li a:hover { 				
	
				color:var(--azul-hover);

				}

/* =============================
   3 barrinhas
===============================*/

.menu-toggle 	{ 		
		
				display: none; 		
		
				flex-direction: column; 		
		
				gap: 6px; 		
		
				cursor: pointer; 	
		
				background: transparent; 		
		
				border: none; 		
	
				z-index: 1001;

				}

.menu-toggle .bar { 				
	
					width: 30px; 		
			
					height: 3px; 		
			
					background-color: var(--branco); 	
				
					border-radius: 5px; 	
				
					transition: all 0.3s ease;

					}

/* ==========================================================
    3 barras um "X" quando ativo 
==============================================================*/

.menu-toggle.active .bar:nth-child(1) 	{ 	 			
										transform: translateY(9px) rotate(45deg);
										}

.menu-toggle.active .bar:nth-child(2) 	{ 				
										opacity: 0;
										}

.menu-toggle.active .bar:nth-child(3) 	{ 				
										transform: translateY(-9px) rotate(-45deg);
										}


/* =========================   
header
========================= */

header 				{ 	
				
					height: 55vh;	
	
					/* Imagem aplicada aqui na regra principal para funcionar em computadores e notebooks */ 					
					background: linear-gradient(rgba(5, 13, 24, 0.75), rgba(10, 29, 53, 0.8)), url('https://images.unsplash.com/photo-1474487548417-781cb71495f3?q=80&w=1600&auto=format&fit=crop'); 	
			
					background-size: cover; 	
				
					background-position: center; 	
				
					display: flex; 		
			
					justify-content: center; 	
				
					align-items: center; 	
				
					text-align: center; 			
		
					padding: 120px 20px 40px 20px; 	
				
					border-bottom: none;

					}

.hero 				{ 		
			
					max-width:850px; 	
				
					color:white;

					}

.hero h1 			{ 		
			
					font-size: 3rem; 	
				
					margin-bottom: 10px; 		
			
					line-height: 1.2;

        				letter-spacing: 1px;

					}

.hero p 				{ 		
			
					font-size: 1.2rem; 		
			
					color: #c8d6ea; 	
				
					max-width: 600px; 		
			
					margin: 0 auto;

					}

/* =========================   
seção
 ========================= */

section 			{ 					
				padding:80px 10%;
				}

.title 			{ 					
				text-align:center; 					
				margin-bottom:50px;
				}

.title h2 		{ 					
				font-size:2.5rem; 					
				color:var(--azul-escuro); 					
				position:relative; 					
				display:inline-block;
				}

.title h2::after 	{ 					
				content:""; 					
				width:60%; 					
				height:4px; 					
				background:var(--azul-destaque); 					
				position:absolute; 					
				left:20%; 					
				bottom:-12px; 					
				border-radius:20px;
				}

/* =========================   
quem somos
========================= */

.about-container 	{                     
					display: grid;                     
					grid-template-columns: 1.2fr 0.8fr;                     
					gap: 50px;                    
					align-items: center;
					}

.about-text p 		{                     
					font-size: 1.15rem;                     
					color: #444;                     
					text-align: justify;                     
					margin-bottom: 20px;
					}

.about-img img 	{                     
					width: 100%;                     
					border-radius: 12px;                     
					box-shadow: 0 10px 30px rgba(0,0,0,0.1);
					}

/* =========================   
diretrizes 
========================= */

.diretrizes 			{                     
					background-color: var(--branco);
					}

.diretrizes-grid 		{                     
					display: grid;                     
					grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));                     
					gap: 30px;
					}

.diretriz-card 		{                     
					background: var(--cinza);                     
					padding: 30px;                     
					border-radius: 6px;
					}

.diretriz-card h3 	{                     
					color: var(--azul-medio);                    
					font-size: 1.3rem;                     
					margin-bottom: 15px;
					}

.diretriz-card p 		{                     
					color: #555;                    
					font-size: 1.0rem;				
					text-align: justify;
					}

/* =========================   
seção de parceiros
========================= */

.parceiros-section 		{ 									
						background-color: var(--branco); 									
						padding: 60px 10%; 									
						text-align: center; 									
						border-bottom: 1px solid rgba(0,0,0,0.05);						
						}

.parceiros-section h3 	{ 									
						color: var(--azul-medio); 									
						font-size: 2.5rem; 									
						margin-bottom: 35px; 									
						letter-spacing: 1px;						
						}

.parceiros-grid 			{ 									
						display: grid; 									
						grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); 									
						gap: 30px; 									
						align-items: center; 									
						justify-content: center;						
						}

.parceiro-logo 			{ 									
						display: flex; 									
						flex-direction: column; 									
						align-items: center; 									
						justify-content: center; 									
						padding: 20px; 									
						background: var(--cinza); 									
						border-radius: 8px; 									
						transition: all 0.3s ease; 									
						border: 1px solid rgba(0,0,0,0.02);						
						}	

.parceiro-logo:hover 	{ 									
						transform: translateY(-3px); 									
						box-shadow: 0 8px 20px rgba(0,0,0,0.05); 									
						border-color: var(--azul-hover);						
						}

.parceiro-icon 			{ 									
						font-size: 2rem; 									
						margin-bottom: 8px; 									
						opacity: 0.8;						
						}

.parceiro-name 		{ 									
						font-size: 1rem; 									
						font-weight: bold; 									
						color: var(--azul-claro); 									
						letter-spacing: 0.5px;						
						}

/* =========================   
diferenciais
========================= */

.diferenciais-grid 		{ 						
						display: grid; 						
						grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 						
						gap: 30px;							
						}

.diferencial-card 		{ 						
						background: var(--branco); 						
						padding: 35px 30px; 						
						border-radius: 12px; 						
						box-shadow: 0 5px 20px rgba(0,0,0,0.05); 						
						text-align: center; 						
						transition: .3s;							
						}

.diferencial-card:hover { 						
						transform: translateY(-5px); 						
						box-shadow: 0 10px 25px rgba(0,0,0,0.1);							
						}

.diferencial-icon 		{ 						
						width: 50px; 						
						height: 50px; 						
						background: var(--cinza); 						
						color: var(--azul-destaque); 				
						font-size: 1.5rem; 						
						font-weight: bold; 						
						display: flex; 						
						align-items: center; 						
						justify-content: center; 						
						border-radius: 50%; 						
						margin: 0 auto 20px auto;							
						}

.diferencial-card h3 	{ 						
						color: var(--azul-escuro); 						
						margin-bottom: 12px; 						
						font-size: 1.3rem;							
						}

.diferencial-card p 		{ 						
						color: #666; 						
						font-size: 0.95rem;							
						}

.parceiros 				{							
						width: 50%;							
						height: 50%;							
						border-radius: 100%;							
						}

/* =========================   
qualidade técnicas 
========================= */

.qualidades 			{ 						
						background: linear-gradient(135deg, var(--azul-escuro), var(--azul-medio)); 						
						color: var(--branco);							
						}

.qualidades .title h2 	{ 						
						color: var(--branco);							
						}

.qualidades-grid 		{ 						
						display: grid; 						
						grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 						
						gap: 40px;							
						}

.qualidade-item h3 	{ 						
						color: var(--azul-hover); 						
						font-size: 1.4rem; 						
						margin-bottom: 12px; 						
						display: flex; 						
						align-items: center; 						
						gap: 10px;							
						}	

.qualidade-item p 		{ 						
						color: #c8d6ea; 						
						font-size: 1rem;							
						}

/* =========================   
política de qualidade
========================= */

.qualidade-section 		{
						background-color: var(--branco);
						padding: 80px 10%;
						}

.qualidade-container 	{
						max-width: 1050px;
						margin: 0 auto;
						}

.qualidade-subtitle 	{
						text-align: center;
						color: #555;
						font-size: 1.05rem;
						margin: -30px auto 40px auto;
						max-width: 700px;
						}

.qualidade-compromisso-card 		{
									background: var(--cinza);
									padding: 30px;
									border-radius: 10px;
									border-left: 5px solid var(--azul-destaque);
									margin-bottom: 40px;
									}

.qualidade-compromisso-card h3 	{
									color: var(--azul-escuro);
									font-size: 1.3rem;
									margin-bottom: 10px;
									}

.qualidade-compromisso-card p 	{
									color: #444;
									font-size: 1.02rem;
									text-align: justify;
									}

.qualidade-principios-header 		{
									text-align: center;
									color: var(--azul-escuro);
									font-size: 1.8rem;
									margin-bottom: 30px;
									}

.qualidade-grid		 				{
									display: grid;
									grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
									gap: 25px;
									margin-bottom: 40px;
									}

.qualidade-card-item 				{
									background: var(--cinza);
									padding: 30px 25px;
									border-radius: 10px;
									box-shadow: 0 4px 15px rgba(0,0,0,0.03);
									border: 1px solid rgba(0,0,0,0.03);
									transition: transform 0.3s ease, box-shadow 0.3s ease;
									text-align: center;
									}

.qualidade-card-item:hover 		{
									transform: translateY(-5px);
									box-shadow: 0 8px 25px rgba(0,0,0,0.08);
									}

.qualidade-icon 					{
									width: 55px;
									height: 55px;
									background: var(--branco);
									color: var(--azul-destaque);
									display: flex;
									align-items: center;
									justify-content: center;
									border-radius: 50%;
									margin: 0 auto 20px auto;
									box-shadow: 0 4px 12px rgba(0,0,0,0.06);
									border: 1px solid rgba(45, 108, 181, 0.15);
									}

.qualidade-card-item h4 			{
									color: #111;
									font-size: 1.2rem;
									margin-bottom: 12px;
									}

.qualidade-card-item p 			{
									color: #555;
									font-size: 0.95rem;
									text-align: justify;
									}

.qualidade-compromisso-box 		{
									background: var(--cinza);
									padding: 35px;
									border-radius: 10px;
									box-shadow: 0 4px 15px rgba(0,0,0,0.03);
									}

.qualidade-compromisso-box h3 	{
									color: var(--azul-escuro);
									font-size: 1.3rem;
									margin-bottom: 12px;
									text-align: left;
									}

.qualidade-compromisso-box p 	{
									color: #555;
									font-size: 0.98rem;
									margin-bottom: 30px;
									text-align: justify;
									}

.qualidade-assinatura-wrapper 	{
									display: flex;
									justify-content: space-between;
									align-items: flex-end;
									border-top: 1px solid rgba(0,0,0,0.08);
									padding-top: 25px;
									gap: 20px;
									}

.qualidade-diretor-nome 			{
									font-weight: bold;
									color: var(--azul-escuro);
									font-size: 1.1rem;
									}

.qualidade-diretor-cargo 			{
									color: #666;
									font-size: 0.9rem;
									}

.qualidade-meta-info 				{
									text-align: right;
									color: #666;
									font-size: 0.88rem;
									}

/* =========================   
rodape 
========================= */

footer 								{ 							
									background:#030912; 							
									color:#c8d6ea; 							
									text-align:center; 							
									padding:40px 20px;			
									}

footer p 							{ 							
margin:								8px 0;							
									}

/* =========================   
reponsivo 
========================= */

@media(max-width:992px){  
							
nav 						{  	 	
	
							flex-direction: row;  /* Manter logo e botão alinhados */
	
							justify-content: space-between;  	
						
							padding: 16px 5%;  		
					
							}

  /* ==================================================
      Botão das 3 barras 
=====================================================*/

  .menu-toggle 				{  		
					
							display: flex;  	
						
							}

  /* ====================================================
    lista de links em menu suspenso
=======================================================*/

 nav ul 						{  					
		
							position: fixed;  	
						
							top: 90px;  		 /* Logo abaixo da barra de navegação */
					
							right: -100%;  		/* Escondido para o lado direito da tela */
					
							width: 250px;  		
					
							height: calc(100vh - 90px);  	
						
							background: rgba(5, 13, 24, 0.98);  		
					
							backdrop-filter: blur(10px);  			
				
							flex-direction: column;  
							
							justify-content: flex-start;  	
						
							padding: 40px 30px;  		
					
							gap: 25px;  					
		
							transition: right 0.4s cubic-bezier(0.1, 0.8, 0.3, 1);	   /* Animação suave de entrada */
							
							border-left: 1px solid rgba(255, 255, 255, 0.08);  
							
							}


  nav ul.active 				{  	
						
							right: 0;  	
						
							}

  .about-container 			{ 		
			
							grid-template-columns: 1fr; 
					
							gap: 30px; 	
						
							}

  .hero h1 					{  							
							font-size: 2.5rem;  							
							}   

  header 					{  							
							height: auto;  							
							padding: 140px 20px 60px 20px;  							
							}   

  section 					{ 					
							padding: 60px 5%; 							 
							}

  .parceiros-section 			{ 					
							padding: 40px 5%;  							
							}

  .parceiros-grid 			{ 					
							grid-template-columns: repeat(2, 1fr); 					
							gap: 15px;  							
							}

  .qualidade-assinatura-wrapper {													
							flex-direction: column;														
							align-items: flex-start;														
							}

  .qualidade-meta-info 		{											
							text-align: left;															
							}

							}

@media(max-width: 992px) {
    .cards-contato {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .logo-text h2 {
        font-size: 1.2rem;
    }

    .logo-text p {
        font-size: 0.65rem;
        letter-spacing: 1px;
    }
}


