*{

margin:0;
padding:0;
box-sizing:border-box;
font-family:'Segoe UI',sans-serif;

}



body{

background:#f5f0fa;

color:#444;

}



/* HEADER */

.historia-header{

background:white;

height:90px;

display:flex;

align-items:center;

justify-content:center;

box-shadow:0 5px 15px rgba(0,0,0,.08);

}


.historia-header h1{

font-family:Georgia,serif;

font-size:38px;

color:#886891;

}


.historia-header i{

color:#b88fc2;

}




/* TITULO */


.historia-container{

padding:60px 10%;

}



.titulo{

text-align:center;

margin-bottom:40px;

}


.titulo h2{

font-size:42px;

font-family:Georgia,serif;

color:#6a4e72;

}


.titulo p{

color:#886891;

font-size:18px;

margin-top:10px;

}





/* CAJA HISTORIA */


.historia-box{

display:flex;

gap:35px;

align-items:center;

}



.texto{

background:white;

padding:40px;

border-radius:25px;

box-shadow:0 10px 25px rgba(136,104,145,.15);

flex:2;

}



.texto h3{

color:#886891;

font-size:28px;

margin-bottom:20px;

}



.texto p{

line-height:1.8;

margin-bottom:15px;

}




.detalle-card{

background:#886891;

color:white;

padding:40px;

border-radius:30px;

text-align:center;

flex:1;

}



.detalle-card i{

font-size:65px;

color:#f5dff7;

}


.detalle-card h3{

font-size:25px;

margin:20px;

}




/* TARJETAS */


.info-cards{

display:flex;

justify-content:center;

gap:30px;

padding:20px 10% 50px;

}



.card{

background:white;

width:320px;

padding:35px;

text-align:center;

border-radius:25px;

box-shadow:0 8px 20px rgba(0,0,0,.08);

transition:.3s;

}



.card:hover{

transform:translateY(-8px);

}



.card i{

font-size:45px;

color:#b88fc2;

}



.card h3{

color:#6a4e72;

margin:20px;

font-size:24px;

}



.card p{

line-height:1.7;

}





/* BOTÓN */


.volver{

text-align:center;

padding-bottom:50px;

}



.volver a{

background:#886891;

color:white;

padding:14px 35px;

border-radius:30px;

text-decoration:none;

font-weight:bold;

}



.volver a:hover{

background:#6a4e72;

}