/* Landing page fixes - April 22, 2025 */

/* Fix for use-case-card overlapping */
.use-cases-section .use-case-card {
    margin-bottom: 30px; /* Increased from 2rem */
    min-height: 250px; /* Set a minimum height to ensure consistency */
    display: flex;
    flex-direction: column;
}

/* Make paragraph text white */
p {
    color: #fff !important;
}

/* Keep hyperlinks blue but ensure buttons have correct coloring */
a {
    color: #007bff; /* Standard bootstrap blue */
}

/* Fix button styling to ensure they're visible and clickable */
.btn {
    position: relative;
    cursor: pointer !important;
    z-index: 10;
    text-decoration: none !important;
    transition: all 0.3s ease;
}

/* Ensure button text is properly colored */
.btn-primary {
    color: #fff !important;
}

.btn-outline-light {
    color: #fff !important;
}

/* Make hero-actions styling consistent across hero and CTA sections */
.hero-actions, .cta-section .hero-actions {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
}

/* "or" text styling */
.hero-actions span, .cta-section .hero-actions span {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0.5rem;
}

/* Consistent button sizing in both sections */
.cta-section .btn {
    display: inline-block;
}

/* Fix spacing in responsive layouts */
@media (max-width: 576px) {
    .hero-actions, .cta-section .hero-actions {
        justify-content: center;
    }
    
    .hero-actions .btn, .cta-section .hero-actions .btn {
        margin-bottom: 0.5rem;
        margin-right: 0 !important;
    }
    
    .hero-actions span, .cta-section .hero-actions span {
        margin: 0.5rem 0;
        display: block;
        width: 100%;
        text-align: center;
    }
}

/* Fix button hover states */
.cta-section .btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

/* Fix Chrome button styling */
.btn-chrome {
    background-color: #4285F4 !important;
    border-color: #4285F4 !important;
    color: #fff !important;
}

.btn-chrome:hover {
    background-color: #1a73e8 !important;
    border-color: #1a73e8 !important;
}

/* Ensure certain paragraph text that should be a different color isn't affected */
.text-muted, .small, footer p.text-muted, .text-secondary, .card-subtitle {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Ensure proper vertical spacing */
.use-cases-section .row {
    margin-bottom: 20px;
}

/* Ensure the content is properly aligned */
.use-case-card .use-case-icon {
    align-self: center;
}

.use-case-card h3 {
    margin-top: 10px;
}

/* Add more space at the bottom of the row */
.use-cases-section .row > div {
    margin-bottom: 20px;
}

/* Make sure text isn't cut off at the bottom */
.use-case-card p {
    margin-bottom: 15px;
}

/* Create more spacing between sections for better visual separation */
.use-cases-section {
    padding-bottom: 120px;
}

/* Ensure buttons have consistent styling */
.btn {
    border-width: 2px;
}

.btn-outline-light {
    border-color: rgba(255, 255, 255, 0.5);
}

.btn-primary {
    border-color: #677f82;
}