@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Custom gradient for hero */
.gradient-bg {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

/* Pulse animation for CTA */
@keyframes pulse-border {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(102, 126, 234, 0.7);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(102, 126, 234, 0);
    }
}

.pulse-on-hover:hover {
    animation: pulse-border 1.5s infinite;
}

/* Newsletter cards hover effect */
.newsletter-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.newsletter-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}

/* Prose heading styles */
.prose h1 {
    font-size: 2.25em;
    font-weight: 800;
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: 0.8888889em;
    color: #111827;
}

.prose h2 {
    font-size: 1.5em;
    font-weight: 700;
    line-height: 1.3333333;
    margin-top: 2em;
    margin-bottom: 1em;
    color: #111827;
}

.prose h3 {
    font-size: 1.25em;
    font-weight: 600;
    line-height: 1.6;
    margin-top: 1.6em;
    margin-bottom: 0.6em;
    color: #111827;
}

.prose h4 {
    font-size: 1.125em;
    font-weight: 600;
    line-height: 1.5555556;
    margin-top: 1.5555556em;
    margin-bottom: 0.4444444em;
    color: #111827;
}

.prose h5 {
    font-size: 1em;
    font-weight: 600;
    line-height: 1.6;
    margin-top: 1.2em;
    margin-bottom: 0.6em;
    color: #111827;
}

.prose strong {
    font-weight: 600;
    color: #111827;
}

/* Sticky CTA Bar */
.sticky-cta-bar {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 50;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    transform: translateY(100%);
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
    opacity: 0;
    pointer-events: none;
}

.sticky-cta-bar.visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

/* Add padding to body to prevent content from being hidden behind sticky bar */
body.has-sticky-cta {
    padding-bottom: 80px;
}

@media (min-width: 640px) {
    body.has-sticky-cta {
        padding-bottom: 70px;
    }
}

/* Ensure responsive display utilities override hidden class */
@media (min-width: 1024px) {
    .hidden.lg\:flex {
        display: flex !important;
    }
    
    .lg\:hidden {
        display: none !important;
    }
}