@charset "utf-8";

/* ===================================== */
/* FUENTE */
/* ===================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

/* ===============================
   MAPA CORPORATIVO SERCONSLIMP
=================================*/


.map_header {
	padding: 25px 30px;
	background: linear-gradient(135deg, #0D47A1, #1565C0);
	color: #fff;
}

.map_header h3 {
	margin: 0;
	font-size: 22px;
	font-weight: 700;
}

.map_header p {
	margin: 5px 0 0;
	font-size: 14px;
	opacity: 0.9;
}



.map_wrapper:hover iframe {
	filter: grayscale(0%) contrast(110%);
}

.map_wrapper {
	margin: 20px 0 40px;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 25px 60px rgba(0,0,0,0.15);
	transition: 0.4s ease;
	background: #ffffff;
}

.map_wrapper:hover {
	transform: translateY(-5px);
	box-shadow: 0 35px 80px rgba(0,0,0,0.2);
}



/* ===================================== */
/* RESET */
/* ===================================== */
*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

body{
	font-family:'Poppins', sans-serif;
	font-size:15px;
	background:#f4f6f9;
	color:#2c3e50;
	line-height:1.6;
}

.super_container{
	width:100%;
	overflow:hidden;
	padding-top:0 !important;
}
a{
	text-decoration:none;
	transition:all .3s ease;
}

ul{
	list-style:none;
	margin:0;
	padding:0;
}

/* ===================================== */
/* BANNER */
/* ===================================== */
.contact_banner{
	background:linear-gradient(135deg,#0d6efd,#002f6c);
	color:#ffffff;
	padding:40px 20px;
	border-radius:18px;
	margin-bottom:25px;
	box-shadow:0 15px 40px rgba(0,0,0,0.15);
	text-align:center;
}

.contact_banner h1{
	font-size:30px;
	font-weight:700;
	margin-bottom:8px;
}

.contact_banner p{
	font-size:15px;
	opacity:0.95;
}

/* ===================================== */
/* MAPA */
/* ===================================== */


.map_card:hover{
	transform:translateY(-5px);
	box-shadow:0 25px 55px rgba(0,0,0,0.18);
}

/* ===================================== */
/* TARJETAS */
/* ===================================== */
.contact_contents,
.get_in_touch_contents{
	background:#ffffff;
	padding:35px;
	border-radius:18px;
	box-shadow:0 15px 35px rgba(0,0,0,0.08);
	transition:all .3s ease;
}

.contact_contents:hover,
.get_in_touch_contents:hover{
	transform:translateY(-6px);
	box-shadow:0 20px 45px rgba(0,0,0,0.15);
}

/* ===================================== */
/* TITULOS */
/* ===================================== */
.section_title{
	font-size:22px;
	font-weight:700;
	margin-bottom:10px;
	color:#1c2b36;
}

.section_subtitle{
	font-size:14px;
	color:#6c757d;
	margin-bottom:20px;
}

/* ===================================== */
/* INFO */
/* ===================================== */
.contact_info_block p{
	display:flex;
	align-items:center;
	font-size:14px;
	margin-bottom:10px;
}

.contact_info_block strong{
	min-width:90px;
	color:#0d6efd;
	font-weight:600;
}

/* ===================================== */
/* REDES */
/* ===================================== */
.social{
	margin-top:20px;
	display:flex;
	gap:12px;
}

.social li a{
	width:42px;
	height:42px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#ffffff;
	font-size:16px;
	box-shadow:0 8px 18px rgba(0,0,0,0.15);
	transition:all .3s ease;
}

.social li a:hover{
	transform:translateY(-4px) scale(1.1);
	box-shadow:0 12px 25px rgba(0,0,0,0.25);
}

/* ===================================== */
/* FORMULARIO */
/* ===================================== */
.form_input,
.input_message{
	width:100%;
	border:1px solid #dcdfe6;
	border-radius:14px;
	padding:14px 18px;
	margin-bottom:18px;
	font-size:14px;
	background:#f9fbfd;
	transition:all .3s ease;
}

.form_input:focus,
.input_message:focus{
	background:#ffffff;
	border-color:#0d6efd;
	box-shadow:0 0 0 4px rgba(13,110,253,0.15);
	outline:none;
}

textarea{
	resize:none;
}
/* Eliminar espacio superior real */
.contact_container{
	padding-top: 0 !important;
}

.contact_container > .row:first-child{
	margin-top: 0 !important;
}



/* ===================================== */
/* BOTON */
/* ===================================== */
.message_submit_btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:100%;
	padding:16px 25px;
	border-radius:50px;
	border:none;
	background:linear-gradient(135deg,#0d6efd,#002f6c);
	color:#ffffff;
	font-weight:600;
	font-size:15px;
	letter-spacing:0.5px;
	cursor:pointer;
	transition:all .3s ease;
	box-shadow:0 10px 25px rgba(0,0,0,0.25);
}

.message_submit_btn:hover{
	transform:translateY(-4px);
	box-shadow:0 18px 40px rgba(0,0,0,0.35);
	background:linear-gradient(135deg,#0056d2,#001f4d);
}

.message_submit_btn i{
	font-size:14px;
}


.map_container {
	height: 450px;
	border-radius:18px;
	overflow:hidden;
	box-shadow:0 20px 45px rgba(0,0,0,0.15);
}

.map_container iframe{
	width:100%;
	height:100%;
	border:0;
	display:block;
}


#google_map{
	margin: 0 0 25px 0 !important;
	padding-top: 0 !important;
}

/* Quitar margen interno del row del mapa */
.contact_container .row:first-child{
	margin-top: 0 !important;
}

/* ===================================== */
/* RESPONSIVE */
/* ===================================== */
@media (max-width:991px){
	.contact_contents{
		margin-bottom:30px;
	}
}

@media (max-width:576px){
	.contact_banner{
		padding:30px 15px;
	}
	.contact_banner h1{
		font-size:24px;
	}
}