/* Importación de Google Fonts: Montserrat (Títulos) y Poppins (Cuerpo) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700&family=Poppins:wght@300;400;600&display=swap');

:root {
    --oxifat-red: #dc3545; /* Rojo Vibrante para Acentos (Bootstrap 'danger') */
    --oxifat-black: #212529; /* Negro para Texto Principal */
    --oxifat-light: #f8f9fa; /* Fondo Claro */
}

/* Estilos Globales */
body {
    font-family: 'Poppins', sans-serif;
    color: var(--oxifat-black);
    background-color: var(--oxifat-light);
    line-height: 1.6;
}

h1, h2, h3, .navbar-brand {
    font-family: 'Montserrat', sans-serif;
    color: var(--oxifat-black);
    font-weight: 700;
}

/* Navbar Destacada */
.navbar-custom {
    box-shadow: 0 4px 6px -6px #222;
    background-color: rgba(255, 255, 255, 0.95); /* Ligero fondo para destacar */
}

/* CTAs y Botones (Uso de Animación en Hover) */
.btn-oxifat-primary {
    background-color: var(--oxifat-red);
    border-color: var(--oxifat-red);
    color: white;
    font-weight: 600;
    transition: transform 0.3s ease;
}

.btn-oxifat-primary:hover {
    background-color: #c82333; /* Rojo más oscuro en hover */
    border-color: #c82333;
    transform: scale(1.05); /* Animación de pulse/crecimiento */
    color: white;
}

/* Estilos de Footer y Redes Sociales (Hover Animado) */
.footer-social-icon {
    transition: color 0.3s ease, transform 0.3s ease;
    font-size: 1.5rem;
    color: #f8f9fa; /* Iconos en blanco para el footer oscuro */
}

.footer-social-icon:hover {
    color: var(--oxifat-red); /* Hover animado a rojo */
    transform: translateY(-3px) scale(1.1);
}

/* Animaciones Personalizadas para Impacto (Entrada al Scroll) */
.animated-section {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Accesibilidad: Resalta enlaces con un pequeño borde */
a:focus, button:focus {
    outline: 2px solid var(--oxifat-red);
}