/* css/style.css */

/* Este archivo es para estilos personalizados que quieras añadir
   además de los que provee Tailwind CSS. */

/* Ejemplo de un estilo personalizado: */
.hero-bg {
    background-image: url('https://placehold.co/1920x1080/A0AEC0/FFFFFF?text=Playa+de+San+Clemente');
    background-size: cover;
    background-position: center;
}

/* Animación suave para las tarjetas al pasar el mouse */
.card-hover-effect {
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.card-hover-effect:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Estilo para el menú de navegación activo */
.nav-link-active {
    color: #3b82f6; /* Un azul para destacar */
    font-weight: 600;
}