{{-- Footer demo-architecture-2 — Usa componentes compartidos --}}
<footer id="footer" class="bg-primary border-0 my-0">
    <div class="container container-xl-custom custom-container-style">
        <div class="row py-5 pt-5 pb-4">
            {{-- Columna 1: Información de Contacto --}}
            <div class="col-md-6 col-lg-3 mb-4 mb-lg-0">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Información de Contacto') }}</h4>
                <x-footer-contact :show-icons="false" :show-address="false" />
            </div>

            {{-- Columna 2: Navegación Principal --}}
            <div class="col-md-6 col-lg-2 mb-4 mb-lg-0">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Navegación') }}</h4>
                <x-footer-nav :limit="6" :as-list="true" classes="list-unstyled" />
            </div>

            {{-- Columna 3: Servicios y Productos --}}
            <div class="col-md-6 col-lg-3 mb-4 mb-lg-0">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Nuestros Servicios') }}</h4>
                <ul class="list-unstyled mb-0">
                    @if(is_module_active('services'))
                        <li class="mb-2">
                            <a href="{{ route('frontend.services.index') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                {{ __('Todos los Servicios') }}
                            </a>
                        </li>
                    @endif
                    @if(is_module_active('products'))
                        <li class="mb-2">
                            <a href="{{ route('front.products.index') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block font-weight-semibold" style="line-height: 1.8;">
                                {{ __('Catálogo de Productos') }}
                            </a>
                        </li>
                    @endif
                    @if(is_module_active('gallery'))
                        <li class="mb-2">
                            <a href="{{ route('gallery') }}" class="text-color-light text-color-hover-primary text-decoration-none d-inline-block" style="line-height: 1.8;">
                                {{ __('Galería') }}
                            </a>
                        </li>
                    @endif
                </ul>
            </div>

            {{-- Columna 4: Redes Sociales --}}
            <div class="col-md-6 col-lg-4">
                <h4 class="font-weight-extra-bold text-4 ls-0 mb-3 mb-md-4">{{ __('Síguenos') }}</h4>
                <p class="text-color-light opacity-7 mb-3 mb-md-4" style="line-height: 1.7; font-size: 0.9rem;">
                    {{ config('site.footer.social_description', __('Seguinos en nuestras redes para enterarte de novedades y ver nuestros últimos trabajos.')) }}
                </p>
                <x-social-icons theme="light" size="md" classes="social-icons-clean social-icons-icon-light" />
            </div>
        </div>
    </div>

    {{-- Sección de Copyright --}}
    <div class="footer-copyright bg-primary border-top border-color-light" style="border-top-width: 1px !important;">
        <div class="container container-xl-custom custom-container-style">
            <div class="row py-4">
                <div class="col text-center">
                    <a href="{{ front_homepage_url() }}" class="d-inline-block mb-3 mb-md-4" aria-label="{{ config('site.name') }}">
                        <img alt="{{ config('site.name') }}" src="{{ site_asset_url('footer_logo') ?: site_asset_url('main_logo') }}" style="max-width: 150px; height: auto; max-height: 44px;">
                    </a>
                    <p class="text-3 mb-0 text-color-light opacity-7" style="line-height: 1.6;">
                        {{ config('site.name') }} © {{ date('Y') }}. {{ __('Todos los Derechos Reservados') }}
                    </p>
                </div>
            </div>
        </div>
    </div>
</footer>