/* ESTILO GENERAL */

body{

background:#eef2f7;
font-family:'Segoe UI',sans-serif;
margin:0;
padding:0;

}

/* CONTENEDOR PRINCIPAL */

.container{

display:flex;
justify-content:center;
align-items:center;
min-height:100vh;
padding:20px;

}

/* TARJETAS */

.card{

background:white;
padding:35px;
border-radius:12px;
box-shadow:0 5px 15px rgba(0,0,0,0.2);
width:100%;

}

/* TARJETA DE BUSQUEDA */

.consulta{

max-width:420px;

}

/* TARJETA PERFIL */

.perfil{

max-width:650px;

}

/* TITULOS */

h2{

color:#2c3e50;
margin-bottom:20px;
text-align:center;

}

h4{

margin-top:20px;
color:#34495e;

}

/* BOTONES */

.botones{

display:flex;
flex-wrap:wrap;
gap:12px;
margin-top:15px;

}

.btn{

display:flex;
align-items:center;
gap:8px;
padding:10px 15px;
font-size:14px;

}

/* FORMULARIO */

.form-control{

padding:10px;

}

/* RESPONSIVE */

/* TABLETS */

@media (max-width:768px){

.container{

padding:15px;

}

.card{

padding:25px;

}

.botones{

flex-direction:column;

}

.btn{

width:100%;
justify-content:center;

}

}

/* CELULARES */

@media (max-width:480px){

h2{

font-size:20px;

}

h4{

font-size:16px;

}

.card{

padding:20px;

}

.btn{

font-size:13px;
padding:10px;

}

}