body{margin:0;font-family:Arial;background:#2963ba;}

header{
background:#0d1b2a;
color:white;
display:flex;
justify-content:space-between;
align-items:center;
padding:10px 20px;
}

.logo{display:flex;align-items:center;gap:10px;}
.logo img{width:60px;border-radius:10px;}

nav ul{list-style:none;display:flex;gap:15px;}
nav a{color:white;text-decoration:none;font-weight:bold;}

.ofertas{display:flex;gap:10px;}
.ofertas img{width:60px;border-radius:10px;}

.mapas{padding:20px;}

/* HERO (IMAGEN PRINCIPAL CON TEXTO) */
.hero{
    width:100%;
    height:300px;
    background:url("../img/avi.png") center/cover no-repeat;
    display:flex;
    align-items:center;
    padding:50px;
    color:white;
    position:relative;
}

/* OSCURECER UN POCO PARA QUE EL TEXTO SE VEA */
.hero::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.3);
}

/* TEXTO ENCIMA */
.hero-text{
    position:relative;
    max-width:500px;
}

.hero-text h2{
    font-size:40px;
    margin-bottom:10px;
}

.hero-text span{
    color:#ff7b00;
}

.hero-text p{
    font-size:18px;
}
/* SUCURSALES */
.sucursales-box{
    background:#0b2a47;
    color:white;
    margin:20px;
    padding:25px;
    border-radius:5px;
}

.sucursales-box h2{
    text-align:center;
}

.contenedor{
    display:flex;
    gap:20px;
    margin-top:20px;
}

.card{
    background:#0c3f6b;
    padding:15px;
    border-radius:15px;
    width:33%;
    text-align:center;
}

.card iframe{
    width:100%;
    height:180px;
    border:none;
    border-radius:10px;
}

.card h3{
    margin:10px 0;
}
.btn-whatsapp{
    display:inline-block;
    background:#25D366; /* VERDE WHATSAPP */
    color:white;
    padding:10px 15px;
    border-radius:8px;
    text-decoration:none;
    font-weight:bold;
    transition:0.3s;
}

.btn-whatsapp:hover{
    background:#1ebe5d; /* VERDE MÁS OSCURO */
}
.btn-whatsapp:visited{
    color:white;
}
/* SECCIÓN PORQUE ELEGIRNOS */
.porque{
    background:#f4f6f9;
    padding:50px 20px;
    text-align:center;
}

.porque h2{
    margin-bottom:30px;
    font-size:28px;
}

.contenedor-porque{
    display:flex;
    justify-content:space-between;
    gap:20px;
    flex-wrap:nowrap; /* 🔥 ESTO EVITA QUE BAJEN */
}

.item{
    width:24%; /* 4 elementos = 25% aprox */
    background:white;
    padding:20px;
    border-radius:10px;
    box-shadow:0 5px 15px rgba(0,0,0,0.1);
    text-align:center;
}

.item:hover{
    transform:translateY(-5px);
}

.item i{
    font-size:40px;
    color:#0b2a47;
    margin-bottom:10px;
}

.item h3{
    margin:10px 0;
}

.item p{
    font-size:14px;
    color:#555;
}

/* RESPONSIVE */
@media(max-width:900px){
    .item{
        width:100%;
    }
}
/* FOOTER */
.footer{
    background:#0d1b2a;
    color:white;
    padding:40px 20px 10px;
}

.footer-container{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:20px;
}

.footer-box{
    width:22%;
}

.footer-box h4{
    margin-bottom:10px;
}

.footer-box a{
    display:block;
    color:#ccc;
    text-decoration:none;
    margin:5px 0;
}

.footer-box a:hover{
    color:white;
}

/* COPYRIGHT */
.footer-copy{
    text-align:center;
    margin-top:20px;
    border-top:1px solid #444;
    padding-top:10px;
    font-size:14px;
}

/* RESPONSIVE */
@media(max-width:900px){
    .footer-box{
        width:100%;
    }
}
