/* Ver Vacante styles: maintainable, responsive, Baloo 2 headings */

.vacante-page { 
	font-family: 'Baloo 2', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
 	color: #003747; 
}
.vacante-hero { 
	background-color: #dd756e;
	text-align: center;
        padding: 30px 20px 30px 20px;  
}

.vacante-title { 
	margin: 0; 
	font-size: 30px;
	font-weight: 700; 
	color: #fff;
}

.vacante-company { 
	margin-top: 0.75rem; 
	font-size: 20px;
        font-weight: 400;
	color: #fff;
}


.vacante-divider { 
	background-color: #ffffff; 	
	height: 10px; 	
}

.vacante-objetivo { 
	background-color: #00374F; 	
}

.vacante-container { 
	max-width: 900px; 
	margin: 0 auto; 	
	padding: 20px 20px; 
}

.vacante-heading { 
	color: #ffffff; 
	font-size: 24px; 
	font-weight: 700; 
	text-align: center;
}

.vacante-description{ 
	background-color: #ffffff;
	color: #003747; 
	padding: 20px; 
	border-radius: 8px; 
	margin-top: 20px; 
	line-height: 1.65;
}

.vacante-data { 
	background-color: #dd756e; 
}

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

.vacante-row { 
	display: flex; 
	align-items: center; 
	justify-content: space-between; 
	padding: 8px 0; 
	border-bottom: 1px solid rgba(255,255,255,0.2); 
}

.vacante-label { 
	color: #ffffff; 
	font-size: 16px; 
	font-weight: 500; 
	min-width: 200px; 
}

.vacante-value { 
	background-color: rgba(255,255,255,0.3); 
	padding: 6px 12px; 
	border-radius: 5px; 
	font-size: 16px; 
	color: #ffffff; 
}
	
.vacante-row:last-child { 
	border-bottom: none; 
}

.vacante-cta { 
	padding: 40px 20px; 
	max-width: 1200px; 
	margin: 0 auto; 
	text-align: center; 
}

.vacante-cta .button { 
	display: inline-block; 
	padding: 12px 30px; 
	background-color: #00374F; 
	color: #fff; 
	text-decoration: none; 
	border-radius: 6px; 
	font-size: 16px; 
	font-weight: 700; 
}


/* Responsive tweaks */
@media (min-width: 768px) {
  	.vacante-title { 
	font-size: 48px; 
	}
 	.vacante-company { 
	font-size: 24px;
	}
  	.vacante-hero { 
	background-color: #dd756e;
	text-align: center;
      	padding-top: 64px;
       	padding-bottom: 64px;
        }
        .vacante-title { 
	margin: 0; 
	font-size: 48px;
	font-weight: 600; 
	color: #fff;
       	 margin-bottom:30px;
	}
        .vacante-company { 
	margin-top: 0.75rem; 	
	font-size: 20px;
	color: #fff; 
	font-weight: 400; 
        }
        .vacante-container { 
	max-width: 900px; 
	margin: 0 auto; 	
	padding: 64px 20px; 
	}
        .vacante-container { 
	max-width: 900px; 
	margin: 0 auto; 	
	padding: 64px 20px; 
        }


}