/* HTML/CSS Only Website Enhancements */
/* Replacing JavaScript functionality with pure CSS */

/* Smooth scrolling for the entire page */
html {
    scroll-behavior: smooth;
}

/* CSS-only dropdown menus for Bootstrap navigation */
.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
}

.dropdown-menu {
    animation: fadeIn 0.2s ease-in-out;
}

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

/* CSS-only mobile navigation using checkbox pattern */
.navbar-toggle-checkbox {
    display: none;
}

@media (max-width: 991.98px) {
    .navbar-collapse {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: white;
        border: 1px solid #dee2e6;
        border-top: none;
        z-index: 1000;
    }
    
    .navbar-toggle-checkbox:checked + .navbar-toggler + .navbar-collapse {
        display: block;
    }
    
    .navbar-toggler {
        cursor: pointer;
        border: 1px solid rgba(0,0,0,.1);
        border-radius: .25rem;
        padding: .25rem .75rem;
        background: transparent;
        display: block;
    }
    
    .navbar-toggler:hover {
        background-color: rgba(0,0,0,.1);
    }
}

/* Enhanced focus states for keyboard navigation */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid #007bff;
    outline-offset: 2px;
}

/* Improved hover effects for better interactivity */
.btn:hover {
    transform: translateY(-2px);
    transition: transform 0.2s ease-in-out;
}

.card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
}

/* Simple navbar shadow on scroll effect using CSS only */
.navbar {
    transition: box-shadow 0.3s ease-in-out;
}

/* CSS-only mobile menu toggle (no JavaScript needed) */
@media (max-width: 767.98px) {
    .navbar-toggler:not(:checked) + .navbar-collapse {
        display: none;
    }
    
    .navbar-toggler:checked + .navbar-collapse {
        display: block;
    }
}

/* Enhanced accessibility and visual feedback */
.nav-link:hover,
.dropdown-item:hover {
    background-color: rgba(0, 123, 255, 0.1);
    transition: background-color 0.2s ease-in-out;
}

/* Remove any JavaScript-dependent classes that might cause issues */
.no-js {
    /* Fallback styles for non-JavaScript environments */
}/* Enhanced Typography for River City Junk Removal */

/* Font Loading and Base Typography */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {
    /* Typography Scale */
    --font-family-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-family-headings: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    
    /* Font Sizes - Mobile First */
    --font-size-xs: 0.75rem;    /* 12px */
    --font-size-sm: 0.875rem;   /* 14px */
    --font-size-base: 1rem;     /* 16px */
    --font-size-lg: 1.125rem;   /* 18px */
    --font-size-xl: 1.25rem;    /* 20px */
    --font-size-2xl: 1.5rem;    /* 24px */
    --font-size-3xl: 1.875rem;  /* 30px */
    --font-size-4xl: 2.25rem;   /* 36px */
    --font-size-5xl: 3rem;      /* 48px */
    --font-size-6xl: 3.75rem;   /* 60px */
    
    /* Line Heights */
    --line-height-tight: 1.25;
    --line-height-snug: 1.375;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.625;
    --line-height-loose: 2;
    
    /* Font Weights */
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --font-weight-black: 900;
    
    /* Colors with Enhanced Contrast */
    --color-text-primary: #111827;      /* High contrast dark gray */
    --color-text-secondary: #000000;    /* Black for secondary text */
    --color-text-muted: #000000;        /* Black for muted text */
    --color-text-light: #9ca3af;        /* Light gray for captions */
    --color-text-white: #ffffff;        /* Pure white for dark backgrounds */
    --color-text-brand: #2563eb;        /* Brand blue for links and accents */
    
    /* Background Colors for Contrast */
    --color-bg-primary: #ffffff;
    --color-bg-secondary: #f9fafb;
    --color-bg-muted: #f3f4f6;
    --color-bg-dark: #111827;
}

/* Base Typography Reset and Enhancement */
body {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
    color: var(--color-text-primary);
    font-weight: var(--font-weight-normal);
    letter-spacing: -0.01em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Heading Hierarchy */
h1, .h1 {
    font-family: var(--font-family-headings);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
    color: var(--color-text-primary);
    margin-bottom: 1.5rem;
    letter-spacing: -0.025em;
}

h2, .h2 {
    font-family: var(--font-family-headings);
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    margin-bottom: 1.25rem;
    letter-spacing: -0.02em;
}

h3, .h3 {
    font-family: var(--font-family-headings);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    margin-bottom: 1rem;
    letter-spacing: -0.015em;
}

h4, .h4 {
    font-family: var(--font-family-headings);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin-bottom: 0.75rem;
    letter-spacing: -0.01em;
}

h5, .h5 {
    font-family: var(--font-family-headings);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin-bottom: 0.5rem;
}

h6, .h6 {
    font-family: var(--font-family-headings);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    color: #000000;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

/* Body Text Enhancement */
p {
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
    color: #000000;
    margin-bottom: 1.25rem;
}

.lead {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-relaxed);
    color: #000000;
    font-weight: var(--font-weight-normal);
    margin-bottom: 1.5rem;
}

.text-large {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-normal);
}

.text-small {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-normal);
    color: #000000;
}

.text-xs {
    font-size: var(--font-size-xs);
    line-height: var(--line-height-normal);
    color: var(--color-text-light);
}

/* Hero Section Typography */
.hero-title {
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-black);
    line-height: var(--line-height-tight);
    color: var(--color-text-white);
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    margin-bottom: 1.5rem;
    letter-spacing: -0.03em;
}

.hero-subtitle {
    font-size: var(--font-size-xl);
    line-height: var(--line-height-relaxed);
    color: rgba(255, 255, 255, 0.9);
    font-weight: var(--font-weight-normal);
    margin-bottom: 2rem;
    max-width: 90%;
}

/* Display Headings */
.display-1 {
    font-size: var(--font-size-6xl);
    font-weight: var(--font-weight-black);
    line-height: var(--line-height-tight);
    letter-spacing: -0.04em;
}

.display-2 {
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
    letter-spacing: -0.03em;
}

.display-3 {
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-snug);
    letter-spacing: -0.025em;
}

/* Link Enhancement */
a {
    color: var(--color-text-brand);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    transition: all 0.2s ease;
    font-weight: var(--font-weight-medium);
}

a:hover {
    color: #1d4ed8;
    text-decoration-thickness: 2px;
}

/* Button Typography */
.btn {
    font-family: var(--font-family-primary);
    font-weight: var(--font-weight-semibold);
    letter-spacing: -0.005em;
    text-decoration: none;
    line-height: var(--line-height-normal);
}

.btn-lg {
    font-size: var(--font-size-lg);
    padding: 0.875rem 2rem;
}

.btn-sm {
    font-size: var(--font-size-sm);
    padding: 0.5rem 1rem;
}

/* Form Typography */
.form-label {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin-bottom: 0.5rem;
    line-height: var(--line-height-normal);
}

.form-control {
    font-size: var(--font-size-base);
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
}

.form-text {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-normal);
    color: #000000;
}

/* Navigation Typography */
.navbar-brand {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    text-decoration: none;
    letter-spacing: -0.01em;
}

.nav-link {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    color: #000000;
    text-decoration: none;
    letter-spacing: -0.005em;
}

/* Card Typography */
.card-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    margin-bottom: 0.75rem;
}

.card-text {
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
    color: #000000;
}

/* Service Cards */
.service-title-modern {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    margin-bottom: 0.5rem;
    letter-spacing: -0.01em;
}

.service-desc-modern {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
    color: #000000;
}

/* Trust Indicators */
.trust-number-new {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
    color: #facc15;
}

.trust-label-new {
    font-size: var(--font-size-xs);
    line-height: var(--line-height-normal);
    font-weight: var(--font-weight-medium);
    opacity: 0.9;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

/* Responsive Typography */
@media (min-width: 640px) {
    .hero-title {
        font-size: var(--font-size-6xl);
    }
    
    .hero-subtitle {
        font-size: var(--font-size-xl);
    }
    
    h1, .h1 {
        font-size: var(--font-size-5xl);
    }
    
    h2, .h2 {
        font-size: var(--font-size-4xl);
    }
}

@media (min-width: 768px) {
    :root {
        --font-size-base: 1.125rem; /* Increase base font size on larger screens */
    }
    
    .lead {
        font-size: var(--font-size-xl);
    }
}

@media (min-width: 1024px) {
    .hero-title {
        font-size: 4rem; /* 64px */
    }
    
    .hero-subtitle {
        font-size: var(--font-size-2xl);
    }
}

/* Dark Background Text */
.text-white {
    color: var(--color-text-white) !important;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6 {
    color: var(--color-text-white);
}

/* Accessibility Enhancements */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* High Contrast Support */
@media (prefers-contrast: high) {
    :root {
        --color-text-primary: #000000;
        --color-text-secondary: #000000;
        --color-text-muted: #000000;
    }
}

/* Focus Indicators */
a:focus,
button:focus,
.btn:focus {
    outline: 2px solid var(--color-text-brand);
    outline-offset: 2px;
}/* Enhanced CTA Button Design for River City Junk Removal */

/* Primary CTA Buttons */
.btn-cta-primary {
    background: linear-gradient(135deg, #facc15 0%, #f59e0b 50%, #d97706 100%);
    border: none;
    color: #1f2937 !important;
    font-weight: 700;
    font-size: 1.125rem;
    padding: 1rem 2.5rem;
    border-radius: 50px;
    box-shadow: 0 8px 25px rgba(250, 204, 21, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 56px;
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    border: 2px solid transparent;
}

.btn-cta-primary:hover {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #ea580c 100%);
    transform: translateY(-2px);
    box-shadow: 0 12px 35px rgba(250, 204, 21, 0.5), 0 8px 20px rgba(0, 0, 0, 0.15);
    color: #111827 !important;
}

.btn-cta-primary:active {
    transform: translateY(0);
    box-shadow: 0 4px 15px rgba(250, 204, 21, 0.3), 0 2px 8px rgba(0, 0, 0, 0.1);
}

.btn-cta-primary:focus {
    outline: none;
    box-shadow: 0 8px 25px rgba(250, 204, 21, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1), 0 0 0 3px rgba(59, 130, 246, 0.5);
}

/* Large CTA Buttons */
.btn-cta-large {
    font-size: 1.25rem;
    padding: 1.25rem 3rem;
    min-height: 64px;
    border-radius: 60px;
}

/* Secondary CTA Buttons */
.btn-cta-secondary {
    background: rgba(255, 255, 255, 0.95);
    border: 2px solid #facc15;
    color: #1f2937 !important;
    font-weight: 600;
    font-size: 1.125rem;
    padding: 1rem 2.5rem;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 56px;
    backdrop-filter: blur(10px);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
}

.btn-cta-secondary:hover {
    background: #facc15;
    color: #1f2937 !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(250, 204, 21, 0.3), 0 4px 15px rgba(0, 0, 0, 0.15);
    border-color: #f59e0b;
}

.btn-cta-secondary:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(250, 204, 21, 0.2), 0 1px 5px rgba(0, 0, 0, 0.1);
}

/* Phone CTA Buttons */
.btn-cta-phone {
    background: linear-gradient(135deg, #10b981 0%, #059669 50%, #047857 100%);
    border: none;
    color: #ffffff !important;
    font-weight: 700;
    font-size: 1.125rem;
    padding: 1rem 2rem;
    border-radius: 50px;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4), 0 3px 10px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 56px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
}

.btn-cta-phone:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 50%, #065f46 100%);
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(16, 185, 129, 0.5), 0 6px 15px rgba(0, 0, 0, 0.15);
    color: #ffffff !important;
}

.btn-cta-phone:active {
    transform: translateY(0);
    box-shadow: 0 3px 12px rgba(16, 185, 129, 0.3), 0 1px 6px rgba(0, 0, 0, 0.1);
}

/* Urgent/Emergency CTA */
.btn-cta-urgent {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 50%, #b91c1c 100%);
    border: none;
    color: #ffffff !important;
    font-weight: 800;
    font-size: 1.125rem;
    padding: 1rem 2.5rem;
    border-radius: 50px;
    box-shadow: 0 8px 25px rgba(239, 68, 68, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 56px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    animation: pulse-urgent 2s infinite;
}

.btn-cta-urgent:hover {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 50%, #991b1b 100%);
    transform: translateY(-2px);
    box-shadow: 0 12px 35px rgba(239, 68, 68, 0.5), 0 8px 20px rgba(0, 0, 0, 0.15);
    color: #ffffff !important;
    animation: none;
}

@keyframes pulse-urgent {
    0%, 100% {
        box-shadow: 0 8px 25px rgba(239, 68, 68, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1);
    }
    50% {
        box-shadow: 0 12px 35px rgba(239, 68, 68, 0.6), 0 6px 18px rgba(0, 0, 0, 0.15);
    }
}

/* CTA Icons */
.btn-cta-icon {
    font-size: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Enhanced Hero CTAs */
.btn-hero-cta-primary {
    background: linear-gradient(135deg, #facc15 0%, #f59e0b 50%, #d97706 100%);
    border: none;
    color: #1f2937 !important;
    font-weight: 800;
    font-size: 1.25rem;
    padding: 1.25rem 3rem;
    border-radius: 60px;
    box-shadow: 0 10px 30px rgba(250, 204, 21, 0.4), 0 6px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 64px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.btn-hero-cta-primary::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 0.5s;
}

.btn-hero-cta-primary:hover::before {
    left: 100%;
}

.btn-hero-cta-primary:hover {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #ea580c 100%);
    transform: translateY(-3px);
    box-shadow: 0 15px 40px rgba(250, 204, 21, 0.5), 0 10px 25px rgba(0, 0, 0, 0.15);
    color: #111827 !important;
}

.btn-hero-cta-secondary {
    background: rgba(255, 255, 255, 0.15);
    border: 2px solid rgba(250, 204, 21, 0.6);
    color: #ffffff !important;
    font-weight: 700;
    font-size: 1.125rem;
    padding: 1rem 2.5rem;
    border-radius: 50px;
    backdrop-filter: blur(15px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 56px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
}

.btn-hero-cta-secondary:hover {
    background: rgba(250, 204, 21, 0.2);
    border-color: #facc15;
    transform: translateY(-2px);
    color: #ffffff !important;
    backdrop-filter: blur(20px);
}

/* Form Submit CTAs */
.btn-form-submit {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 50%, #1e40af 100%);
    border: none;
    color: #ffffff !important;
    font-weight: 700;
    font-size: 1.125rem;
    padding: 1rem 2.5rem;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(37, 99, 235, 0.3), 0 3px 10px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 56px;
    width: 100%;
    justify-content: center;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
}

.btn-form-submit:hover {
    background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 50%, #1e3a8a 100%);
    transform: translateY(-1px);
    box-shadow: 0 8px 25px rgba(37, 99, 235, 0.4), 0 4px 12px rgba(0, 0, 0, 0.15);
    color: #ffffff !important;
}

.btn-form-submit:active {
    transform: translateY(0);
    box-shadow: 0 3px 12px rgba(37, 99, 235, 0.2), 0 1px 6px rgba(0, 0, 0, 0.1);
}

/* Loading State */
.btn-cta-loading {
    opacity: 0.8;
    cursor: not-allowed;
    pointer-events: none;
}

.btn-cta-loading::after {
    content: '';
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-left: 0.5rem;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Mobile Optimizations */
@media (max-width: 768px) {
    .btn-cta-primary,
    .btn-cta-secondary,
    .btn-cta-phone {
        padding: 1rem 2rem;
        font-size: 1rem;
        min-height: 52px;
    }
    
    .btn-cta-large,
    .btn-hero-cta-primary {
        padding: 1.125rem 2.5rem;
        font-size: 1.125rem;
        min-height: 60px;
    }
    
    /* Increase touch target for mobile */
    .btn-cta-primary,
    .btn-cta-secondary,
    .btn-cta-phone,
    .btn-form-submit {
        min-height: 48px;
        touch-action: manipulation;
    }
}

/* Accessibility Enhancements */
@media (prefers-reduced-motion: reduce) {
    .btn-cta-primary,
    .btn-cta-secondary,
    .btn-cta-phone,
    .btn-cta-urgent,
    .btn-hero-cta-primary,
    .btn-hero-cta-secondary,
    .btn-form-submit {
        transition: none;
        animation: none;
    }
    
    .btn-cta-primary:hover,
    .btn-cta-secondary:hover,
    .btn-cta-phone:hover,
    .btn-hero-cta-primary:hover,
    .btn-hero-cta-secondary:hover {
        transform: none;
    }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .btn-cta-primary {
        background: #000000;
        color: #ffffff !important;
        border: 2px solid #ffffff;
    }
    
    .btn-cta-secondary {
        background: #ffffff;
        color: #000000 !important;
        border: 2px solid #000000;
    }
}

/* Focus Indicators for Keyboard Navigation */
.btn-cta-primary:focus-visible,
.btn-cta-secondary:focus-visible,
.btn-cta-phone:focus-visible,
.btn-cta-urgent:focus-visible,
.btn-hero-cta-primary:focus-visible,
.btn-hero-cta-secondary:focus-visible,
.btn-form-submit:focus-visible {
    outline: 3px solid #2563eb;
    outline-offset: 2px;
}/* Accessibility and Micro-interaction Enhancements for River City Junk Removal */

/* Color Contrast Improvements */
:root {
    /* High contrast color palette - WCAG AA compliant */
    --color-text-primary-hc: #000000;        /* Pure black for maximum contrast */
    --color-text-secondary-hc: #000000;      /* Black for secondary text */
    --color-text-muted-hc: #000000;          /* Black for maximum contrast */
    --color-text-white-hc: #ffffff;          /* Pure white for dark backgrounds */
    
    /* Brand colors with enhanced contrast */
    --color-brand-primary-hc: #1e40af;       /* Darker blue for better contrast */
    --color-brand-accent-hc: #d97706;        /* Amber with high contrast */
    --color-success-hc: #047857;             /* Dark green for phone CTAs */
    --color-warning-hc: #b45309;             /* Dark amber for warnings */
    --color-danger-hc: #991b1b;              /* Dark red for urgent CTAs */
    
    /* Background colors for contrast */
    --color-bg-light-hc: #ffffff;
    --color-bg-gray-hc: #f8fafc;
    --color-bg-dark-hc: #111827;
}

/* Enhanced text contrast for accessibility */
body {
    color: var(--color-text-primary-hc);
}

.text-muted {
    color: #000000 !important;
}

.text-secondary {
    color: #000000 !important;
}

/* Override Bootstrap default text colors */
.text-muted,
.text-secondary,
.card-text,
.lead,
p,
.card-body p,
.card p {
    color: #000000 !important;
}

/* Ensure all paragraph text is black */
p:not(.text-white):not(.text-light) {
    color: #000000 !important;
}

/* Navigation contrast improvements */
.navbar-nav .nav-link {
    color: var(--color-text-secondary-hc) !important;
    font-weight: 500;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
    color: var(--color-brand-primary-hc) !important;
}

/* Button contrast enhancements */
.btn-cta-primary {
    background: linear-gradient(135deg, #d97706 0%, #b45309 50%, #92400e 100%);
    color: #ffffff !important;
    border: 2px solid transparent;
}

.btn-cta-primary:hover {
    background: linear-gradient(135deg, #b45309 0%, #92400e 50%, #78350f 100%);
    color: #ffffff !important;
}

.btn-cta-phone {
    background: linear-gradient(135deg, #047857 0%, #065f46 50%, #064e3b 100%);
    color: #ffffff !important;
}

.btn-cta-phone:hover {
    background: linear-gradient(135deg, #065f46 0%, #064e3b 50%, #042f2e 100%);
    color: #ffffff !important;
}

/* Form contrast improvements */
.form-control {
    border: 2px solid #d1d5db;
    color: var(--color-text-primary-hc);
    background-color: #ffffff;
}

.form-control:focus {
    border-color: var(--color-brand-primary-hc);
    box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.1);
    color: var(--color-text-primary-hc);
    background-color: #ffffff;
}

.form-label {
    color: var(--color-text-primary-hc);
    font-weight: 600;
}

/* Micro-interactions for CTAs */
.btn-cta-primary,
.btn-cta-secondary,
.btn-cta-phone,
.btn-cta-urgent,
.btn-hero-cta-primary,
.btn-hero-cta-secondary,
.btn-form-submit {
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Ripple effect for buttons */
.btn-cta-primary::before,
.btn-cta-secondary::before,
.btn-cta-phone::before,
.btn-form-submit::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    transition: width 0.6s, height 0.6s, top 0.6s, left 0.6s;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.btn-cta-primary:active::before,
.btn-cta-secondary:active::before,
.btn-cta-phone:active::before,
.btn-form-submit:active::before {
    width: 300px;
    height: 300px;
    top: 50%;
    left: 50%;
}

/* Icon bounce animation */
.btn-cta-icon {
    display: inline-block;
    transition: transform 0.3s ease;
}

.btn-cta-primary:hover .btn-cta-icon,
.btn-cta-secondary:hover .btn-cta-icon,
.btn-cta-phone:hover .btn-cta-icon {
    transform: scale(1.1) rotate(5deg);
    animation: iconBounce 0.6s ease-in-out;
}

@keyframes iconBounce {
    0%, 100% { transform: scale(1.1) rotate(5deg); }
    50% { transform: scale(1.2) rotate(-5deg); }
}

/* Glow effect for urgent CTAs */
.btn-cta-urgent {
    animation: glowPulse 2s ease-in-out infinite alternate;
}

@keyframes glowPulse {
    from {
        box-shadow: 0 8px 25px rgba(239, 68, 68, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1);
    }
    to {
        box-shadow: 0 12px 35px rgba(239, 68, 68, 0.6), 0 6px 18px rgba(0, 0, 0, 0.15), 0 0 20px rgba(239, 68, 68, 0.3);
    }
}

/* Service card hover enhancements */
.service-card-modern {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.service-card-modern::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(37, 99, 235, 0.1), transparent);
    transition: left 0.6s ease;
    z-index: 1;
}

.service-card-modern:hover::before {
    left: 100%;
}

.service-card-modern:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

/* Link hover effects */
a {
    position: relative;
    transition: all 0.2s ease;
}

a:hover {
    text-decoration: none;
}

a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: currentColor;
    transition: width 0.3s ease;
}

a:hover::after {
    width: 100%;
}

/* Focus indicators for accessibility */
*:focus-visible {
    outline: 3px solid var(--color-brand-primary-hc);
    outline-offset: 2px;
    border-radius: 4px;
}

.btn-cta-primary:focus-visible,
.btn-cta-secondary:focus-visible,
.btn-cta-phone:focus-visible,
.btn-cta-urgent:focus-visible,
.btn-hero-cta-primary:focus-visible,
.btn-hero-cta-secondary:focus-visible,
.btn-form-submit:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 2px;
    box-shadow: 0 0 0 6px var(--color-brand-primary-hc);
}

/* Form field animations */
.form-control {
    transition: all 0.3s ease;
    position: relative;
}

.form-control:focus {
    transform: scale(1.02);
}

/* Loading state micro-interactions */
.btn-cta-loading {
    position: relative;
}

.btn-cta-loading::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 1rem;
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    transform: translateY(-50%);
}

@keyframes spin {
    to { transform: translateY(-50%) rotate(360deg); }
}

/* Ripple animation for buttons */
@keyframes ripple {
    0% {
        transform: scale(0);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

/* Navbar hide animation */
.navbar-hidden {
    transform: translateY(-100%);
}

/* Field focus styles */
.field-focused .form-label {
    color: var(--color-brand-primary-hc);
    transform: translateY(-2px);
}

.field-filled .form-label {
    color: var(--color-brand-primary-hc);
}

/* Animation classes for intersection observer */
.animate-in {
    animation: slideInUp 0.6s ease-out both;
}

/* Service card stagger animation - Extended for all 11 services */
.service-card-modern:nth-child(1) { animation-delay: 0.1s; }
.service-card-modern:nth-child(2) { animation-delay: 0.2s; }
.service-card-modern:nth-child(3) { animation-delay: 0.3s; }
.service-card-modern:nth-child(4) { animation-delay: 0.4s; }
.service-card-modern:nth-child(5) { animation-delay: 0.5s; }
.service-card-modern:nth-child(6) { animation-delay: 0.6s; }
.service-card-modern:nth-child(7) { animation-delay: 0.7s; }
.service-card-modern:nth-child(8) { animation-delay: 0.8s; }
.service-card-modern:nth-child(9) { animation-delay: 0.9s; }
.service-card-modern:nth-child(10) { animation-delay: 1.0s; }
.service-card-modern:nth-child(11) { animation-delay: 1.1s; }

/* Navbar scroll animation */
.navbar {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.navbar.scrolled {
    backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* Hero section text animations */
.hero-title {
    animation: fadeInUp 0.8s ease-out;
}

.hero-subtitle {
    animation: fadeInUp 0.8s ease-out 0.2s both;
}

.hero-buttons {
    animation: fadeInUp 0.8s ease-out 0.4s both;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Trust indicators animation */
.trust-indicators-mini {
    animation: slideInUp 0.6s ease-out 0.6s both;
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    :root {
        --color-text-primary: #000000;
        --color-text-secondary: #000000;
        --color-text-muted: #000000;
        --color-bg-primary: #ffffff;
        --color-brand-primary: #0000ff;
    }
    
    .btn-cta-primary {
        background: #000000 !important;
        color: #ffffff !important;
        border: 2px solid #ffffff !important;
    }
    
    .btn-cta-secondary {
        background: #ffffff !important;
        color: #000000 !important;
        border: 2px solid #000000 !important;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .btn-cta-urgent {
        animation: none;
    }
    
    .hero-title,
    .hero-subtitle,
    .hero-buttons,
    .trust-indicators-mini {
        animation: none;
    }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    :root {
        --color-text-primary: #ffffff;
        --color-text-secondary: #e5e7eb;
        --color-text-muted: #9ca3af;
        --color-bg-primary: #111827;
        --color-bg-secondary: #1f2937;
    }
}

/* Mobile touch improvements */
@media (max-width: 768px) {
    .btn-cta-primary,
    .btn-cta-secondary,
    .btn-cta-phone,
    .btn-form-submit {
        min-height: 48px;
        min-width: 48px;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }
    
    /* Larger touch targets for mobile */
    .service-card-modern {
        padding: 1.5rem !important;
    }
    
    .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}/* Dark Background Text Contrast Fix - Override forced black text */

/* ULTRA-SPECIFIC FOOTER FIXES - Must override everything */
.footer-modern {
    background: linear-gradient(135deg, #1e293b 0%, #334155 100%) !important;
    color: #e2e8f0 !important;
}

/* Footer text - most specific selectors possible */
.footer-modern *:not(a):not(.btn) {
    color: #e2e8f0 !important;
}

.footer-modern p,
.footer-modern span,
.footer-modern li,
.footer-modern small,
.footer-modern div {
    color: #e2e8f0 !important;
}

.footer-modern .text-muted {
    color: #cbd5e1 !important;
}

.footer-modern strong {
    color: #ffffff !important;
}

/* Footer headings */
.footer-modern h1,
.footer-modern h2,
.footer-modern h3,
.footer-modern h4,
.footer-modern h5,
.footer-modern h6,
.footer-modern .footer-heading {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Footer links */
.footer-modern a {
    color: #60a5fa !important;
}

.footer-modern a:hover {
    color: #93c5fd !important;
}

/* Hero sections with dark backgrounds */
.hero-section,
.hero-section *,
.hero-section p,
.hero-section .lead,
.hero-section .text-muted,
.hero-section .card-text,
.bg-primary,
.bg-primary *,
.bg-primary p,
.bg-primary .lead,
.bg-primary .text-muted,
.bg-primary .card-text,
.bg-dark,
.bg-dark *,
.bg-dark p,
.bg-dark .lead,
.bg-dark .text-muted,
.bg-dark .card-text {
    color: #ffffff !important;
}

/* Footer sections with dark backgrounds */
footer,
footer *,
footer p,
footer li,
footer small,
footer span,
footer .text-muted,
footer .text-secondary,
footer .card-text,
footer .lead,
footer .footer-text,
footer .contact-item,
footer .footer-copyright,
footer .footer-tagline,
footer.bg-dark,
footer.bg-dark *,
footer.bg-dark p,
footer.bg-dark li,
footer.bg-dark small,
footer.bg-dark span,
footer.bg-dark .text-muted,
footer.bg-dark .text-secondary,
footer.bg-dark .card-text,
footer.bg-dark .lead,
footer.footer-modern,
footer.footer-modern *,
footer.footer-modern p,
footer.footer-modern li,
footer.footer-modern small,
footer.footer-modern span,
footer.footer-modern .text-muted,
footer.footer-modern .text-secondary,
footer.footer-modern .card-text,
footer.footer-modern .lead,
footer.footer-modern .footer-text,
footer.footer-modern .contact-item,
footer.footer-modern .footer-copyright,
footer.footer-modern .footer-tagline {
    color: #e2e8f0 !important;
}

/* Footer headings */
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6,
footer .footer-title,
footer .footer-heading,
footer.bg-dark h1,
footer.bg-dark h2,
footer.bg-dark h3,
footer.bg-dark h4,
footer.bg-dark h5,
footer.bg-dark h6,
footer.footer-modern h1,
footer.footer-modern h2,
footer.footer-modern h3,
footer.footer-modern h4,
footer.footer-modern h5,
footer.footer-modern h6,
footer.footer-modern .footer-title,
footer.footer-modern .footer-heading {
    color: #ffffff !important;
}

/* Footer links */
footer a,
footer .footer-link,
footer .footer-links a,
footer.bg-dark a,
footer.bg-dark .footer-link,
footer.bg-dark .footer-links a,
footer.footer-modern a,
footer.footer-modern .footer-link,
footer.footer-modern .footer-links a {
    color: #60a5fa !important;
}

footer a:hover,
footer .footer-link:hover,
footer .footer-links a:hover,
footer.bg-dark a:hover,
footer.bg-dark .footer-link:hover,
footer.bg-dark .footer-links a:hover,
footer.footer-modern a:hover,
footer.footer-modern .footer-link:hover,
footer.footer-modern .footer-links a:hover {
    color: #93c5fd !important;
}

/* Call-to-action sections with dark backgrounds */
.bg-primary .btn,
.bg-dark .btn,
.hero-section .btn {
    border: 2px solid rgba(255, 255, 255, 0.2);
}

/* Navigation on dark backgrounds */
.navbar-dark .navbar-nav .nav-link,
.bg-dark .nav-link,
.bg-primary .nav-link {
    color: #ffffff !important;
}

.navbar-dark .navbar-nav .nav-link:hover,
.bg-dark .nav-link:hover,
.bg-primary .nav-link:hover {
    color: #93c5fd !important;
}

/* Cards on dark backgrounds */
.bg-dark .card,
.bg-primary .card {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.bg-dark .card *,
.bg-primary .card *,
.bg-dark .card-title,
.bg-primary .card-title,
.bg-dark .card-text,
.bg-primary .card-text {
    color: #ffffff !important;
}

/* Any section with a dark background class */
.bg-slate-800,
.bg-slate-800 *,
.bg-slate-800 p,
.bg-slate-800 .lead,
.bg-slate-800 .text-muted,
.bg-slate-800 .card-text,
.bg-gray-800,
.bg-gray-800 *,
.bg-gray-800 p,
.bg-gray-800 .lead,
.bg-gray-800 .text-muted,
.bg-gray-800 .card-text,
.bg-slate-900,
.bg-slate-900 *,
.bg-slate-900 p,
.bg-slate-900 .lead,
.bg-slate-900 .text-muted,
.bg-slate-900 .card-text {
    color: #ffffff !important;
}

/* Specific sections that might have dark backgrounds */
.cta-section,
.cta-section *,
.cta-section p,
.cta-section .lead,
.cta-section .text-muted,
.cta-section .card-text {
    color: #ffffff !important;
}

/* Override any forced black text on elements with dark background classes */
*[class*="bg-dark"] *,
*[class*="bg-primary"] *,
*[class*="bg-slate"] *,
*[class*="bg-gray-8"] *,
*[class*="bg-gray-9"] * {
    color: #ffffff !important;
}

*[class*="bg-dark"] .text-muted,
*[class*="bg-primary"] .text-muted,
*[class*="bg-slate"] .text-muted,
*[class*="bg-gray-8"] .text-muted,
*[class*="bg-gray-9"] .text-muted {
    color: #cbd5e1 !important;
}

/* Ensure proper contrast for any missed elements */
.text-white,
.text-light {
    color: #ffffff !important;
}

/* Additional safety net for any dark gradient backgrounds */
*[style*="background: linear-gradient"][style*="#"] *,
*[style*="background-color: #1"][style*="#"] *,
*[style*="background-color: #2"][style*="#"] *,
*[style*="background-color: #3"][style*="#"] *,
*[style*="background-color: #4"][style*="#"] *,
*[style*="background-color: rgb("][style*="0,"][style*=")"] * {
    color: #ffffff !important;
}