@php
    $isProduct = $kind === 'material';
    $indexRoute = $isProduct ? 'materials' : 'services';
    $detailRoute = $isProduct ? 'materials.show' : 'services.show';
    $quoteUrl = route('quote', [$isProduct ? 'material' : 'project' => $entry->title]);
    $setting = fn (string $key, string $fallback) => ($entry->detailOption($key) !== '' ? $entry->detailOption($key) : $fallback);
    $detailStyle = '--detail-leading:' . (is_numeric($entry->detailOption('line_height')) ? min(2.5, max(1, (float) $entry->detailOption('line_height'))) . 'em' : 'var(--type-body-leading, 1.25em)') . ';--detail-size:' . (is_numeric($entry->detailOption('body_font_size')) ? min(22, max(15, (float) $entry->detailOption('body_font_size'))) . 'px' : 'var(--type-body-size, 17px)');
@endphp

<section class="catalog-detail-hero"><div class="wrap catalog-detail-grid"><div class="catalog-detail-intro">
    <nav class="breadcrumbs" aria-label="Breadcrumb"><a href="{{ route('home') }}">Home</a><span>/</span><a href="{{ route($indexRoute) }}">{{ $isProduct ? 'Products' : 'Services' }}</a><span>/</span><span aria-current="page">{{ $entry->title }}</span></nav>
    <span class="eyebrow">{{ $setting('hero_eyebrow', $entry->category ?: ($isProduct ? 'Natural stone' : 'Stone applications')) }}</span>
    <h1>{{ $setting('hero_heading', $isProduct ? $entry->title . ' ' . $copy['detail_heading'] : $entry->title) }}</h1>
    <p>{{ $setting('hero_intro', $entry->summary ?: 'Contact VIPO to discuss your specific material and project requirements.') }}</p>
    <div class="hero-actions"><a class="button button-dark" href="{{ $quoteUrl }}">{{ $setting('hero_cta_text', $isProduct ? 'Ask about '.$entry->title : 'Discuss your project') }} <span>↗</span></a><a class="button button-outline" href="{{ route($indexRoute) }}">{{ $setting('hero_back_text', $isProduct ? 'All products' : 'All services') }}</a></div>
    <span class="detail-disclaimer">{{ $setting('photo_disclaimer','Photos are for material inspiration. Confirm current finishes, dimensions and availability directly with VIPO.') }}</span>
</div><div class="catalog-detail-image"><img src="{{ $entry->image_url ?: asset($isProduct ? 'media/stone.jpg' : 'media/interior.jpg') }}" alt="{{ $setting('hero_image_alt', $entry->title . ' material inspiration') }}"><span class="photo-tag">{{ $setting('photo_label', $isProduct ? 'MATERIAL INSPIRATION' : 'SERVICE INSPIRATION') }}</span></div></div></section>

<section class="section detail-page" style="{{ $detailStyle }}"><div class="wrap catalog-body-grid"><div class="catalog-article">
    @foreach($detailBlocks as $block)
        @if($block['type'] === 'custom')
            @php($section = $block['section'])
            @include('site.partials.entry-section')
        @elseif($block['name'] === 'overview' && $entry->body)
            <section class="detail-standard-section"><span class="eyebrow">{{ $isProduct ? $copy['detail_intro'] : $copy['detail_eyebrow'] }}</span><h2>{{ $setting('body_heading', $isProduct ? 'What makes '.strtolower($entry->title).' worth considering?' : $copy['detail_heading']) }}</h2><div class="rich-text">{{ $entry->body }}</div></section>
        @elseif($block['name'] === 'highlights' && $entry->highlights)
            <section class="check-panel detail-standard-section"><h3>{{ $setting('highlights_heading', $copy['detail_highlights']) }}</h3><ul class="tick-list">@foreach(preg_split('/\r?\n/', trim($entry->highlights)) as $line)@if(trim($line))<li>{{ trim($line) }}</li>@endif @endforeach</ul></section>
        @elseif($block['name'] === 'uses' && $entry->best_for)
            <section class="detail-standard-section"><h2>{{ $setting('uses_heading', $copy['detail_uses']) }}</h2>@if($isProduct)<p class="lead-copy">{{ $copy['detail_uses_intro'] }}</p>@endif<div class="use-grid">@foreach(preg_split('/\r?\n/', trim($entry->best_for)) as $line)@if(trim($line))<div class="use-item"><span aria-hidden="true">↗</span>{{ trim($line) }}</div>@endif @endforeach</div></section>
        @elseif($block['name'] === 'tips' && $entry->selection_tips)
            <section class="detail-standard-section"><h2>{{ $setting('tips_heading', $isProduct ? $copy['detail_selection'] : $copy['detail_tips']) }}</h2><div class="rich-text">{{ $entry->selection_tips }}</div></section>
        @elseif($block['name'] === 'process' && !$isProduct)
            <section class="service-process detail-standard-section"><span class="eyebrow">{{ $setting('process_eyebrow',$copy['detail_process_eyebrow']) }}</span><h2>{{ $setting('process_heading', $copy['detail_process_heading']) }}</h2><ol>@foreach(range(1,3) as $n)<li>{{ $setting('process_'.$n, $copy['detail_process_'.$n]) }}</li>@endforeach</ol><a class="text-link" href="{{ $quoteUrl }}">{{ $setting('process_button','Start the conversation') }} <span aria-hidden="true">↗</span></a></section>
        @elseif($block['name'] === 'faq')
            <section class="faq-inline detail-standard-section"><h2>{{ $setting('faq_heading', $copy['detail_faq_heading']) }}</h2>@foreach(range(1,$isProduct ? 3 : 2) as $n)<details><summary>{{ $setting('faq_'.$n.'_q', $copy['detail_faq_'.$n.'_q']) }}</summary><p>{{ $setting('faq_'.$n.'_a', $copy['detail_faq_'.$n.'_a']) }}</p></details>@endforeach</section>
        @elseif($block['name'] === 'brief' && $isProduct)
            <section class="product-brief detail-standard-section"><span class="eyebrow">{{ $setting('brief_eyebrow',$copy['detail_brief_eyebrow']) }}</span><h2>{{ $setting('brief_heading',$copy['detail_brief_heading']) }}</h2><p>{{ $setting('brief_body',$copy['detail_brief_text']) }}</p><a class="text-link" href="{{ $quoteUrl }}">{{ $setting('brief_button','Send your sizes for a tailored quote') }} <span aria-hidden="true">↗</span></a></section>
        @elseif($block['name'] === 'gallery' && $isProduct && $productGallery->isNotEmpty())
            <section class="detail-media-gallery" aria-labelledby="detail-gallery-heading"><span class="eyebrow">{{ $setting('gallery_eyebrow','Photo & video collection') }}</span><h2 id="detail-gallery-heading">{{ $setting('gallery_heading','See more '.strtolower($entry->title).' inspiration.') }}</h2><div class="detail-media-grid">@foreach($productGallery as $item)<figure>@if($item->media_type === 'video')<video controls playsinline preload="metadata" aria-label="{{ $item->title }}"><source src="{{ $item->media_url }}"></video>@else<a href="{{ $item->media_url }}" target="_blank" rel="noopener"><img loading="lazy" src="{{ $item->media_url }}" alt="{{ $item->alt_text ?: $item->title }}"></a>@endif<figcaption>{{ $item->title }}</figcaption></figure>@endforeach</div><a class="text-link" href="{{ route('gallery',['product'=>$entry->slug]) }}">{{ $setting('gallery_button','View all gallery items') }} <span aria-hidden="true">↗</span></a></section>
        @endif
    @endforeach
</div>
@if($entry->detailOption('show_quote_card','1') === '1')
    <aside class="catalog-aside"><div class="help-card"><span class="eyebrow">{{ $setting('quote_card_eyebrow',$isProduct ? 'Need a quote?' : 'Project planning') }}</span><h3>{{ $setting('quote_card_heading', $isProduct ? "Let's talk about your ".strtolower($entry->title).' project.' : "Let's discuss the details that matter.") }}</h3><p>{{ $setting('quote_card_body', $isProduct ? 'Share a sketch, project location or dimensions. We can clarify the next steps.' : 'Share your plans or the scale of the work, and our team can follow up.') }}</p><a class="button button-dark" href="{{ $quoteUrl }}">{{ $setting('quote_card_button','Request a Quote') }} <span aria-hidden="true">↗</span></a><div class="help-card-divider"></div><span>{{ $setting('quote_card_phone_label','Prefer to talk?') }}</span><a class="help-phone" href="tel:{{ preg_replace('/[^0-9+]/', '', $settings['phone_primary']) }}">{{ $settings['phone_primary'] }}</a></div></aside>
@endif
</div></section>

@if($entry->detailOption('show_related','1') === '1' && $related->isNotEmpty())
<section class="section related-section"><div class="wrap"><span class="eyebrow">{{ $setting('related_eyebrow','Keep exploring') }}</span><h2 class="section-title">{{ $setting('related_heading',$isProduct ? 'Other materials to consider.' : 'More ways to use stone.') }}</h2><div class="material-grid compact-cards">@foreach($related as $other)<a class="material-card" href="{{ route($detailRoute, $other->slug) }}"><div class="image img-zoom"><img src="{{ $other->image_url ?: asset($isProduct ? 'media/stone.jpg' : 'media/interior.jpg') }}" alt="{{ $other->title }} reference image" loading="lazy"></div><div class="material-info"><div><small>{{ $other->category }}</small><h3>{{ $other->title }}</h3></div><span aria-hidden="true">↗</span></div></a>@endforeach</div></div></section>
@endif
@include('site.partials.cta')