*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial,sans-serif;
}

html{

scroll-behavior:smooth;

}

body{

line-height:1.7;
color:#333;
background:#fff;

}

.container{

max-width:1200px;
margin:auto;
padding:0 20px;

}


/* HEADER */

header{

position:sticky;
top:0;
background:white;
z-index:999;
box-shadow:0 2px 10px rgba(0,0,0,.08);

}

.menu{

display:flex;
align-items:center;
justify-content:space-between;
padding:20px 0;

}

.logo{

font-size:25px;
font-weight:bold;
text-decoration:none;
color:#111;

}

nav ul{

display:flex;
list-style:none;
gap:35px;

}

nav a{

text-decoration:none;
font-weight:600;
color:#333;
transition:.3s;

}

nav a:hover{

color:#0b66c3;

}


/* BOTONES */

.btn{

background:#0b66c3;
color:white;
padding:14px 28px;
text-decoration:none;
border-radius:5px;
font-weight:bold;

}

.btn2{

padding:14px 28px;
border:2px solid #0b66c3;
text-decoration:none;
border-radius:5px;
color:#0b66c3;
font-weight:bold;

}


.botones{

display:flex;
gap:15px;

}


/* HERO */

.hero{

padding:100px 0;

}

.hero-content{

display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:center;

}

.hero-text h1{

font-size:55px;
line-height:1.2;
margin-bottom:20px;

}

.hero-text p{

font-size:20px;
color:#666;
margin-bottom:30px;

}

.hero-img img{

width:100%;
border-radius:15px;

}


/* SERVICIOS */

.servicios{

background:#f7f7f7;
padding:90px 0;

}

.titulo{

text-align:center;
margin-bottom:50px;

}

.titulo h2{

font-size:38px;
margin-bottom:15px;

}

.cards{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;

}

.card{

background:white;
padding:30px;
border-radius:10px;
box-shadow:0 0 15px rgba(0,0,0,.05);

}

.card h3{

margin-bottom:15px;

}


/* BENEFICIOS */

.beneficios{

padding:90px 0;

}

.lista{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:25px;

}

.item{

padding:30px;
background:#f7f7f7;
border-radius:10px;

}


/* CTA */

.cta{

padding:90px 20px;
background:#0b66c3;
text-align:center;
color:white;

}

.cta h2{

font-size:40px;
margin-bottom:15px;

}

.cta p{

margin-bottom:30px;

}

.cta .btn{

background:white;
color:#0b66c3;

}


/* FOOTER */

footer{

padding:30px;
text-align:center;

}



/* RESPONSIVE */

@media(max-width:991px){

.hero-content{

grid-template-columns:1fr;

}

.hero-text h1{

font-size:38px;

}

.cards{

grid-template-columns:1fr;

}

.lista{

grid-template-columns:1fr;

}

/* CAMBIO IMPORTANTE */

nav{

display:block;

}

}

/* LOGO */

.logo img{

height:70px;
width:auto;

}


/* FOOTER */

footer{

padding:50px 0;
background:#111827;
color:white;

}

.footer-content{

display:flex;
justify-content:space-between;
align-items:center;
gap:50px;

}

.footer-logo{

width:180px;

}

.footer-info p{

margin-bottom:15px;

}

.footer-info a{

color:white;
text-decoration:none;

}


/* móvil */

@media(max-width:768px){

.footer-content{

flex-direction:column;
text-align:center;

}

.logo img{

height:55px;

}

}

/* HERO NUEVO */

.hero{

padding:90px 0;

}

.mini-text{

display:inline-block;
background:#eaf4ff;
padding:8px 15px;
border-radius:30px;
margin-bottom:20px;
color:#0b66c3;
font-weight:bold;

}

.datos{

display:flex;
gap:40px;
margin-top:50px;

}

.datos div{

display:flex;
flex-direction:column;

}

.datos strong{

font-size:30px;
color:#0b66c3;

}

.datos span{

font-size:14px;
color:#666;

}

.hero-img img{

width:100%;
border-radius:20px;
box-shadow:0 15px 40px rgba(0,0,0,.1);

}


@media(max-width:991px){

.datos{

flex-direction:column;
gap:20px;

}

}

/* TRABAJOS */

.trabajos{

padding:100px 0;

}

.galeria{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;

}

.trabajo-card{

position:relative;
overflow:hidden;
border-radius:15px;

}

.trabajo-card img{

width:100%;
height:100%;
display:block;
transition:.5s;

}

.trabajo-card:hover img{

transform:scale(1.05);

}

.overlay{

position:absolute;
bottom:0;
left:0;
width:100%;
padding:30px;
background:linear-gradient(
transparent,
rgba(0,0,0,.8)
);

}

.overlay h3{

color:white;

}

@media(max-width:991px){

.galeria{

grid-template-columns:1fr;

}

}

/* ELEGIRNOS */

.elegirnos{

padding:100px 0;
background:white;

}

.elegir-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;

}

.elegir-card{

padding:35px;
border-radius:15px;
text-align:center;
box-shadow:0 0 20px rgba(0,0,0,.05);
transition:.4s;

}

.elegir-card:hover{

transform:translateY(-8px);

}

.icono{

width:70px;
height:70px;
margin:auto;
margin-bottom:20px;
border-radius:50%;
background:#0b66c3;
display:flex;
align-items:center;
justify-content:center;
font-size:28px;
font-weight:bold;
color:white;

}

.elegir-card h3{

margin-bottom:15px;

}

.elegir-card p{

color:#666;

}


@media(max-width:991px){

.elegir-grid{

grid-template-columns:1fr;

}

}

/* WHATSAPP FLOTANTE */

.whatsapp{

position:fixed;
right:25px;
bottom:25px;
width:65px;
height:65px;
border-radius:50%;
z-index:1000;

animation:flotar 2s infinite;

}

.whatsapp img{

width:100%;

}

@keyframes flotar{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0px);

}

}


@media(max-width:768px){

.whatsapp{

width:55px;
height:55px;
right:15px;
bottom:15px;

}

}

/* COBERTURA */

.cobertura{

padding:100px 0;
background:#f8fafc;

}

.ciudades{

display:flex;
flex-wrap:wrap;
justify-content:center;
gap:20px;
margin-top:50px;

}

.ciudad{

padding:15px 25px;
background:white;
border-radius:30px;
font-weight:600;
box-shadow:0 5px 15px rgba(0,0,0,.08);
transition:.3s;

}

.ciudad:hover{

transform:translateY(-5px);

}

/* FAQ */

.faq{

padding:100px 0;

}

.faq-container{

max-width:900px;
margin:auto;

}

.faq-item{

padding:30px;
margin-bottom:20px;
border-radius:10px;
background:#fff;
box-shadow:0 5px 20px rgba(0,0,0,.05);

}

.faq-item h3{

margin-bottom:15px;
font-size:20px;
color:#0b66c3;

}

.faq-item p{

color:#666;

}

/* OPTIMIZACIÓN DE IMÁGENES */

img{

max-width:100%;
height:auto;
display:block;

}



/* selección de texto */

::selection{

background:#0b66c3;
color:white;

}



/* animaciones suaves */

*{

-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;

}

/* MENU MOVIL */

.menu-btn{
display:none;
font-size:35px;
cursor:pointer;
z-index:1001;
}

@media(max-width:991px){

.menu-btn{
display:block;
}

.menu .btn{
display:none;
}

nav{

position:absolute;
top:100%;
left:0;

width:100%;
background:#fff;

padding:30px;

box-shadow:0 10px 20px rgba(0,0,0,.1);

opacity:0;
visibility:hidden;

transform:translateY(-15px);

transition:all .4s ease;

z-index:999;

}

nav.active{

opacity:1;
visibility:visible;

transform:translateY(0);

}

nav ul{

display:flex;
flex-direction:column;

gap:20px;

}

}

/* TESTIMONIOS */

.testimonios{

padding:100px 0;
background:#f8fafc;

}

.testimonios-grid{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;

}

.testimonio{

padding:35px;
border-radius:15px;
background:white;

box-shadow:0 5px 20px rgba(0,0,0,.05);

transition:.4s;

}

.testimonio:hover{

transform:translateY(-8px);

}

.estrellas{

font-size:24px;
margin-bottom:20px;

color:#ffc107;

}

.testimonio p{

margin-bottom:20px;
color:#666;

}

.testimonio h4{

color:#0b66c3;

}

@media(max-width:991px){

.testimonios-grid{

grid-template-columns:1fr;

}

}

/* ESTADISTICAS */

.estadisticas{

padding:100px 0;
background:#0b66c3;
color:white;

}

.estadisticas-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;

}

.numero-box{

text-align:center;

}

.numero-box h2{

font-size:50px;
margin-bottom:10px;

}

.numero-box p{

font-size:18px;

}

@media(max-width:991px){

.estadisticas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:600px){

.estadisticas-grid{

grid-template-columns:1fr;

}

}

/* PROCESO */

.proceso{

padding:100px 0;
background:#fff;

}

.proceso-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;

}

.paso{

text-align:center;
padding:35px;
border-radius:15px;

box-shadow:0 5px 20px rgba(0,0,0,.05);

transition:.4s;

}

.paso:hover{

transform:translateY(-8px);

}

.numero{

width:70px;
height:70px;

margin:auto;
margin-bottom:25px;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

background:#0b66c3;

font-size:28px;
font-weight:bold;
color:white;

}

.paso h3{

margin-bottom:15px;

}

.paso p{

color:#666;

}


@media(max-width:991px){

.proceso-grid{

grid-template-columns:repeat(2,1fr);

}

}


@media(max-width:600px){

.proceso-grid{

grid-template-columns:1fr;

}

}

/* CONTACTO */

.contacto{

padding:100px 0;
background:#f8fafc;

}

.contacto-grid{

display:grid;
grid-template-columns:1fr 1fr;
gap:50px;

}

.contacto-info{

padding:30px;

}

.contacto-info h3{

margin-bottom:20px;

}

.contacto-info p{

margin-bottom:15px;

}

.contacto-form input,
.contacto-form select,
.contacto-form textarea{

width:100%;

padding:15px;

margin-bottom:20px;

border:1px solid #ddd;

border-radius:8px;

outline:none;

}

.contacto-form textarea{

height:150px;
resize:none;

}

@media(max-width:991px){

.contacto-grid{

grid-template-columns:1fr;

}

}

/* ANIMACIONES SCROLL */

.reveal{

opacity:0;

transform:translateY(50px);

transition:all .8s ease;

}

.reveal.active{

opacity:1;

transform:translateY(0);

}

/* BOTON LLAMADA */

.llamada{

position:fixed;

right:25px;
bottom:105px;

width:65px;
height:65px;

border-radius:50%;

z-index:1000;

animation:flotar 2s infinite;

}

.llamada img{

width:100%;

}

@media(max-width:768px){

.llamada{

width:55px;
height:55px;

right:15px;
bottom:85px;

}

}