/* Overflow Fix for Mobile */
html {
    overflow-x: hidden !important;
    width: 100% !important;
}

body {
    overflow-x: hidden !important;
    width: 100% !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Container elements */
.navbar,
.nav-container,
.hero,
.features,
.faq,
.connect,
.footer,
.footer-container,
.policy-section,
.contact-page {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* Fix animated background elements */
.background-animation {
    width: 100% !important;
    max-width: 100vw !important;
    overflow: hidden !important;
}

.orb {
    position: absolute !important;
    max-width: 50vw !important;
}

/* Fix token container */
.token-container {
    max-width: 80vw !important;
    max-height: 80vw !important;
}

/* Fix mesh gradient */
.mesh-gradient {
    width: 100% !important;
    max-width: 100vw !important;
}

/* Mobile specific fixes */
@media (max-width: 768px) {
    /* Reset all padding that might cause overflow */
    .nav-container,
    .hero,
    .features,
    .faq,
    .connect,
    .footer,
    .policy-section,
    .contact-page {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    
    /* Fix hero pseudo element */
    .hero::before {
        width: 100vw !important;
        max-width: 100vw !important;
        left: 0 !important;
        transform: none !important;
    }
    
    /* Ensure grids don't overflow */
    .features-grid,
    .faq-grid,
    .contact-content {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Fix buttons */
    .btn-primary,
    .btn-secondary,
    .nav-cta {
        max-width: 100% !important;
    }
    
    /* Fix forms */
    .email-form,
    .contact-form {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Hide orbs that extend beyond viewport */
    .orb-1 { left: -50px !important; }
    .orb-2 { right: -50px !important; }
    .orb-3 { left: 10% !important; }
    
    /* Token container mobile */
    .token-container {
        width: 350px !important;
        height: 350px !important;
        max-width: 90vw !important;
        max-height: 90vw !important;
    }
}

/* Debug: Add red border to any overflowing element */
/* Uncomment to debug */
/*
* {
    outline: 1px solid red;
}
*/