body {
    font-family: 'Lato', sans-serif;
    background-color: #f3f4f6;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    color: #4b5563;
}

.btn-green-gradient {
    background: linear-gradient(180deg, #44b649 0%, #209923 100%);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-blue-gradient {
    background: linear-gradient(180deg, #60a5fa 0%, #3b82f6 100%);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-green-gradient:hover,
.btn-blue-gradient:hover {
    transform: translateY(-2px);
}

.bg-custom-dark-blue {
    background-color: #3b82f6;
}

.progress-dot {
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 9999px;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
    transition-property: background-color;
    transition-duration: 500ms;
}