:root {
    --primary-color: rgb(254, 170, 97);
}

.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

    .btn-primary:hover,
    .btn-primary:focus {
        background-color: rgba(254, 170, 97, 0.9) !important;
        border-color: rgba(254, 170, 97, 0.9) !important;
        transform: scale(1.03);
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
    }

a.text-primary {
    color: var(--primary-color) !important;
    transition: color 0.3s ease;
}

    a.text-primary:hover {
        color: rgba(254, 170, 97, 0.8) !important;
    }

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in {
    animation: fadeIn 0.6s ease-out;
}