/* ===================================
   HERO BUTTON CONTRAST FIXES
   Addresses contrast issues with the second hero button
   =================================== */

/* Fix the second hero button (theme-btn6) contrast issues */
.hero5 .theme-btn6 {
    /* Ensure solid white background for better contrast */
    background: var(--had-white) !important;
    color: var(--had-primary-blue) !important;
    border: 2px solid var(--had-white) !important;
    
    /* Add shadow for better definition */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    
    /* Ensure text is bold and readable */
    font-weight: 600 !important;
    text-shadow: none !important;
    
    /* Ensure proper spacing and sizing */
    padding: 14px 28px !important;
    font-size: 16px !important;
    
    /* Smooth transitions */
    transition: all 0.3s ease !important;
}

.hero5 .theme-btn6:hover {
    /* Reverse colors on hover for clear feedback */
    background: var(--had-primary-blue) !important;
    color: var(--had-white) !important;
    border-color: var(--had-primary-blue) !important;
    
    /* Enhanced shadow on hover */
    box-shadow: 0 5px 15px rgba(30, 95, 153, 0.3) !important;
    
    /* Subtle lift effect */
    transform: translateY(-2px) !important;
}

/* Ensure the first hero button (theme-btn7) also has proper contrast */
.hero5 .theme-btn7 {
    background: var(--had-primary-orange) !important;
    color: var(--had-white) !important;
    border: 2px solid var(--had-primary-orange) !important;
    
    /* Add shadow for consistency */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    
    /* Ensure text is bold and readable */
    font-weight: 600 !important;
    text-shadow: none !important;
    
    /* Ensure proper spacing and sizing */
    padding: 14px 28px !important;
    font-size: 16px !important;
    
    /* Smooth transitions */
    transition: all 0.3s ease !important;
}

.hero5 .theme-btn7:hover {
    /* Darken orange on hover */
    background: var(--had-orange-dark) !important;
    color: var(--had-white) !important;
    border-color: var(--had-orange-dark) !important;
    
    /* Enhanced shadow on hover */
    box-shadow: 0 5px 15px rgba(255, 102, 0, 0.3) !important;
    
    /* Subtle lift effect */
    transform: translateY(-2px) !important;
}

/* Ensure button text spans inherit the correct colors */
.hero5 .theme-btn6 .text {
    color: inherit !important;
    opacity: 1 !important;
}

.hero5 .theme-btn7 .text {
    color: inherit !important;
    opacity: 1 !important;
}

/* Ensure arrow icons inherit the correct colors */
.hero5 .theme-btn6 .arrow1 i,
.hero5 .theme-btn6 .arrow2 i {
    color: inherit !important;
}

.hero5 .theme-btn7 .arrow1 i,
.hero5 .theme-btn7 .arrow2 i {
    color: inherit !important;
}

/* Focus states for accessibility */
.hero5 .theme-btn6:focus {
    outline: 3px solid var(--had-primary-orange) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(255, 102, 0, 0.3) !important;
}

.hero5 .theme-btn7:focus {
    outline: 3px solid var(--had-white) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.3) !important;
}

/* Active states */
.hero5 .theme-btn6:active,
.hero5 .theme-btn7:active {
    transform: translateY(0) !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .hero5 .theme-btn6,
    .hero5 .theme-btn7 {
        padding: 12px 24px !important;
        font-size: 14px !important;
        margin-bottom: 10px !important;
    }
    
    /* Stack buttons vertically on mobile */
    .hero5 .buttons {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }
    
    .hero5 .theme-btn6 {
        margin-left: 0 !important;
    }
}

@media (max-width: 576px) {
    .hero5 .theme-btn6,
    .hero5 .theme-btn7 {
        width: 100% !important;
        text-align: center !important;
        justify-content: center !important;
    }
}

/* Ensure buttons are visible and accessible */
.hero5 .buttons .theme-btn6,
.hero5 .buttons .theme-btn7 {
    position: relative !important;
    z-index: 10 !important;
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
}

/* Remove any potential transparent overlays that might affect readability */
.hero5 .buttons::before,
.hero5 .buttons::after {
    display: none !important;
}