/* Custom styles for enhanced UX and animations */

/* Smooth transitions for all interactive elements */
a, button {
    transition: all 0.3s ease;
}

/* Image hover effect */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
    transform: translateY(-6px);
}

/* Stripe button styling wrapper */
.stripe-button-wrapper {
    padding: 8px 0;
}

.stripe-button-wrapper stripe-buy-button {
    display: block;
    margin: 0 auto;
}

/* Email button hover effects */
a[href^="mailto:"] {
    text-decoration: none;
}

/* Smooth scroll behavior */
html {
    scroll-behavior: smooth;
}

/* Subtle background animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Apply fade-in animation to main content */
main > div {
    animation: fadeIn 0.6s ease;
}

/* Better focus states for accessibility */
a:focus,
button:focus {
    outline: 2px solid #1e40af;
    outline-offset: 2px;
}

/* Section spacing */
section {
    scroll-margin-top: 80px;
}