@extends('layouts.app')

@section('robots', 'noindex, follow')

@php
use App\Helpers\SeoHelper;
$locale = app()->getLocale();

$localizedRoute = function($routeName, $params = []) use ($locale) {
    return SeoHelper::localizedRoute($routeName, $params, $locale);
};

$serviceName = $serviceLocation['service_name'];
$locationName = $serviceLocation['location']['name'];
$countryName = $serviceLocation['location']['country_name'];
$nativeName = $serviceLocation['location']['native_name'] ?? $locationName;
$region = $serviceLocation['location']['region'];
$locationDisplayName = ($locale === ($serviceLocation['location']['country_language'] ?? '') || (in_array($locale, ['pt', 'br'], true) && !empty($nativeName))) ? $nativeName : $locationName;
$isCapital = $serviceLocation['location']['is_capital'];
$coordinates = $serviceLocation['location']['coordinates'];
$population = $serviceLocation['location']['population'];
$metroPopulation = $serviceLocation['location']['metro_population'] ?? null;

// Keywords for SEO
$keywords = $serviceLocation['location']['keywords'] ?? [];
$keywordString = implode(', ', array_merge($keywords, [$serviceName, __('messages.meta.digital_marketing'), __('messages.meta.marketing_agency')]));
@endphp

@section('title', $pageTitle . __('messages.meta.title_suffix'))

@push('meta')
<meta name="description" content="{{ $metaDescription }}">
<meta name="keywords" content="{{ $keywordString }}">
@if($coordinates)
<meta name="ICBM" content="{{ $coordinates['lat'] }}, {{ $coordinates['lng'] }}">
@endif

{{-- Open Graph --}}
<meta property="og:title" content="{{ $pageTitle }}{{ __('messages.meta.title_suffix') }}">
<meta property="og:description" content="{{ $metaDescription }}">
<meta property="og:type" content="website">
<meta property="og:locale" content="{{ \App\Helpers\SeoHelper::getOgLocale() }}">

{{-- Twitter Card --}}
<meta name="twitter:title" content="{{ $pageTitle }}{{ __('messages.meta.title_suffix') }}">
<meta name="twitter:description" content="{{ $metaDescription }}">
@endpush

@push('schema')
{{-- LocalBusiness Schema --}}
<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "ProfessionalService",
    "name": "{{ __('messages.meta.author') }} - {{ $serviceName }} {{ __('messages.service_location.in') }} {{ $locationDisplayName }}",
    "description": "{{ $metaDescription }}",
    "url": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}",
    "areaServed": {
        "@type": "City",
        "name": "{{ $locationDisplayName }}",
        @if($nativeName !== $locationName)
        "alternateName": "{{ $nativeName }}",
        @endif
        "containedInPlace": {
            "@type": "Country",
            "name": "{{ $countryName }}"
        }
        @if($coordinates)
        ,"geo": {
            "@type": "GeoCoordinates",
            "latitude": {{ $coordinates['lat'] }},
            "longitude": {{ $coordinates['lng'] }}
        }
        @endif
    },
    "provider": {
        "@type": "Organization",
        "name": "{{ __('messages.brand_name') }}",
        "url": "{{ config('seo.site_url') }}"
    },
    "serviceType": "{{ $serviceName }}",
    "priceRange": "€€-€€€",
    "inLanguage": "{{ \App\Helpers\SeoHelper::getCurrentLanguageCode() }}"
}
</script>

{{-- Service Schema --}}
<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "Service",
    "name": "{{ $serviceName }} {{ __('messages.service_location.in') }} {{ $locationDisplayName }}",
    "description": "{{ __('messages.service_location.schema_service_desc', ['service' => strtolower($serviceName), 'location' => $locationDisplayName, 'country' => $countryName]) }}",
    "provider": {
        "@type": "Organization",
        "name": "{{ __('messages.brand_name') }}"
    },
    "areaServed": {
        "@type": "City",
        "name": "{{ $locationDisplayName }}"
    },
    "serviceType": "{{ $serviceName }}",
    "inLanguage": "{{ \App\Helpers\SeoHelper::getCurrentLanguageCode() }}"
}
</script>

{{-- BreadcrumbList Schema --}}
<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
        {
            "@type": "ListItem",
            "position": 1,
            "name": "{{ __('messages.service_location.schema_breadcrumb_home') }}",
            "item": "{{ $localizedRoute('home') }}"
        },
        {
            "@type": "ListItem",
            "position": 2,
            "name": "{{ __('messages.service_location.schema_breadcrumb_services') }}",
            "item": "{{ $localizedRoute('services.index') }}"
        },
        {
            "@type": "ListItem",
            "position": 3,
            "name": "{{ $serviceName }}",
            "item": "{{ $localizedRoute('services.show', ['slug' => $serviceSlug]) }}"
        },
        {
            "@type": "ListItem",
            "position": 4,
            "name": "{{ $locationDisplayName }}",
            "item": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}"
        }
    ]
}
</script>

{{-- FAQPage Schema (local SEO, featured snippet opportunity) --}}
@php
$faqServiceLocation = [
    ['q' => __('messages.service_location.faq_q1', ['service' => $serviceName, 'location' => $locationName]), 'a' => __('messages.service_location.faq_a1', ['service' => $serviceName, 'location' => $locationName])],
    ['q' => __('messages.service_location.faq_q2', ['service' => $serviceName, 'location' => $locationName]), 'a' => __('messages.service_location.faq_a2', ['service' => $serviceName, 'location' => $locationName])],
    ['q' => __('messages.service_location.faq_q3', ['service' => $serviceName, 'location' => $locationName]), 'a' => __('messages.service_location.faq_a3', ['service' => $serviceName, 'location' => $locationName])],
];
$faqSchema = [
    '@context' => 'https://schema.org',
    '@type' => 'FAQPage',
    'mainEntityOfPage' => ['@type' => 'WebPage', '@id' => \App\Helpers\SeoHelper::getCanonicalUrl()],
    'mainEntity' => array_map(fn($faq) => [
        '@type' => 'Question',
        'name' => $faq['q'],
        'acceptedAnswer' => ['@type' => 'Answer', 'text' => $faq['a']],
    ], $faqServiceLocation),
];
@endphp
<script type="application/ld+json">{!! json_encode($faqSchema, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE) !!}</script>
@endpush

@section('content')
{{-- Breadcrumbs --}}
<section class="bg-neutral-50 border-b border-neutral-200">
    <div class="site-container py-3">
        <nav aria-label="{{ __('messages.accessibility.breadcrumb') }}">
            <ol class="flex flex-wrap items-center gap-2 text-sm" itemscope itemtype="https://schema.org/BreadcrumbList">
                <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
                    <a href="{{ $localizedRoute('home') }}" class="text-neutral-500 hover:text-criazo-primary smooth-transition" itemprop="item">
                        <span itemprop="name">{{ __('messages.nav.home') }}</span>
                    </a>
                    <meta itemprop="position" content="1">
                </li>
                <li class="text-neutral-400" aria-hidden="true">
                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/></svg>
                </li>
                <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
                    <a href="{{ $localizedRoute('services.index') }}" class="text-neutral-500 hover:text-criazo-primary smooth-transition" itemprop="item">
                        <span itemprop="name">{{ __('messages.nav.services') }}</span>
                    </a>
                    <meta itemprop="position" content="2">
                </li>
                <li class="text-neutral-400" aria-hidden="true">
                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/></svg>
                </li>
                <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
                    <a href="{{ $localizedRoute('services.show', ['slug' => $serviceSlug]) }}" class="text-neutral-500 hover:text-criazo-primary smooth-transition" itemprop="item">
                        <span itemprop="name">{{ $serviceName }}</span>
                    </a>
                    <meta itemprop="position" content="3">
                </li>
                <li class="text-neutral-400" aria-hidden="true">
                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/></svg>
                </li>
                <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem" aria-current="page">
                    <span class="text-neutral-900 font-medium" itemprop="name">{{ $locationDisplayName }}</span>
                    <meta itemprop="position" content="4">
                </li>
            </ol>
        </nav>
    </div>
</section>

{{-- Hero Section --}}
<section class="relative py-16 sm:py-20 lg:py-24 bg-gradient-to-b from-white to-neutral-50 overflow-hidden">
    <div class="absolute inset-0 overflow-hidden pointer-events-none" aria-hidden="true">
        <div class="absolute -top-40 -right-40 w-80 h-80 bg-criazo-primary/5 rounded-full blur-3xl"></div>
        <div class="absolute -bottom-40 -left-40 w-80 h-80 bg-criazo-primary/5 rounded-full blur-3xl"></div>
    </div>
    
    <div class="site-container relative z-10">
        <div class="max-w-4xl">
            {{-- Location Badge --}}
            <div class="inline-flex items-center gap-2 px-3 py-1.5 bg-criazo-primary/10 text-criazo-primary rounded-full text-sm font-medium mb-6">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"/>
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
                </svg>
                <span>{{ $locationDisplayName }}, {{ $countryName }}</span>
            </div>
            
            <h1 class="page-hero__headline text-neutral-900 mb-6">
                {{ $serviceName }} 
                <span class="text-criazo-primary">{{ __('messages.service_location.in') }} {{ $locationDisplayName }}</span>
            </h1>
            
            <p class="page-hero__subcopy text-neutral-600 mb-8 max-w-3xl">
                {{ __('messages.service_location.professional_services', ['service' => strtolower($serviceName), 'location' => $locationDisplayName . ($region ? ", {$region}" : ''), 'country' => $countryName]) }}
            </p>
            
            {{-- Location Stats --}}
            <div class="flex flex-wrap items-center gap-6 mb-10">
                @if($isCapital)
                <div class="flex items-center gap-2 text-sm text-neutral-600">
                    <svg class="w-5 h-5 text-criazo-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/>
                    </svg>
                    <span>{{ __('messages.service_location.capital_city') }}</span>
                </div>
                @endif
                @if($population)
                <div class="flex items-center gap-2 text-sm text-neutral-600">
                    <svg class="w-5 h-5 text-criazo-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
                    </svg>
                    <span>{{ number_format($metroPopulation ?? $population) }}+ {{ $metroPopulation ? __('messages.service_location.metro_area') : __('messages.service_location.population') }}</span>
                </div>
                @endif
                <div class="flex items-center gap-2 text-sm text-neutral-600">
                    <svg class="w-5 h-5 text-criazo-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/>
                    </svg>
                    <span>{{ __('messages.service_location.years_experience') }}</span>
                </div>
            </div>
            
            {{-- CTAs --}}
            <div class="flex flex-wrap gap-4">
                <a href="{{ $localizedRoute('contact.index') }}" 
                   class="inline-flex items-center gap-2 px-6 py-3 bg-criazo-primary text-white font-semibold rounded-full hover:bg-criazo-hover smooth-transition shadow-lg shadow-criazo-primary/25">
                    {{ __('messages.service_location.get_free_consultation') }}
                    <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/>
                    </svg>
                </a>
            </div>
        </div>
    </div>
</section>

{{-- Services in Location --}}
<section class="py-16 sm:py-20 bg-white">
    <div class="site-container">
        <div class="text-center mb-12">
            <h2 class="text-2xl sm:text-3xl font-semibold text-neutral-900 mb-4">
                {{ __('messages.service_location.what_we_offer', ['location' => $locationName]) }}
            </h2>
            <p class="text-lg text-neutral-600 max-w-2xl mx-auto">
                {{ __('messages.service_location.services_tailored', ['service' => strtolower($serviceName), 'location' => $locationName]) }}
            </p>
        </div>
        
        <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            {{-- Service Features (dynamic based on service type) --}}
            @php
            $serviceFeatures = [
                'web-development' => [
                    ['title' => __('messages.service_location.custom_websites'), 'description' => __('messages.service_location.custom_websites_desc', ['location' => $locationName]), 'icon' => 'globe'],
                    ['title' => __('messages.service_location.ecommerce_solutions'), 'description' => __('messages.service_location.ecommerce_solutions_desc', ['country' => $countryName]), 'icon' => 'cart'],
                    ['title' => __('messages.service_location.web_applications'), 'description' => __('messages.service_location.web_applications_desc'), 'icon' => 'code'],
                ],
                'social-media' => [
                    ['title' => __('messages.service_location.social_strategy'), 'description' => __('messages.service_location.social_strategy_desc', ['location' => $locationName]), 'icon' => 'share'],
                    ['title' => __('messages.service_location.content_creation'), 'description' => __('messages.service_location.content_creation_desc'), 'icon' => 'edit'],
                    ['title' => __('messages.service_location.community_management'), 'description' => __('messages.service_location.community_management_desc', ['country' => $countryName]), 'icon' => 'users'],
                ],
                'seo-sem' => [
                    ['title' => __('messages.service_location.local_seo'), 'description' => __('messages.service_location.local_seo_desc', ['location' => $locationName]), 'icon' => 'search'],
                    ['title' => __('messages.service_location.google_ads'), 'description' => __('messages.service_location.google_ads_desc', ['country' => $countryName]), 'icon' => 'trending'],
                    ['title' => __('messages.service_location.seo_audits'), 'description' => __('messages.service_location.seo_audits_desc'), 'icon' => 'chart'],
                ],
                'ecommerce' => [
                    ['title' => __('messages.service_location.online_stores'), 'description' => __('messages.service_location.online_stores_desc', ['location' => $locationName]), 'icon' => 'cart'],
                    ['title' => __('messages.service_location.payment_integration'), 'description' => __('messages.service_location.payment_integration_desc', ['country' => $countryName]), 'icon' => 'card'],
                    ['title' => __('messages.service_location.inventory_management'), 'description' => __('messages.service_location.inventory_management_desc'), 'icon' => 'box'],
                ],
                'branding' => [
                    ['title' => __('messages.service_location.brand_identity'), 'description' => __('messages.service_location.brand_identity_desc', ['location' => $locationName]), 'icon' => 'palette'],
                    ['title' => __('messages.service_location.logo_design'), 'description' => __('messages.service_location.logo_design_desc'), 'icon' => 'star'],
                    ['title' => __('messages.service_location.brand_guidelines'), 'description' => __('messages.service_location.brand_guidelines_desc'), 'icon' => 'book'],
                ],
                'advertising' => [
                    ['title' => __('messages.service_location.digital_ads'), 'description' => __('messages.service_location.digital_ads_desc', ['country' => $countryName]), 'icon' => 'megaphone'],
                    ['title' => __('messages.service_location.social_ads'), 'description' => __('messages.service_location.social_ads_desc', ['location' => $locationName]), 'icon' => 'share'],
                    ['title' => __('messages.service_location.display_advertising'), 'description' => __('messages.service_location.display_advertising_desc'), 'icon' => 'monitor'],
                ],
            ];
            
            $features = $serviceFeatures[$serviceSlug] ?? $serviceFeatures['web-development'];
            @endphp
            
            @foreach($features as $feature)
            <div class="p-6 bg-neutral-50 rounded-2xl hover:shadow-lg smooth-transition">
                <div class="w-12 h-12 bg-criazo-primary/10 rounded-xl flex items-center justify-center mb-4">
                    <svg class="w-6 h-6 text-criazo-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        @if($feature['icon'] === 'globe')
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"/>
                        @elseif($feature['icon'] === 'cart')
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z"/>
                        @elseif($feature['icon'] === 'search')
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
                        @elseif($feature['icon'] === 'share')
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.368 2.684 3 3 0 00-5.368-2.684z"/>
                        @else
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/>
                        @endif
                    </svg>
                </div>
                <h3 class="text-lg font-semibold text-neutral-900 mb-2">{{ $feature['title'] }}</h3>
                <p class="text-neutral-600">{{ $feature['description'] }}</p>
            </div>
            @endforeach
        </div>
    </div>
</section>

{{-- Industries Section --}}
@if(count($relatedIndustries) > 0)
<section class="py-16 sm:py-20 bg-neutral-50">
    <div class="site-container">
        <div class="text-center mb-12">
            <h2 class="text-2xl sm:text-3xl font-semibold text-neutral-900 mb-4">
                {{ __('messages.service_location.for_industries', ['service' => $serviceName, 'location' => $locationName]) }}
            </h2>
            <p class="text-lg text-neutral-600 max-w-2xl mx-auto">
                {{ __('messages.service_location.specialize_in', ['service' => strtolower($serviceName), 'country' => $countryName]) }}
            </p>
        </div>
        
        <div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-4">
            @foreach($relatedIndustries as $industry)
            <a href="{{ $localizedRoute('service.industry.location', ['serviceSlug' => $serviceSlug, 'industrySlug' => $industry['slug'], 'locationSlug' => $locationSlug]) }}" 
               class="flex items-center justify-between p-4 bg-white rounded-xl hover:shadow-md hover:border-criazo-primary border-2 border-transparent smooth-transition">
                <div>
                    <h3 class="font-semibold text-neutral-900">{{ $industry['name'] }}</h3>
                    <p class="text-sm text-neutral-500">{{ __('messages.service_location.in') }} {{ $locationName }}</p>
                </div>
                <svg class="w-5 h-5 text-neutral-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
                </svg>
            </a>
            @endforeach
        </div>
    </div>
</section>
@endif

{{-- Also Serving: Same Country First, Then Other Countries --}}
@if((isset($nearbyLocations) && count($nearbyLocations) > 0) || (isset($otherMajorLocations) && count($otherMajorLocations) > 0))
<section class="py-16 sm:py-20 bg-white">
    <div class="site-container">
        <div class="text-center mb-12">
            <h2 class="text-2xl sm:text-3xl font-semibold text-neutral-900 mb-4">
                {{ __('messages.service_location.also_serving') }}
            </h2>
            <p class="text-lg text-neutral-600 max-w-2xl mx-auto">
                {{ __('messages.service_location.serve_other_cities') }}
            </p>
        </div>
        {{-- First: Cities in Same Country --}}
        @if(isset($nearbyLocations) && count($nearbyLocations) > 0)
        <div class="mb-8">
            <h3 class="text-xl font-semibold text-neutral-900 mb-6 text-center">
                {{ __('messages.service_location.more_cities', ['country' => $countryName ?? '']) }}
            </h3>
            <div class="flex flex-wrap justify-center gap-3">
                @foreach($nearbyLocations as $location)
                <a href="{{ $localizedRoute('service.industry', ['serviceSlug' => $serviceSlug, 'industrySlug' => $location['slug']]) }}" 
                   class="inline-flex items-center px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700 hover:bg-criazo-primary hover:text-white smooth-transition">
                    {{ $location['name'] }}
                    @if(!empty($location['is_capital']))
                    <span class="ml-1 text-xs text-criazo-primary">({{ __('messages.service_location.capital') }})</span>
                    @endif
                </a>
                @endforeach
            </div>
        </div>
        @endif
        {{-- Below: Also Available in Other Countries --}}
        @if(isset($otherMajorLocations) && count($otherMajorLocations) > 0)
        <div class="mt-10 rounded-2xl bg-neutral-50 border border-neutral-100 p-6 sm:p-8">
            <p class="text-xs font-semibold uppercase tracking-label text-neutral-500 mb-5 text-center">{{ __('messages.service_location.also_available_in') }}</p>
            <div class="flex flex-wrap justify-center gap-3">
                @foreach($otherMajorLocations as $location)
                <a href="{{ $localizedRoute('service.industry', ['serviceSlug' => $serviceSlug, 'industrySlug' => $location['slug']]) }}" 
                   class="inline-flex items-center gap-2 px-4 py-2 border border-neutral-200 rounded-full text-sm text-neutral-600 hover:border-criazo-primary hover:text-criazo-primary smooth-transition">
                    @if(!empty($location['is_capital']))
                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z"/>
                    </svg>
                    @endif
                    {{ $location['name'] }}{{ isset($location['country']) ? ', ' . $location['country'] : '' }}
                </a>
                @endforeach
            </div>
        </div>
        @endif
    </div>
</section>
@endif

{{-- CTA Section --}}
<section class="py-16 sm:py-20 bg-gradient-to-r from-criazo-primary to-criazo-hover">
    <div class="site-container text-center">
        <h2 class="text-2xl sm:text-3xl lg:text-4xl font-semibold text-white mb-4">
            {{ __('messages.service_location.ready_to_grow', ['location' => $locationName]) }}
        </h2>
        <p class="text-lg text-white/90 mb-8 max-w-2xl mx-auto">
            {{ __('messages.service_location.get_consultation_desc', ['service' => strtolower($serviceName), 'location' => $locationName]) }}
        </p>
        <div class="flex flex-wrap justify-center gap-4">
            <a href="{{ $localizedRoute('contact.index') }}" 
               class="inline-flex items-center gap-2 px-8 py-4 bg-white text-criazo-primary font-semibold rounded-full hover:bg-neutral-100 smooth-transition shadow-lg">
                {{ __('messages.service_location.get_free_consultation') }}
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/>
                </svg>
            </a>
        </div>
    </div>
</section>

@include('components.explore-site-section', ['hideServicesSlider' => true])

@endsection