/* ==========================================================================
   Fix for Jetpack Contact Form Submit Button Size
   Forces the button to be taller and more prominent for mobile tapping
   ========================================================================== */

#contact .wpcom-ai-prominent-contact-form button[type="submit"],
#contact .wpcom-ai-prominent-contact-form input[type="submit"],
#contact .wpcom-ai-prominent-contact-form .wp-block-button__link,
#contact form.contact-form .pushbutton-wide {    
    padding: 18px 24px !important;    
    min-height: 60px !important;    
    height: auto !important;    
    font-size: 18px !important;
    line-height: 1.5 !important;    
    box-sizing: border-box !important;
}

/* ==========================================================================
   Ultimate Sticky Navigation Fix (Bypasses WP Wrappers & Forces Colors)
   ========================================================================== */

/* 1. Prevent Horizontal Overflow & White Edges */
html, 
body, 
.wp-site-blocks, 
main {
    overflow-x: clip !important;
}

/* 2. Dissolve Template Part Wrapper for Native Sticky Behavior */
header.wp-block-template-part {
    display: contents !important;
}

/* 3. Force Dark Blue Background Everywhere */
.sgp-sticky-nav,
.sgp-unified-header,
.wpcom-ai-hero-nav-bar {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
    background-color: #0c1f2b !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* Offset for WordPress Admin Bar */
.admin-bar .sgp-sticky-nav,
.admin-bar .sgp-unified-header {
    top: 32px !important;
}

/* ==========================================================================
   Logo & Title Uniformity (Fixes size discrepancies)
   ========================================================================== */
.sgp-brand-mark {
    flex-shrink: 0 !important;
    align-items: center !important;
}

.sgp-brand-mark .wp-block-site-logo img {
    min-width: 36px !important;
    width: 36px !important;
    max-width: 36px !important; /* Forces strict consistency across all pages */
    height: auto !important;
    flex-shrink: 0 !important;
    display: block !important;
}

/* ==========================================================================
   Mobile Layout Adjustments (Fixes Overflow & Forces Title Wrap)
   ========================================================================== */
@media (max-width: 781px) {
    /* Compact header padding */
    .sgp-unified-header,
    .wpcom-ai-hero-nav-bar {
        padding-left: 12px !important;
        padding-right: 12px !important;
        padding-top: 14px !important;
        padding-bottom: 14px !important;
    }

    /* Tighten space between elements */
    .sgp-responsive-header-nav {
        gap: 8px !important;
    }

    /* Compact button font & padding */
    .sgp-responsive-header-nav .wp-block-button__link {
        white-space: nowrap !important;
        font-size: 11px !important;
        padding: 6px 10px !important;
        line-height: 1.2 !important;
        border-radius: 4px !important;
    }

    /* Force Title to Wrap on Mobile */
    .sgp-brand-mark .wp-block-site-title,
    .sgp-brand-mark .wp-block-site-title a {
        white-space: normal !important;
        max-width: 120px !important; /* Breaks the text into two lines */
        font-size: 13px !important;
        letter-spacing: 0.02em !important;
        line-height: 1.2 !important;
        display: inline-block !important;
    }
}

/* ==========================================================================
   Smart Header Button Visibility (Home vs Standard Pages)
   ========================================================================== */
.is-homepage-header .sgp-header-cta-btn {
    display: none !important;
}

.is-homepage-header.is-scrolled .sgp-header-cta-btn {
    display: flex !important;
    animation: sgpFadeIn 0.3s ease-out forwards;
}

.is-standard-header .sgp-header-cta-btn {
    display: flex !important;
}

@keyframes sgpFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}