body {
            font-family: 'Poppins', sans-serif;
            line-height: 1.6;
            background-color: #faf8f8;
            color: #333;
        }

        .navbar {
            background-color: #ffd700;
            padding: 15px;
            position: sticky;
            top: 0;
            z-index: 1000;
        }

        .navbar-brand {
            color: #141313;
            font-size: 1.8rem;
            font-weight: bold;
        }

        .navbar-nav .nav-link {
            color: #020101;
            margin-right: 20px;
            display: flex;
            align-items: center;
        }

        .navbar-nav .nav-link:hover {
            color: #d20707;
        }

        .hero {
            background: url('../img/Baner\ principal.png') no-repeat center center/cover;
            height: 90vh;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #c6b30a;
            text-align: center;
        }

        .hero h1 {
            font-size: 3.5rem;
            margin-bottom: 20px;
        }

        .hero p {
            font-size: 1.2rem;
        }

        .section {
            padding: 60px 0;
        }

        .section h2 {
            font-size: 2.5rem;
            text-align: center;
            margin-bottom: 40px;
        }

        .about-content {
            display: flex;
            align-items: center;
            gap: 20px;
        }

        .about-content img {
            max-width: 100%;
            border-radius: 10px;
        }

        .btn-call {
            background-color: #ffd700;
            color: #000;
            padding: 10px 20px;
            font-size: 1rem;
            border-radius: 5px;
            border: none;
            cursor: pointer;
        }

        .btn-call:hover {
            background-color: #44ae06;
        }

        .contact-info i {
            font-size: 1.5rem;
            color: #ffd700;
            margin-right: 10px;
        }

        .social-icons a {
            color:#ffd700;
            font-size: 1.5rem;
            margin-right: 15px;
            text-decoration: none;
        }

        .social-icons a:hover {
            color: #eeeff0;
        }

        footer {
            background-color: #f8fafb;
            color: #fff;
            text-align: center;
            padding: 20px 0;
        }

        footer a {
            color: #ffd700;
            text-decoration: none;
        }
        .icon-box i {
       font-size: 4rem; /* Tamaño más grande del icono */
       color: #131313; /* Color del icono */
       margin-bottom: 15px; /* Espaciado entre el icono y el título */
       transition: transform 0.3s ease; /* Transición suave al pasar el mouse */
        }

.icon-box:hover i {
    transform: scale(1.1); /* Efecto de agrandamiento al pasar el mouse */
}

.icon-box h3 {
    font-size: 1.5rem; /* Ajuste del tamaño del título */
    margin-top: 10px; /* Espaciado superior para mantener la proporción */
}

.icon-box p {
    font-size: 1rem; /* Ajuste del tamaño del texto */
    line-height: 1.5; /* Espaciado entre líneas */
    margin-top: 10px; /* Espaciado superior */
}

/*ajuste botones del NAV*/
.translate-button {
    padding: 10px 20px; /* Tamaño uniforme */
    font-size: 1rem; /* Tamaño de texto */
    font-weight: bold; /* Texto en negrita */
    border: none; /* Sin bordes */
    border-radius: 5px; /* Bordes redondeados */
    color: #fff; /* Color del texto */
    text-align: center;
    cursor: pointer; /* Cursor interactivo */
    transition: background-color 0.3s ease; /* Transición suave */
}

/* Botón rojo */
.red-button {
    background-color: #ff4d4d;
}

.red-button:hover {
    background-color: #e03c3c;
}

/* Botón verde */
.green-button {
    background-color: #28a745;
}

.green-button:hover {
    background-color: #218838;
}

/* Botón azul */
.blue-button {
    background-color: #007bff;
}

.blue-button:hover {
    background-color: #0056b3;
}
/*boton de whatsapp*/
.whatsapp-button {
    position: fixed;
    bottom: 20px; /* Espaciado desde abajo */
    right: 70px; /* Espaciado desde la derecha */
    width: 60px; /* Tamaño del botón */
    height: 60px; /* Tamaño del botón */
    background-color: #25d366; /* Color de WhatsApp */
    color: white; /* Color del ícono */
    border-radius: 50%; /* Botón redondo */
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra */
    text-decoration: none; /* Sin subrayado */
    z-index: 1000; /* Asegura que quede arriba de otros elementos */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.whatsapp-button:hover {
    transform: scale(1.1); /* Efecto de zoom al pasar el cursor */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); /* Sombra al pasar el cursor */
}

.whatsapp-button i {
    font-size: 2rem; /* Tamaño del ícono */
}



        @media (max-width: 768px) {
            .about-content {
                flex-direction: column;
            }
        }