body {
    font-family: 'Poppins', sans-serif;
    background-color: #f8fafc; /* gray-50 */
    color: #1e293b; /* slate-800 */
}
/* Custom styles for a professional look */
.royal-blue-bg { background-color: #0A2463; }
.royal-blue-text { color: #0A2463; }
.light-blue-bg { background-color: #E2E8F0; } /* slate-200 */
.btn-primary {
    background-color: #1D4ED8; /* blue-600 */
    color: white;
    transition: background-color 0.3s ease, transform 0.3s ease;
}
.btn-primary:hover {
    background-color: #1E3A8A; /* blue-800 */
    transform: translateY(-2px);
}
.card {
    background-color: white;
    border-radius: 0.75rem;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
/* Se elimina el :hover de CSS para que GSAP lo controle */
/*
.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
*/
/* For GSAP animations */
.reveal-up {
    opacity: 0;
    transform: translateY(40px);
    visibility: hidden;
}

/* Estilos para el video de fondo */
#home video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;
    transform: translateX(-50%) translateY(-50%);
    object-fit: cover;
}

/* *** NUEVO ESTILO PARA LA GOTA DEL LOGO (TAMAÑO INTERMEDIO) *** */
.logo-drop {
    width: 8px; /* De vuelta a 8px */
    height: 8px; /* De vuelta a 8px */
    background-color: #FBBF24; /* color 'amber-400' de Tailwind, para la gota amarilla */
    border-radius: 50% 50% 50% 0; /* Crea la forma de lágrima */
    transform: rotate(45deg);
    margin-top: 5px; /* De vuelta a 5px */
    margin-left: 1px; /* Ajuste ligero para centrar */
}