@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 = $serviceIndustry['service_name'];
$industryName = $serviceIndustry['industry_name'];
$locationName = $serviceIndustry['location']['name'];
$countryName = $serviceIndustry['location']['country_name'];
$nativeName = $serviceIndustry['location']['native_name'];
$region = $serviceIndustry['location']['region'];
$isCapital = $serviceIndustry['location']['is_capital'];
$coordinates = $serviceIndustry['location']['coordinates'];

// Keywords for SEO (location + "industry near me", "best industry location")
$keywords = array_merge(
    $serviceIndustry['location']['keywords'] ?? [],
    explode(', ', __('messages.service_industry_location.meta_keywords', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName])),
    [$serviceName, $industryName, __('messages.meta.digital_marketing'), $locationName, $countryName]
);
$keywordString = implode(', ', array_unique(array_filter($keywords)));
@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_industry_location.schema_for') }} {{ $industryName }} {{ __('messages.service_location.in') }} {{ $locationName }}",
    "description": "{{ $metaDescription }}",
    "url": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}",
    "areaServed": {
        "@type": "City",
        "name": "{{ $locationName }}",
        @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 }} for {{ $industryName }}",
    "priceRange": "€€-€€€",
    "inLanguage": "{{ \App\Helpers\SeoHelper::getCurrentLanguageCode() }}"
}
</script>

{{-- Service Schema --}}
<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "Service",
    "name": "{{ __('messages.service_industry_location.schema_service_name', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName]) }}",
    "description": "{{ __('messages.service_industry_location.schema_service_desc', ['service' => strtolower($serviceName), 'industry' => strtolower($industryName), 'location' => $locationName, 'country' => $countryName]) }}",
    "provider": {
        "@type": "Organization",
        "name": "{{ __('messages.brand_name') }}"
    },
    "areaServed": {
        "@type": "City",
        "name": "{{ $locationName }}"
    },
    "serviceType": "{{ $serviceName }}",
    "audience": {
        "@type": "Audience",
        "audienceType": "{{ $industryName }}"
    },
    "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_industry_page.schema_breadcrumb_home') }}",
            "item": "{{ $localizedRoute('home') }}"
        },
        {
            "@type": "ListItem",
            "position": 2,
            "name": "{{ __('messages.service_industry_page.schema_breadcrumb_services') }}",
            "item": "{{ $localizedRoute('services.index') }}"
        },
        {
            "@type": "ListItem",
            "position": 3,
            "name": "{{ $serviceName }}",
            "item": "{{ $localizedRoute('services.show', ['slug' => $serviceSlug]) }}"
        },
        {
            "@type": "ListItem",
            "position": 4,
            "name": "{{ $industryName }}",
            "item": "{{ $localizedRoute('service.industry', ['serviceSlug' => $serviceSlug, 'industrySlug' => $industrySlug]) }}"
        },
        {
            "@type": "ListItem",
            "position": 5,
            "name": "{{ $locationName }}",
            "item": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}"
        }
    ]
}
</script>

{{-- FAQPage Schema (local SEO, featured snippet opportunity) --}}
@php
$faqIndustryLocation = [
    ['q' => __('messages.service_industry_location.faq_q1', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName]), 'a' => __('messages.service_industry_location.faq_a1', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName])],
    ['q' => __('messages.service_industry_location.faq_q2', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName]), 'a' => __('messages.service_industry_location.faq_a2', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName])],
    ['q' => __('messages.service_industry_location.faq_q3', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName]), 'a' => __('messages.service_industry_location.faq_a3', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName])],
];
$faqSchemaIndustry = [
    '@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']],
    ], $faqIndustryLocation),
];
@endphp
<script type="application/ld+json">{!! json_encode($faqSchemaIndustry, 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.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="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('service.industry', ['serviceSlug' => $serviceSlug, 'industrySlug' => $industrySlug]) }}" class="text-neutral-500 hover:text-criazo-primary smooth-transition" itemprop="item">
                        <span itemprop="name">{{ $industryName }}</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">{{ $locationName }}</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 & Industry Badge --}}
            <div class="flex flex-wrap gap-2 mb-6">
                <span 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">
                    <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>
                    {{ $locationName }}, {{ $countryName }}
                </span>
                <span class="inline-flex items-center gap-2 px-3 py-1.5 bg-neutral-100 text-neutral-700 rounded-full text-sm font-medium">
                    <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="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>
                    {{ $industryName }}
                </span>
            </div>
            
            <h1 class="page-hero__headline text-neutral-900 leading-tight mb-6">
                {{ $serviceName }} {{ __('messages.service_industry.for') }} 
                <span class="text-criazo-primary">{{ $industryName }}</span>
                <span class="block text-2xl sm:text-3xl lg:text-4xl mt-2 text-neutral-600">{{ __('messages.service_location.in') }} {{ $locationName }}</span>
            </h1>
            
            <p class="text-lg sm:text-xl text-neutral-600 leading-[1.43] tracking-body mb-8 max-w-3xl">
                {{ $serviceIndustry['tagline'] ?? __('messages.service_industry_location.specialized_services', ['service' => $serviceName, 'industry' => $industryName, 'location' => $locationName]) }}
                {{ __('messages.service_industry_location.we_help_grow', ['industry' => strtolower($industryName), 'region' => $region ? "{$region}, " : '', 'country' => $countryName]) }}
            </p>
            
            {{-- Trust Indicators --}}
            <div class="flex flex-wrap items-center gap-6 mb-10">
                <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 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="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>
                    <span>{{ __('messages.service_industry.industry_expertise') }}</span>
                </div>
                <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="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
                    </svg>
                    <span>{{ __('messages.service_industry_location.local_knowledge') }}</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>

{{-- Service Description --}}
<section class="py-16 sm:py-20 bg-white">
    <div class="site-container">
        <div class="grid lg:grid-cols-2 gap-12 items-center">
            <div>
                <h2 class="text-2xl sm:text-3xl font-semibold uppercase text-neutral-900 mb-6">
                    {{ __('messages.service_industry_location.why_choose', ['industry' => $industryName, 'service' => $serviceName, 'location' => $locationName]) }}
                </h2>
                <div class="prose max-w-none">
                    <p class="text-neutral-600 text-lg leading-[1.43] tracking-body mb-6">
                        {{ $serviceIndustry['description'] ?? __('messages.service_industry_location.description_fallback', ['industry' => $industryName, 'location' => $locationName, 'service' => $serviceName, 'country' => $countryName]) }}
                    </p>
                    <ul class="space-y-4">
                        <li class="flex items-start gap-3">
                            <svg class="w-6 h-6 text-criazo-primary flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                            </svg>
                            <span class="text-neutral-600">{{ __('messages.service_industry_location.deep_understanding', ['location' => $locationName, 'industry' => strtolower($industryName)]) }}</span>
                        </li>
                        <li class="flex items-start gap-3">
                            <svg class="w-6 h-6 text-criazo-primary flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                            </svg>
                            <span class="text-neutral-600">{{ __('messages.service_industry_location.proven_track', ['industry' => strtolower($industryName)]) }}</span>
                        </li>
                        <li class="flex items-start gap-3">
                            <svg class="w-6 h-6 text-criazo-primary flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                            </svg>
                            <span class="text-neutral-600">{{ __('messages.service_industry_location.local_seo', ['country' => $countryName]) }}</span>
                        </li>
                        <li class="flex items-start gap-3">
                            <svg class="w-6 h-6 text-criazo-primary flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                            </svg>
                            <span class="text-neutral-600">{{ __('messages.service_industry_location.customized_strategies') }}</span>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="bg-neutral-50 rounded-2xl p-8">
                <h3 class="type-card-title mb-6">{{ __('messages.service_industry_location.get_started') }}</h3>
                <p class="text-neutral-600 mb-6">
                    {{ __('messages.service_industry_location.ready_transform', ['industry' => strtolower($industryName), 'location' => $locationName]) }}
                </p>
                <a href="{{ $localizedRoute('contact.index') }}" 
                   class="inline-flex items-center justify-center w-full gap-2 px-6 py-4 bg-criazo-primary text-white font-semibold rounded-xl hover:bg-criazo-hover smooth-transition">
                    {{ __('messages.service_industry_location.request_quote') }}
                    <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>

{{-- Related Industries in Same Location --}}
@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_industry_location.other_industries', ['service' => $serviceName, 'location' => $locationName]) }}
            </h2>
            <p class="text-lg text-neutral-600 max-w-2xl mx-auto">
                {{ __('messages.service_industry_location.also_provide', ['service' => strtolower($serviceName), 'location' => $locationName]) }}
            </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">{{ $serviceName }} {{ __('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($sameIndustryOtherLocations) && count($sameIndustryOtherLocations) > 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_industry_location.serve_businesses', ['industry' => strtolower($industryName)]) }}
            </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.location', ['serviceSlug' => $serviceSlug, 'industrySlug' => $industrySlug, 'locationSlug' => $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($sameIndustryOtherLocations) && count($sameIndustryOtherLocations) > 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($sameIndustryOtherLocations as $location)
                <a href="{{ $localizedRoute('service.industry.location', ['serviceSlug' => $serviceSlug, 'industrySlug' => $industrySlug, 'locationSlug' => $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