/* Custom Responsive Fixes */
@media screen and (max-width: 768px) {
    body, html {
        overflow-x: hidden;
        width: 100%;
        margin: 0;
        padding: 0;
    }

    /* Fix image overflow */
    img, video, iframe {
        max-width: 100% !important;
        height: auto !important;
    }

    /* Adjust font sizes for smaller screens */
    h1 {
        font-size: 2.2rem !important;
        line-height: 1.2 !important;
    }
    h2 {
        font-size: 1.8rem !important;
        line-height: 1.3 !important;
    }
    h3 {
        font-size: 1.5rem !important;
    }
    p, span, li, a {
        font-size: 1rem !important;
        line-height: 1.5 !important;
    }

    /* Fix column padding and stacking */
    .c-row > .inner {
        flex-direction: column !important;
        gap: 20px !important;
    }
    
    .c-column {
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Fix sections */
    .c-section {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* Form fields and buttons */
    input, select, textarea, button {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    
    /* Spacing adjustments */
    .mt-10, .mt-20, .mt-8 {
        margin-top: 15px !important;
    }
    .mb-10, .mb-16 {
        margin-bottom: 15px !important;
    }
}