/* ============================================
   UNIVERSAL MOBILE RESPONSIVE FIXES
   Optimized single file for all pages
   Based on index.html approach
   ============================================ */

.mobile-only {
    display: none !important;
}

/* Apply to all pages on mobile */
@media screen and (max-width: 768px) {
    /* Prevent horizontal scroll */
    html {
        overflow-x: hidden !important;
        width: 100% !important;
    }
    
    body {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
    }
    
    /* Force all grid layouts to stack */
    *[style*="display: grid"],
    *[style*="grid-template-columns"],
    .grid-2,
    .grid-3,
    .grid-4,
    .business-content,
    .what-is-item,
    .what-is-reverse,
    .service-content,
    .accounting-content,
    .more-services-container,
    .cta-wrapper,
    .page-hero-wrapper,
    /* Legal Entity specific grids */
    .legal-intro-grid,
    .legal-content-grid,
    .legal-card-content,
    .legal-actions-grid,
    /* Tax Preparation specific grids */
    .tax-intro-grid,
    .income-tax-content,
    .tax-process-content,
    .types-income-content,
    .hero-content {
        display: block !important;
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }
    
    /* Service grids - single column on mobile */
    .services-grid,
    .expect-grid,
    .tax-services-grid,
    .benefits-grid,
    .use-cases-grid,
    .features-grid,
    .testimonials-grid,
    .services-overview-grid,
    .tax-types-grid,
    .success-stats,
    .about-us-stats {
        display: block !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    
    /* Ensure all containers are full width */
    .container,
    *[class*="container"] {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box !important;
    }
    
    /* Fix all images */
    img {
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    
    /* Header and Logo Images */
    .logo img,
    .logo-image,
    .admin-logo {
        max-width: 150px !important;
        width: auto !important;
        height: auto !important;
    }
    
    /* Content Images */
    section img,
    .intro-images img,
    .services-images img,
    .why-need-images img,
    .documents-images img,
    .benefits-images img,
    .legal-intro-images img,
    .legal-content-images-multi img,
    .legal-card-image img,
    .tax-intro-images img,
    .tax-services-images img,
    .tax-process-images img,
    .tax-process-image img {
        width: 100% !important;
        height: auto !important;
        max-height: 250px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
        margin-bottom: 15px !important;
    }
    
    /* Hero Section Images */
    .hero img,
    .agent-hero img,
    .compliance-hero img,
    .documents-hero img,
    .ip-hero img,
    .mnc-hero img {
        width: 100% !important;
        height: auto !important;
        max-height: 300px !important;
        object-fit: cover !important;
    }
    
    /* Hero Sections */
    .hero,
    .agent-hero,
    .compliance-hero,
    .documents-hero,
    .ip-hero,
    .mnc-hero,
    .partnership-hero,
    .legal-hero-banner,
    .tax-hero-banner {
        min-height: 300px !important;
        height: 300px !important;
        padding: 60px 15px !important;
        background-attachment: scroll !important;
        text-align: center !important;
    }
    
    /* Hero Titles */
    .hero h1,
    .agent-hero h1,
    .compliance-hero h1,
    .documents-hero h1,
    .ip-hero h1,
    .mnc-hero h1,
    .partnership-hero h1,
    .legal-hero-title,
    .tax-hero-title {
        font-size: 36px !important;
        line-height: 1.1 !important;
        letter-spacing: 1px !important;
        text-align: center !important;
        padding: 0 10px !important;
        margin-bottom: 20px !important;
    }
    
    /* Card Images */
    .service-card img,
    .benefit-item img,
    .reason-card img,
    .document-card img,
    .requirement-card img,
    .type-card img,
    .legal-action-card img {
        width: 100% !important;
        height: auto !important;
        max-height: 200px !important;
        object-fit: cover !important;
    }
    
    /* Team/Profile Images */
    .team-member-card img,
    .member-image img,
    .profile-image img {
        width: 100% !important;
        max-width: 300px !important;
        height: auto !important;
        margin: 0 auto !important;
    }
    
    /* Responsive typography */
    h1, h1[style] {
        font-size: 28px !important;
        line-height: 1.2 !important;
    }
    
    h2, h2[style],
    .legal-section-title,
    .legal-section-title-center,
    .legal-actions-title,
    .tax-section-title,
    .tax-section-title-center,
    .section-header h2,
    .expect-main-title {
        font-size: 24px !important;
        line-height: 1.3 !important;
        text-align: center !important;
        margin-bottom: 20px !important;
    }
    
    h3, h3[style] {
        font-size: 20px !important;
        line-height: 1.3 !important;
    }
    
    h4, h4[style] {
        font-size: 18px !important;
    }
    
    p, li, span,
    .legal-description,
    .legal-actions-note,
    .tax-description,
    .section-header p {
        font-size: 15px !important;
        line-height: 1.6 !important;
        text-align: center !important;
        margin-bottom: 15px !important;
    }
    
    /* Section padding */
    section,
    section[style*="padding"],
    .legal-intro-section,
    .legal-actions-section,
    .legal-content-section,
    .tax-intro-section,
    .tax-services-section,
    .tax-process-section,
    .benefits-section,
    .process-section {
        padding: 40px 0 !important;
    }
    
    /* Cards */
    .service-card,
    .benefit-item,
    .reason-card,
    .document-card,
    .legal-action-card,
    .legal-content-card,
    .tax-process-card,
    .process-step {
        padding: 20px 15px !important;
        margin: 0 0 15px !important;
        border-radius: 12px !important;
        text-align: center !important;
        display: block !important;
    }
    
    /* Card Icons */
    .service-icon,
    .legal-action-icon,
    .card-icon {
        font-size: 2.5rem !important;
        margin-bottom: 15px !important;
    }
    
    /* Card Titles */
    .service-card h3,
    .legal-action-card h3,
    .legal-card-title,
    .process-title {
        font-size: 18px !important;
        line-height: 1.3 !important;
        margin-bottom: 15px !important;
    }
    
    /* Fix white boxes and cards */
    *[style*="background: white"],
    *[style*="background: #fff"],
    *[style*="background: #ffffff"] {
        padding: 20px !important;
        margin: 10px 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Remove max-width constraints */
    *[style*="max-width"] {
        max-width: 100% !important;
    }
    
    /* Fix gaps */
    *[style*="gap"] {
        gap: 20px !important;
    }
    
    /* Buttons full width */
    button,
    .btn,
    a.btn,
    .legal-btn,
    .btn-primary,
    .btn-secondary,
    .btn-book-process,
    *[style*="background"][style*="padding"][style*="border-radius"] {
        width: 100% !important;
        max-width: 300px !important;
        display: block !important;
        text-align: center !important;
        padding: 15px 20px !important;
        margin: 15px auto !important;
        font-size: 15px !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
        min-height: 44px !important;
        touch-action: manipulation !important;
    }
    
    /* Back-to-top button: override the global button rule so the circle + icon stays perfectly centred */
    button.back-to-top,
    .back-to-top {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        min-height: 44px !important;
        border-radius: 50% !important;
        padding: 0 !important;
        margin: 0 !important;
        position: fixed !important;
        bottom: 20px !important;
        right: 20px !important;
        box-sizing: content-box !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    /* Icon inside back-to-top: reset any inherited margin/size that shifts it off-center */
    .back-to-top i,
    .back-to-top .fas {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 16px !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
        text-align: center !important;
    }
    

    /* Hero buttons */
    .hero-buttons {
        display: block !important;
        gap: 15px !important;
        text-align: center !important;
    }
    
    /* Stats */
    .hero-stats,
    .tax-stats-row {
        display: block !important;
        gap: 20px !important;
        text-align: center !important;
    }
    
    .stat-item {
        margin-bottom: 20px !important;
        text-align: center !important;
    }
    
    .stat-number {
        font-size: 2rem !important;
    }
    
    .stat-label {
        font-size: 14px !important;
    }
    
    /* Hero Card */
    .hero-card {
        padding: 25px 20px !important;
        margin: 20px 15px !important;
        text-align: center !important;
    }
    
    /* Lists */
    .legal-list {
        padding: 0 20px !important;
        margin: 0 0 20px !important;
    }
    
    .legal-list li {
        font-size: 14px !important;
        line-height: 1.6 !important;
        padding: 6px 0 6px 20px !important;
        text-align: left !important;
    }
    
    .legal-list-title {
        font-size: 18px !important;
        text-align: center !important;
        margin: 20px 0 15px !important;
    }
    
    /* FAQ Section */
    .faq-container {
        max-width: 100% !important;
        padding: 0 15px !important;
    }
    
    .faq-item {
        margin-bottom: 15px !important;
    }
    
    .faq-question {
        font-size: 16px !important;
        padding: 15px !important;
    }
    
    .faq-answer {
        font-size: 14px !important;
        padding: 15px !important;
    }
    
    /* CTA Section */
    .cta-content {
        max-width: 100% !important;
        padding: 0 15px !important;
        text-align: center !important;
    }
    
    .cta-title,
    .cta-content h2 {
        font-size: 24px !important;
        margin-bottom: 20px !important;
    }
    
    .cta-description {
        font-size: 15px !important;
        margin-bottom: 25px !important;
    }
}

/* Extra small screens */
@media screen and (max-width: 480px) {
    /* Hero sections extra small */
    .hero,
    .agent-hero,
    .compliance-hero,
    .documents-hero,
    .ip-hero,
    .mnc-hero,
    .partnership-hero,
    .legal-hero-banner,
    .tax-hero-banner {
        height: 250px !important;
        padding: 50px 10px !important;
    }
    
    /* Hero titles extra small */
    .hero h1,
    .agent-hero h1,
    .compliance-hero h1,
    .documents-hero h1,
    .ip-hero h1,
    .mnc-hero h1,
    .partnership-hero h1,
    .legal-hero-title,
    .tax-hero-title {
        font-size: 28px !important;
        padding: 0 5px !important;
    }
    
    h1, h1[style] {
        font-size: 24px !important;
    }
    
    h2, h2[style],
    .legal-section-title,
    .legal-section-title-center,
    .legal-actions-title,
    .tax-section-title,
    .tax-section-title-center,
    .section-header h2,
    .expect-main-title {
        font-size: 20px !important;
    }
    
    h3, h3[style] {
        font-size: 18px !important;
    }
    
    p, li, span,
    .legal-description,
    .legal-actions-note,
    .tax-description,
    .section-header p {
        font-size: 14px !important;
    }
    
    section,
    section[style*="padding"],
    .legal-intro-section,
    .legal-actions-section,
    .legal-content-section,
    .tax-intro-section,
    .tax-services-section,
    .tax-process-section,
    .benefits-section,
    .process-section {
        padding: 30px 0 !important;
    }
    
    .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* Extra small logo */
    .logo img,
    .logo-image,
    .admin-logo {
        max-width: 110px !important;
    }
    
    /* Cards extra small */
    .service-card,
    .benefit-item,
    .reason-card,
    .document-card,
    .legal-action-card,
    .legal-content-card,
    .tax-process-card,
    .process-step {
        padding: 18px 12px !important;
        margin: 0 0 12px !important;
    }
    
    /* Icons extra small */
    .service-icon,
    .legal-action-icon,
    .card-icon {
        font-size: 2rem !important;
        margin-bottom: 12px !important;
    }
    
    /* Buttons extra small */
    button,
    .btn,
    a.btn,
    .legal-btn,
    .btn-primary,
    .btn-secondary,
    .btn-book-process {
        max-width: 280px !important;
        padding: 12px 18px !important;
        font-size: 14px !important;
    }
    
    /* Images extra small */
    section img,
    .intro-images img,
    .services-images img,
    .legal-intro-images img,
    .legal-content-images-multi img,
    .tax-intro-images img,
    .tax-services-images img,
    .tax-process-images img {
        max-height: 200px !important;
    }
    
    /* Stats extra small */
    .stat-number {
        font-size: 1.75rem !important;
    }
    
    .stat-label {
        font-size: 13px !important;
    }
    
    /* Hero card extra small */
    .hero-card {
        padding: 20px 15px !important;
        margin: 15px 10px !important;
    }
    
    /* Lists extra small */
    .legal-list {
        padding: 0 15px !important;
    }
    
    .legal-list li {
        font-size: 13px !important;
        padding: 5px 0 5px 18px !important;
    }
    
    .legal-list-title {
        font-size: 16px !important;
    }
    
    /* FAQ extra small */
    .faq-question {
        font-size: 15px !important;
        padding: 12px !important;
    }
    
    .faq-answer {
        font-size: 13px !important;
        padding: 12px !important;
    }
    
    /* CTA extra small */
    .cta-title,
    .cta-content h2 {
        font-size: 20px !important;
    }
    
    .cta-description {
        font-size: 14px !important;
    }
}

/* ============================================
   FORCE VISIBILITY - HIGHEST PRIORITY
   ============================================ */

/* Ensure content is always visible with maximum specificity */
html body section,
html body .legal-intro-section,
html body .legal-actions-section,
html body .legal-content-section,
html body .tax-intro-section,
html body .tax-services-section,
html body .tax-process-section,
html body .benefits-section,
html body .process-section {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 1 !important;
}

html body .container {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Force mobile layouts with maximum specificity */
@media screen and (max-width: 768px) {
    html body .legal-intro-section .container .legal-intro-grid,
    html body .legal-content-section .container .legal-content-grid,
    html body .legal-content-section .container .legal-content-card .legal-card-content,
    html body .legal-actions-section .container .legal-actions-grid,
    html body .tax-intro-section .container .tax-intro-grid,
    html body .tax-services-section .container .income-tax-content,
    html body .tax-process-section .container .tax-process-content,
    html body .benefits-section .container .types-income-content,
    html body .hero-section .container .hero-content {
        display: block !important;
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }
    
    html body .tax-services-section .container .services-grid,
    html body .process-section .container .expect-grid,
    html body .tax-services-section .container .tax-services-grid,
    html body .benefits-section .container .benefits-grid {
        display: block !important;
        grid-template-columns: 1fr !important;
        max-width: 400px !important;
        margin: 0 auto !important;
    }
}

/* ============================================
   NAVIGATION BUTTONS - FORCE VISIBILITY
   ============================================ */

/* Navigation wrapper fixes */
.nav-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    position: relative !important;
    overflow: visible !important;
}

/* Ensure navigation buttons are always visible */
.nav-auth-buttons {
    display: flex !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
    align-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.nav-auth-buttons.active {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.btn-signin,
.btn-register,
.btn-schedule-call {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    position: relative !important;
    z-index: 10 !important;
}

/* Mobile navigation buttons */
@media screen and (max-width: 768px) {
    /* Ensure nav wrapper has proper layout */
    .nav-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        flex-wrap: nowrap !important;
        overflow: visible !important;
    }
    
    /* Ensure hamburger doesn't interfere */
    .hamburger {
        order: 3 !important;
        flex-shrink: 0 !important;
        margin-left: 10px !important;
        align-self: center !important;
    }
    
    /* Logo positioning */
    .logo {
        order: 1 !important;
        flex-shrink: 0 !important;
    }
    
    /* Navigation buttons positioning */
    .nav-auth-buttons {
        order: 2 !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex-shrink: 0 !important;
        position: static !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin-left: auto !important;
        margin-right: 10px !important;
    }
    
    .nav-auth-buttons.active {
        display: flex !important;
        align-items: center !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: static !important;
    }
    
    .btn-signin,
    .btn-register {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        padding: 8px 16px !important;
        font-size: 13px !important;
        border-radius: 4px !important;
        text-decoration: none !important;
        font-weight: 500 !important;
        transition: all 0.3s !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        position: relative !important;
        z-index: 10 !important;
    }
    
    .btn-signin {
        background: transparent !important;
        color: #333 !important;
        border: 1px solid #ddd !important;
    }
    
    .btn-register {
        background: #00d4ff !important;
        color: #1a1a1a !important;
        border: 1px solid #00d4ff !important;
    }
    
    .btn-schedule-call {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        padding: 8px 16px !important;
        font-size: 13px !important;
        background: #007bff !important;
        color: white !important;
        border-radius: 4px !important;
        text-decoration: none !important;
        align-items: center !important;
        gap: 5px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        position: relative !important;
        z-index: 10 !important;
    }
    
    /* Force visibility even when nav menu is active */
    .nav-menu.active ~ .nav-auth-buttons {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Hide office hours on mobile to save space */
    .nav-office-hours {
        display: none !important;
    }
    
    /* Reset margins and paddings for navbar items and hamburger spans messed up by global p, li, span rules */
    .navbar li,
    .navbar span,
    .navbar i,
    .hamburger span {
        margin-bottom: 0 !important;
    }
    
    .nav-menu li {
        padding: 0 !important;
        margin-bottom: 0 !important;
    }
    
    .nav-menu a {
        text-align: left !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }
    
    /* Mobile Content Fixes */

    /* 1. What Is EPA Title - fix span/highlight-blue to match parent font-size.
          The global `span { font-size: 15px }` was making "EPA - EVOLVE" text tiny. */
    .what-is-main-title {
        font-size: 22px !important;
        line-height: 1.4 !important;
        text-align: center !important;
        margin-bottom: 25px !important;
    }

    .what-is-main-title .highlight-blue,
    .what-is-main-title span {
        font-size: 22px !important;
        line-height: 1.4 !important;
        color: #60a5fa !important;
        display: inline !important;
        margin-bottom: 0 !important;
        text-align: inherit !important;
    }

    /* 2. What Is content - center headings and icons */
    .what-is-content h3,
    .service-detail-text h3 {
        text-align: center !important;
        font-size: 20px !important;
        margin-bottom: 12px !important;
    }

    .what-is-icon {
        margin: 0 auto 20px auto !important;
    }

    /* 3. Learn More button - center align */
    .learn-more-link {
        display: block !important;
        text-align: center !important;
        margin: 12px auto 0 auto !important;
        width: fit-content !important;
    }

    /* 4. Accordion header - fix flex layout (global button rule forces display:block which breaks it) */
    .accordion-header,
    button.accordion-header {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 18px 0 !important;
        gap: 10px !important;
        text-align: left !important;
        border-radius: 0 !important;
        min-height: unset !important;
        margin: 0 auto !important;
        background: transparent !important;
        border: none !important;
        cursor: pointer !important;
    }

    .accordion-number {
        font-size: 22px !important;
        min-width: 42px !important;
        flex-shrink: 0 !important;
        margin-bottom: 0 !important;
    }

    .accordion-title {
        flex: 1 !important;
        font-size: 15px !important;
        text-align: left !important;
        margin-bottom: 0 !important;
        line-height: 1.4 !important;
    }

    /* Accordion dropdown arrow - push to far right edge */
    .accordion-icon {
        font-size: 13px !important;
        flex-shrink: 0 !important;
        margin-left: auto !important;
        margin-bottom: 0 !important;
        align-self: center !important;
    }

    /* Accordion content - reduce large left indent */
    .accordion-content {
        padding: 0 0 0 52px !important;
    }

    .accordion-item.active .accordion-content {
        padding: 0 0 16px 52px !important;
    }

    .accordion-content p {
        font-size: 14px !important;
        text-align: left !important;
        margin-bottom: 0 !important;
    }

    /* 5. Accounting section - centered layout */
    .accounting-subtitle {
        text-align: center !important;
        font-size: 20px !important;
        margin-bottom: 15px !important;
    }

    .accounting-description {
        text-align: center !important;
        margin-bottom: 15px !important;
    }

    .accounting-feature {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        margin-bottom: 30px !important;
        gap: 12px !important;
    }

    .accounting-feature .feature-icon-box {
        margin: 0 auto !important;
        background: #00d4ff !important;
        box-shadow: 0 4px 10px rgba(0, 212, 255, 0.3) !important;
    }

    .accounting-feature .feature-text {
        text-align: center !important;
    }

    .accounting-feature .feature-text h4 {
        text-align: center !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        margin-bottom: 6px !important;
        color: #1e3a8a !important;
    }

    .accounting-feature .feature-text p {
        text-align: center !important;
        font-size: 14px !important;
        color: #4b5563 !important;
        margin-bottom: 0 !important;
        line-height: 1.5 !important;
    }

    /* Testimonials Slider Alignment fixes */
    .homepage .testimonials-track {
        gap: 30px !important;
    }
    
    .homepage .testimonial-card {
        min-width: 100% !important;
        flex: 0 0 100% !important;
        box-sizing: border-box !important;
    }
    
    .homepage .slider-dots {
        display: none !important;
    }
    
    .homepage .slider-controls {
        justify-content: center !important;
        gap: 20px !important;
        margin-top: 25px !important;
    }

    /* CTA Section Layout Corrections */
    .homepage .cta-images {
        display: block !important;
        margin: 0 auto 30px auto !important;
        max-width: 450px !important;
        position: relative !important;
    }
    
    .homepage .cta-image-main {
        width: 100% !important;
        margin: 0 !important;
    }
    
    .homepage .cta-image-secondary {
        display: none !important;
    }
    
    .homepage .cta-shape {
        display: none !important;
    }
    
    .homepage .cta-content {
        text-align: center !important;
        padding: 0 15px !important;
    }
    
    .homepage .cta-title {
        font-size: 28px !important;
        color: #00d4ff !important;
        font-weight: 800 !important;
        margin-bottom: 10px !important;
        text-align: center !important;
    }
    
    .homepage .cta-subtitle {
        font-size: 24px !important;
        color: #ffffff !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
        margin-bottom: 20px !important;
        text-align: center !important;
    }
    
    .homepage .cta-description {
        font-size: 15px !important;
        color: rgba(255, 255, 255, 0.9) !important;
        line-height: 1.6 !important;
        margin-bottom: 25px !important;
        text-align: center !important;
    }
    
    .homepage .cta-badge {
        margin: 20px auto 0 auto !important;
        display: inline-flex !important;
    }

    /* Footer Mobile Centering and Structure Tuning */
    .homepage .footer-section {
        text-align: center !important;
    }
    
    .homepage .footer-heading {
        text-align: center !important;
        margin-bottom: 20px !important;
    }
    
    .homepage .footer-logo {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin-bottom: 25px !important;
        gap: 10px !important;
    }
    
    .homepage .footer-logo span {
        margin-bottom: 0 !important;
        line-height: 1 !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: #ffffff !important;
        display: inline-block !important;
        text-align: left !important;
    }
    
    .homepage .footer-logo .logo-icon {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .homepage .footer-logo .logo-text {
        display: flex !important;
        align-items: center !important;
        margin-left: 8px !important;
        margin-bottom: 0 !important;
        line-height: 1 !important;
    }
    
    .homepage .footer-contact p {
        display: block !important;
        text-align: center !important;
        margin-bottom: 12px !important;
    }
    
    .homepage .footer-contact p:before {
        content: none !important;
    }
    
    .homepage .footer-newsletter {
        text-align: center !important;
    }
    
    .homepage .footer-newsletter .footer-heading {
        text-align: center !important;
    }
    
    .homepage .newsletter-form input {
        max-width: 300px !important;
        margin: 0 auto !important;
        text-align: center !important;
        width: 100% !important;
    }
    
    .homepage .btn-subscribe {
        max-width: 300px !important;
        margin: 0 auto !important;
        width: 100% !important;
    }
}

/* ============================================
   GLOBAL FOOTER MOBILE FIXES
   Mirrors homepage footer mobile styles for ALL pages.
   No .homepage prefix — applies site-wide on mobile.
   ============================================ */

@media screen and (max-width: 968px) {

    /* Stack footer grid to single column on mobile */
    .footer-content {
        grid-template-columns: 1fr !important;
        gap: 35px !important;
    }

    /* Center all footer sections */
    .footer-section {
        text-align: center !important;
    }

    .footer-heading {
        text-align: center !important;
        margin-bottom: 18px !important;
    }

    /* Footer logo: centred flex row */
    .footer-logo {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin-bottom: 25px !important;
        gap: 10px !important;
    }

    /* Logo icon column */
    .footer-logo .logo-icon {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Logo text block — keep words on one horizontal line */
    .footer-logo .logo-text {
        display: flex !important;
        align-items: center !important;
        margin-left: 8px !important;
        margin-bottom: 0 !important;
        line-height: 1 !important;
    }

    /* Individual logo word spans — override global span rule (15px) */
    .footer-logo span,
    .footer-logo .logo-evolve,
    .footer-logo .logo-professional,
    .footer-logo .logo-alliance,
    .footer-logo .logo-main {
        margin-bottom: 0 !important;
        line-height: 1 !important;
        font-size: 11px !important;
        font-weight: 400 !important;
        color: #ffffff !important;
        display: inline !important;
        text-align: left !important;
    }

    /* EPA acronym stays at its intended size */
    .footer-logo .logo-acronym {
        font-size: 24px !important;
        font-weight: 700 !important;
        color: #60a5fa !important;
        display: block !important;
        margin-bottom: 0 !important;
    }

    /* Footer contact: block layout, no bullet pseudo-element */
    .footer-contact p {
        display: block !important;
        text-align: center !important;
        margin-bottom: 10px !important;
    }

    .footer-contact p:before {
        content: none !important;
    }

    .footer-contact a {
        text-align: center !important;
        display: block !important;
    }

    /* Footer nav links centred */
    .footer-section ul {
        text-align: center !important;
    }

    .footer-section ul li {
        text-align: center !important;
    }

    .footer-section ul li a {
        justify-content: center !important;
    }

    /* Newsletter — centre everything */
    .footer-newsletter {
        text-align: center !important;
    }

    .footer-newsletter .footer-heading {
        text-align: center !important;
    }

    .newsletter-form {
        align-items: center !important;
    }

    .newsletter-form input {
        max-width: 300px !important;
        width: 100% !important;
        margin: 0 auto !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    /* Subscribe button — override global button rule width */
    .btn-subscribe {
        max-width: 300px !important;
        width: 100% !important;
        margin: 0 auto !important;
        display: block !important;
        padding: 14px 24px !important;
        border-radius: 4px !important;
        font-size: 12px !important;
        letter-spacing: 1px !important;
    }

    /* Trust badges: wrap and centre */
    .footer-badges {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 20px !important;
        padding: 25px 0 !important;
    }

    .badge-item {
        font-size: 13px !important;
    }

    /* Footer bottom */
    .footer-bottom {
        text-align: center !important;
    }

    .footer-disclaimer {
        font-size: 11px !important;
        text-align: center !important;
        padding: 0 10px !important;
    }

    .footer-links {
        text-align: center !important;
    }

    .copyright {
        text-align: center !important;
        font-size: 11px !important;
    }

    /* Social links hidden (removed globally as per earlier request) */
    .social-links {
        display: none !important;
    }
}

/* On very small phones — extra tightening */
@media screen and (max-width: 480px) {
    .footer {
        padding: 40px 0 20px !important;
    }

    .footer-content {
        gap: 28px !important;
    }

    .footer-contact {
        padding: 20px !important;
        border-radius: 12px !important;
    }

    .footer-badges {
        flex-direction: column !important;
        align-items: center !important;
        gap: 15px !important;
    }
}

/* ============================================
   ACCESSIBILITY AND PERFORMANCE
   ============================================ */

@media screen and (max-width: 768px) {
    /* Touch-friendly interactions */
    .btn,
    .legal-btn,
    .service-card,
    .legal-action-card,
    .process-step {
        min-height: 44px !important;
        min-width: 44px !important;
        touch-action: manipulation !important;
    }
    
    /* Better focus indicators */
    .btn:focus,
    .legal-btn:focus,
    button:focus,
    input:focus,
    select:focus,
    textarea:focus {
        outline: 2px solid #60a5fa !important;
        outline-offset: 2px !important;
    }
    
    /* Prevent text selection on interactive elements */
    .btn,
    .legal-btn,
    .service-card,
    .legal-action-card,
    button {
        -webkit-user-select: none !important;
        -moz-user-select: none !important;
        -ms-user-select: none !important;
        user-select: none !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    
    /* Reduce motion for users who prefer it */
    @media (prefers-reduced-motion: reduce) {
        .service-card,
        .legal-action-card,
        .btn,
        .legal-btn,
        .hero,
        .legal-hero-banner,
        .tax-hero-banner {
            transition: none !important;
            animation: none !important;
        }
        
        .hero,
        .legal-hero-banner,
        .tax-hero-banner {
            background-attachment: scroll !important;
        }
    }
    
    /* Optimize background images */
    .hero,
    .legal-hero-banner,
    .tax-hero-banner {
        background-attachment: scroll !important;
        background-size: cover !important;
        background-position: center center !important;
    }
    
    /* Prevent zoom on input focus (iOS) */
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="password"],
    input[type="number"],
    select,
    textarea {
        font-size: 16px !important;
        padding: 12px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Force mobile-friendly forms */
    form {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .form-group,
    .input-group {
        width: 100% !important;
        margin-bottom: 15px !important;
    }
    
    /* Force mobile-friendly modals */
    .modal-content,
    .contact-modal .modal-content {
        width: 95% !important;
        max-width: 95% !important;
        padding: 20px !important;
        margin: 20px !important;
        box-sizing: border-box !important;
    }
    
    /* Force mobile-friendly tables */
    table {
        display: block !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
        width: 100% !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* ====================================================
   HOMEPAGE CUSTOM MOBILE RESPONSIVE TUNING
   ==================================================== */

@media screen and (max-width: 968px) {
    /* Hide top bar on homepage to save vertical screen space */
    .homepage .top-bar {
        display: none !important;
    }
    
    /* Hide desktop inline buttons in homepage mobile navbar */
    .homepage .nav-auth-buttons {
        display: none !important;
    }
    
    /* Hide desktop inline buttons even when active on homepage */
    .homepage .nav-menu.active ~ .nav-auth-buttons {
        display: none !important;
    }
    
    /* Show mobile-only menu items inside homepage hamburger drawer */
    .homepage .mobile-only {
        display: block !important;
    }
    
    /* Style mobile-only items inside the nav drawer */
    .homepage .nav-menu li.mobile-auth-buttons {
        padding: 20px 20px 10px 20px !important;
        border-bottom: none !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .homepage .nav-menu li.mobile-contact-info {
        padding: 10px 20px 20px 20px !important;
        border-bottom: none !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .homepage .mobile-btn-signin,
    .homepage .mobile-btn-register {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
        padding: 12px 20px !important;
        border-radius: 8px !important;
        font-weight: 600 !important;
        font-size: 15px !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        transition: all 0.3s ease !important;
    }
    
    .homepage .mobile-btn-schedule {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        width: 100% !important;
        padding: 12px 20px !important;
        border-radius: 8px !important;
        font-weight: 600 !important;
        font-size: 15px !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        transition: all 0.3s ease !important;
    }
    
    .homepage .mobile-btn-signin {
        background: transparent !important;
        color: #ffffff !important;
        border: 1px solid rgba(255, 255, 255, 0.4) !important;
    }
    
    .homepage .mobile-btn-signin:hover {
        background: rgba(255, 255, 255, 0.1) !important;
    }
    
    .homepage .mobile-btn-register {
        background: #00d4ff !important;
        color: #1a1a1a !important;
        border: 1px solid #00d4ff !important;
    }
    
    .homepage .mobile-btn-register:hover {
        background: #00e5ff !important;
    }
    
    .homepage .mobile-btn-schedule {
        background: #2563eb !important;
        color: #ffffff !important;
        border: 1px solid #2563eb !important;
    }
    
    .homepage .mobile-btn-schedule:hover {
        background: #1e40af !important;
    }
    
    .homepage .mobile-btn-phone {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        color: rgba(255, 255, 255, 0.7) !important;
        font-size: 14px !important;
        text-decoration: none !important;
        padding: 10px !important;
        transition: color 0.3s ease !important;
    }
    
    .homepage .mobile-btn-phone:hover {
        color: #60a5fa !important;
    }
    
    /* Make services tabs scrollable horizontally on mobile/tablet to avoid ugly wrapping */
    .homepage .service-tabs {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 15px !important;
        border-bottom: 3px solid rgba(30, 58, 138, 0.2) !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        scrollbar-width: none !important; /* Firefox */
    }
    
    .homepage .service-tabs::-webkit-scrollbar {
        display: none !important; /* Safari and Chrome */
    }
    
    .homepage .service-tab {
        flex: 0 0 auto !important;
        min-width: 180px !important;
        margin-bottom: -3px !important;
        padding: 15px 5px !important;
    }
}