@extends('layout.front.master')

@section('title', config('site.name') . ' | ' . __('Tranquilidad para vos y tu familia'))
@section('description', config('site.seo.description') ?? 'Plan de Cobertura de Sepelio 100% Digital con servicio premium en Tucumán. Previsión, simpleza y acompañamiento humano.')
@section('keywords', config('site.seo.keywords') ?? 'seguro sepelio, cobertura funeraria, previsión, tucumán, san agustín')

{{-- Open Graph Meta Tags --}}
@section('og_title', config('site.name'))
@section('og_description', config('site.og.description') ?? 'Plan de Cobertura de Sepelio 100% Digital con servicio premium en Tucumán')
@section('og_image', asset(config('site.assets.main_logo')))
@section('og_type', 'website')
@section('og_url', url()->current())

{{-- Twitter Card Meta Tags --}}
@section('twitter_title', config('site.name'))
@section('twitter_description', config('site.twitter.description') ?? 'Plan de Cobertura de Sepelio 100% Digital')
@section('twitter_image', asset(config('site.assets.main_logo')))

@section('content')

<div role="main" class="main">

	{{-- Hero Section - Estructura Original Porto --}}
	<section class="section position-relative border-0 m-0" style="background-image: url({{ asset('cd-project/img/demos/insurance/backgrounds/background-1.jpg') }}); background-position: center; background-size: cover;">
		<div class="container position-relative pb-5 mb-5">
			{{-- SVG Decorations --}}
			<svg class="d-none d-lg-block custom-svg-position-1" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1686.88 1095.86" data-appear-animation-svg="true">
				<path class="appear-animation" data-appear-animation="customLines1anim" data-appear-animation-delay="100" data-appear-animation-duration="7s" fill="none" stroke="#d8d8d8" stroke-width="2px" stroke-miterlimit="10" d="M87.95,1.4c6.82,9.14,15.53,21.59,24.68,36.94c6.82,11.45,27.18,46.82,42.55,96.51
					c22.8,73.68,21.39,136.02,20.51,156c-3.11,70.56-22.16,122.51-36,159.32c-10.88,28.95-11.68,24.38-59.74,125.62
					c-43.46,91.53-49.66,109.7-52.85,119.49C6.6,758.14,2.98,804.59,2.16,829.14c-1.49,44.72,4.54,70.82,6.47,78.64
					c3.54,14.35,10.42,41.25,29.79,70.47c6.64,10.01,30.84,44.6,76.77,69.11c42.9,22.9,81.52,24.6,110.47,25.87
					c45.57,2.01,79.98-6.18,113.02-14.3c30.83-7.58,58.4-18.38,113.53-40c59.55-23.35,66.43-28.58,110.47-43.91
					c35.63-12.41,57.67-19.98,89.36-25.7c25.68-4.64,55.3-9.77,94.3-6.3c12.43,1.11,53.97,5.59,102.13,27.74
					c32.05,14.74,53.03,30.87,57.53,34.38c24.26,18.91,41.05,38.65,51.91,53.45"/>
			</svg>
			<svg class="d-none d-lg-block custom-svg-position-2" width="780" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1034.87 621.92" data-appear-animation-svg="true">
				<path class="appear-animation" data-appear-animation="customLines1anim" data-appear-animation-delay="100" data-appear-animation-duration="7s" fill="none" stroke="#d8d8d8" stroke-width="2px" stroke-miterlimit="10" d="M1033.14,343.02c-15.35,3.35-35.43,6.53-59.06,7.15c-6.93,0.18-31.19,0.59-62.64-4.6
					c-17.43-2.87-66.48-11.4-119.49-41.36c-44.67-25.25-70.31-53.39-114.72-102.13c-41.11-45.11-36.16-48.69-77.11-91.57
					c-56.53-59.21-89.83-77.39-103.83-84.43C476.06,15.9,449.68,2.99,412.71,1.4c-12.99-0.56-43.99-1.53-77.96,14.64
					c-41.24,19.63-61.56,52.48-73.53,71.83c-23.33,37.71-29.81,74.12-34.04,97.87c-2.5,14.07-3.49,25.38-5.45,48
					c-3.15,36.29-2.4,50.69-3.91,84.09c-2.19,48.31-3.28,72.47-10.04,104c-5.37,25.04-10.9,49.9-27.06,79.15
					c-17.97,32.52-39.6,53.3-50.89,63.15c-11.85,10.34-37.13,30.25-74.72,43.74c-21.2,7.61-39.98,10.9-53.79,12.43"/>
			</svg>

			<img src="{{ asset('cd-project/img/demos/insurance/generic/generic-3.png') }}" class="img-fluid position-absolute top-10 right-0 z-index-1 d-none d-lg-block appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="100" alt="Pevero Salud - Cobertura de Sepelio" />
			<div class="row align-items-center pb-5 mb-4">
				<div class="col-lg-6">
					<h1 class="font-weight-bold text-color-light text-18 ws-nowrap pt-5 pb-5-5 mb-1 my-md-5 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="600">
						<span class="d-none d-lg-block">{{ __('PEVERO SALUD') }}</span>
					</h1>
					<h2 class="text-color-dark font-weight-bold text-12 line-height-3 mb-2 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100">{{ __('Tranquilidad para vos y tu familia, cuando más se necesita') }}</h2>
					<p class="text-color-dark text-4 font-weight-medium mb-4-5 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100">{{ __('Plan de Cobertura de Sepelio 100% Digital. Previsión, simpleza y acompañamiento humano.') }}</p>
					<a href="{{ route('front.contact') }}" class="btn btn-primary btn-rounded border-0 font-weight-bold text-3 px-5 btn-py-3 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100">{{ __('AFILIATE HOY') }}</a>
				</div>
				<div class="col-lg-3 ms-lg-auto mb-lg-5 d-none d-lg-block">
					<ul class="list list-unstyled">
						<li class="font-weight-bold text-color-light line-height-1 text-16 ws-nowrap ps-5-5 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="600">{{ __('INDIVIDUAL') }}</li>
						<li class="font-weight-bold text-color-light line-height-1 text-16 ws-nowrap ps-5 ms-5 position-relative left-8 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="800">{{ __('FAMILIAR') }}</li>
						<li class="font-weight-bold text-color-light line-height-1 text-16 ws-nowrap ps-5 ms-5 position-relative left-12 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="1000">&nbsp;{{ __('24/7') }}</li>
						<li class="font-weight-bold text-color-light line-height-1 text-16 ws-nowrap ps-5 ms-5 position-relative left-15 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="1200">{{ __('DIGITAL') }}</li>
					</ul>
				</div>
			</div>
		</div>
	</section>

	{{-- Why Choose Section - Estructura Original Porto --}}
	<section class="section bg-transparent position-relative border-0 m-0 p-0">
		<div class="container custom-container-background z-index-1 py-5">
			<div class="row position-relative z-index-1 pt-5-5">
				<div class="col text-center">
					<h2 class="text-color-dark font-weight-medium text-8 mb-5-5">{{ __('¿Por qué elegir') }} <strong>{{ config('site.name') }}?</strong></h2>
				</div>
			</div>
			<div class="row justify-content-center position-relative gy-5 z-index-1">
				<div class="col-md-9 col-lg-4 text-center appear-animation" data-appear-animation="fadeInLeftShorterPlus" data-appear-animation-delay="100">
					<img width="90" height="90" src="{{ asset('cd-project/img/demos/insurance/icons/rounded-dollar.svg') }}" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-fill-color-secondary mb-4-5'}" />
					<h3 class="text-color-dark text-transform-none text-5-6 font-weight-semibold mb-3">{{ __('Precios Accesibles') }}</h3>
					<p class="text-3-5 mb-0">{{ __('Plan Individual desde $5.000 por mes. Cobertura completa sin costos adicionales para tu familia.') }}</p>
				</div>
				<div class="col-md-9 col-lg-4 text-center appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="100">
					<img width="90" height="90" src="{{ asset('cd-project/img/demos/insurance/icons/mouse-dollar.svg') }}" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-stroke-color-primary mb-4-5'}" />
					<h3 class="text-color-dark text-transform-none text-5-6 font-weight-semibold mb-3">{{ __('100% Digital') }}</h3>
					<p class="text-3-5 mb-0">{{ __('Afiliación rápida y simple. Sin trámites complicados, todo desde tu dispositivo.') }}</p>
				</div>
				<div class="col-md-9 col-lg-4 text-center appear-animation" data-appear-animation="fadeInRightShorterPlus" data-appear-animation-delay="100">
					<img width="90" height="90" src="{{ asset('cd-project/img/demos/insurance/icons/money-suitcase.svg') }}" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-stroke-color-secondary mb-4-5'}" />
					<h3 class="text-color-dark text-transform-none text-5-6 font-weight-semibold mb-3">{{ __('Atención 24/7') }}</h3>
					<p class="text-3-5 mb-0">{{ __('Coordinación inmediata en el momento del evento. Acompañamiento humano cuando más lo necesitás.') }}</p>
				</div>
			</div>
			<div class="row py-5">
				<div class="col">
					<hr>
				</div>
			</div>
			<div class="row align-items-center pb-5 pb-lg-0 mb-5 mb-lg-0">
				<div class="col-lg-5 text-center text-lg-start appear-animation" data-appear-animation="fadeInRightShorterPlus" data-appear-animation-delay="100">
					<img src="{{ asset('cd-project/img/demos/insurance/generic/generic-1.jpg') }}" class="img-fluid rounded-circle mb-4 mb-lg-0" alt="{{ __('Cobertura de Sepelio') }}" />
				</div>
				<div class="col-lg-6 text-center text-lg-start appear-animation" data-appear-animation="fadeInRightShorterPlus" data-appear-animation-delay="100">
					<h2 class="text-color-dark font-weight-medium text-8 mb-4-5">{{ __('Cobertura de Sepelio con') }} <strong>{{ __('Servicio Premium') }}</strong></h2>
					<p class="text-3-5 line-height-8 mb-4">{{ __('Plan de cobertura 100% digital con servicio premium en Tucumán. Incluye traslado, ataúd, velatorio, ceremonia y trámites administrativos. Todo coordinado con delicadeza y respeto.') }}</p>
					<a href="{{ route('front.contact') }}" class="btn btn-secondary btn-outline btn-rounded font-weight-bold btn-px-5 py-3">{{ __('VER PLANES') }}</a>
				</div>
			</div>
			<div class="row align-items-center pt-1 my-5">
				<div class="col-lg-6 text-center text-lg-start order-2 order-lg-1 appear-animation" data-appear-animation="fadeInLeftShorterPlus" data-appear-animation-delay="100">
					<h2 class="text-color-dark font-weight-medium text-8 mb-4-5">{{ __('Afiliate de forma') }} <strong>{{ __('Rápida y Digital') }}</strong></h2>
					<p class="text-3-5 line-height-8 mb-4">{{ __('Proceso 100% online. Completá tus datos, elegí tu plan y activá la suscripción automática mensual vía Mercado Pago. La cobertura estará activa desde el momento del pago.') }}</p>
					<a href="{{ route('front.contact') }}" class="btn btn-secondary btn-outline btn-rounded font-weight-bold btn-px-5 py-3">{{ __('COMENZAR AFILIACIÓN') }}</a>
				</div>
				<div class="col-lg-5 text-center text-lg-end order-1 order-lg-2">
					<img src="{{ asset('cd-project/img/demos/insurance/generic/generic-2.jpg') }}" class="img-fluid rounded-circle mb-4 mb-lg-0 appear-animation" data-appear-animation="fadeInLeftShorterPlus" data-appear-animation-delay="100" alt="{{ __('Proceso Digital') }}" />
				</div>
			</div>
		</div>
		{{-- SVG decoration at bottom --}}
		<svg class="position-absolute bottom-0 right-0" width="440" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 434.95 228.97" data-appear-animation-svg="true">
			<path class="appear-animation" data-appear-animation="customLines1anim" data-appear-animation-delay="100" data-appear-animation-duration="7s" fill="none" stroke="#d8d8d8" stroke-width="2px" stroke-miterlimit="10" d="M0,228.97c0.37-4.22,1.28-10.15,3.69-16.85c5.72-15.86,16-25.23,22.47-30.98
				c21.47-19.1,45.53-24.02,55.15-25.87c12.32-2.37,22.4-2.03,42.55-1.36c30.99,1.03,35.79,4.41,65.02,5.79
				c25.3,1.19,38.83,1.83,57.19-2.38c12.11-2.77,32.93-7.79,52.09-24.17c9.08-7.76,15.13-16.75,27.23-34.72
				c18.15-26.95,15.6-29.8,28.26-46.3c8.43-10.99,21.89-28.15,45.28-39.83c14.25-7.11,27.33-9.77,36.02-10.89"/>
		</svg>
	</section>

	{{-- Plans Section - Adaptado con Pricing Tables estilo demo-seo-2 --}}
	<section class="section section-height-3 border-0 m-0" id="planes">
		<div class="container pb-3">
			<div class="row">
				<div class="col text-center">
					<h2 class="text-color-dark font-weight-medium text-8 mb-5 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100">{{ __('Nuestros') }} <strong>{{ __('Planes') }}</strong></h2>
				</div>
			</div>
			<div class="row pricing-table custom-pricing-table-style-1 justify-content-center mb-5">
				{{-- Plan Individual --}}
				<div class="col-md-8 col-lg-4 mb-4 mb-lg-0 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">
					<div class="plan text-center h-100 d-flex flex-column">
						<div class="plan-header bg-primary pt-5 px-4 pb-4">
							<h4 class="text-color-light font-weight-bold text-5 mt-4 mb-3">{{ __('Plan Individual') }}</h4>
							<div class="plan-price">
								<span class="price text-color-light" style="font-size: 3rem; font-weight: 800; line-height: 1;">
									<span class="price-unit" style="font-size: 50%;">$</span>5.000
								</span>
								<label class="price-label text-color-light opacity-9 d-block mt-2 text-3" style="text-transform: uppercase;">{{ __('POR MES') }}</label>
							</div>
						</div>
						<div class="plan-features px-4 py-4 flex-grow-1 d-flex flex-column bg-light">
							<ul class="mb-0">
								<li>{{ __('1 persona') }}</li>
								<li>{{ __('Cobertura completa de sepelio') }}</li>
								<li>{{ __('Servicio premium incluido') }}</li>
								<li>{{ __('Atención 24/7') }}</li>
								<li>{{ __('Sin costos adicionales') }}</li>
							</ul>
						</div>
						<div class="plan-footer pt-3 pb-5 bg-light">
							<a href="{{ route('front.contact') }}?plan=individual" class="btn btn-primary btn-modern btn-rounded font-weight-bold px-5 py-3 text-3 mb-4">
								{{ __('Obtener Plan') }}
							</a>
						</div>
					</div>
				</div>
				{{-- Plan Familiar (Featured) --}}
				<div class="col-md-8 col-lg-4 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="300">
					<div class="plan plan-featured text-center h-100 d-flex flex-column">
						<div class="plan-header bg-secondary pt-5 px-4 pb-4">
							<h4 class="text-color-light font-weight-bold text-5 mt-4 mb-3">{{ __('Plan Familiar') }}</h4>
							<div class="plan-price">
								<span class="price text-color-light" style="font-size: 3rem; font-weight: 800; line-height: 1;">
									<span class="price-unit" style="font-size: 50%;">$</span>10.000
								</span>
								<label class="price-label text-color-light opacity-9 d-block mt-2 text-3" style="text-transform: uppercase;">{{ __('POR MES') }}</label>
							</div>
						</div>
						<div class="plan-features px-4 py-4 flex-grow-1 d-flex flex-column bg-light">
							<ul class="mb-0">
								<li>{{ __('Hasta 4 personas') }}</li>
								<li>{{ __('Cobertura completa para todos') }}</li>
								<li>{{ __('Servicio premium incluido') }}</li>
								<li>{{ __('Atención 24/7') }}</li>
								<li>{{ __('Sin costos adicionales') }}</li>
								<li class="text-color-secondary font-weight-semibold">{{ __('Persona extra: $1.200/mes') }}</li>
							</ul>
						</div>
						<div class="plan-footer pt-3 pb-5 bg-light">
							<a href="{{ route('front.contact') }}?plan=familiar" class="btn btn-secondary btn-modern btn-rounded font-weight-bold px-5 py-3 text-3 mb-4">
								{{ __('Obtener Plan') }}
							</a>
						</div>
					</div>
				</div>
			</div>
			{{-- Nota de Cobertura --}}
			<div class="row">
				<div class="col-lg-8 offset-lg-2">
					<div class="alert alert-info border-0 rounded-0 mb-0 appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">
						<div class="d-flex align-items-start">
							<i class="icon icon-info text-5 text-color-primary me-3 mt-1"></i>
							<div>
								<strong class="d-block mb-2">{{ __('Información de Cobertura:') }}</strong>
								<p class="mb-1">{{ __('Cobertura actual: Provincia de Tucumán') }}</p>
								<p class="mb-0">{{ __('Prestador exclusivo: San Agustín') }}</p>
								<p class="mb-0 text-2-5 mt-2">{{ __('Exclusivo para afiliados en San Miguel de Tucumán y alrededores.') }}</p>
							</div>
						</div>
					</div>
					<div class="text-center mt-4">
						<p class="text-3-5 text-color-grey mb-2">
							<strong>{{ __('Forma de Pago:') }}</strong> {{ __('Pago por suscripción. Serás redirigido a Mercado Pago para activar la suscripción automática mensual.') }}
						</p>
					</div>
				</div>
			</div>
		</div>
	</section>

	{{-- Quote Section with Parallax - Estructura Original Porto --}}
	<section class="section position-relative overflow-hidden section-height-3 border-0 m-0" data-plugin-parallax data-plugin-options="{'speed': 1.5, 'parallaxHeight': '120%', 'fadeIn': true}" data-image-src="{{ asset('cd-project/img/demos/insurance/backgrounds/background-2.jpg') }}">
		<svg width="390" class="custom-svg-position-3 opacity-6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 393.91 241.97" data-appear-animation-svg="true">
			<path class="appear-animation" data-appear-animation="customLines1anim" data-appear-animation-delay="100" data-appear-animation-duration="7s" fill="none" stroke="#d8d8d8" stroke-width="2px" stroke-miterlimit="10" d="M319.44,0c0.95,3.34,2,7.87,2.55,13.31c0.3,2.94,1.03,10.65-0.51,19.4c-3.52,20.06-16.69,32.75-19.66,35.49
				c-5.75,5.3-10.67,7.86-19.15,12.26c-16.63,8.63-31.03,11.66-37.28,12.77c-10.68,1.89-18.28,1.79-28.09,1.79
				c-21.27-0.01-46.27-0.02-63.83,1.28c-25.63,1.89-43.02,3.18-63.06,13.53c-23.42,12.1-38.73,30.52-45.7,39.06
				c-6.79,8.32-11.7,15.96-15.06,21.7"/>
		</svg>
		<div class="container py-3">
			<div class="row">
				<div class="col-lg-8 col-xl-7 ms-lg-auto">
					<div class="bg-light text-center p-5">
						<div class="py-2 px-md-5">
							<h2 class="font-weight-bold text-7 mb-1">{{ __('¿Listo para obtener una cotización rápida?') }}</h2>
							<p class="text-3-5 mb-5-5">{{ __('Completá el formulario y te contactaremos de inmediato.') }}</p>
							<form action="{{ route('front.contact') }}" method="get">
								<div class="d-flex custom-form-control-group-style-1 mb-3">
									<select class="form-control" name="plan_type">
										<option value="" selected>{{ __('TIPO DE PLAN') }}</option>
										<option value="individual">{{ __('Plan Individual') }}</option>
										<option value="familiar">{{ __('Plan Familiar') }}</option>
									</select>
									<input type="text" class="form-control" name="location" placeholder="{{ __('UBICACIÓN') }}" />
								</div>
								<input type="submit" class="btn btn-secondary btn-rounded border-0 w-100 text-center font-weight-bold text-3-5 btn-py-3" value="{{ __('OBTENER COTIZACIÓN') }}" />
							</form>
						</div>
					</div>
					<div class="bg-primary d-flex flex-column flex-sm-row align-items-center justify-content-center p-5">
						<a href="mailto:{{ config('site.contact.email') }}" class="d-inline-flex align-items-center text-color-light text-decoration-none opacity-hover-8 font-weight-medium text-4 mb-3 mb-sm-0">
							<i class="icon icon-envelope me-2 text-5 position-relative top-1"></i>
							{{ config('site.contact.email') }}
						</a>
						<a href="tel:{{ str_replace([' ', '-', '(', ')'], '', config('site.contact.phone')) }}" class="d-inline-flex align-items-center text-color-light text-decoration-none opacity-hover-8 font-weight-medium text-4 ms-sm-5-5">
							<i class="icon icon-phone me-2 text-5 position-relative top-1"></i>
							{{ config('site.contact.phone') }}
						</a>
					</div>
				</div>
			</div>
		</div>
	</section>

	{{-- Knowledge and Numbers Section - Estructura Original Porto --}}
	<section class="section bg-transparent position-relative border-0 m-0 p-0">
		<div class="container pt-5 pb-5-5 mt-4">
			<div class="row">
				<div class="col text-center">
					<h2 class="text-color-dark font-weight-medium text-8 mb-5 appear-animation" data-appear-animation="fadeInRightShorterPlus" data-appear-animation-delay="100">{{ __('Conocimiento y') }} <strong>{{ __('Números') }}</strong></h2>
				</div>
			</div>
			<div class="row gy-5 mb-5">
				<div class="col-lg-6">
					@if(is_module_active('faqs') && isset($faqs) && $faqs->count() > 0)
						<div class="accordion custom-accordion-style-1 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100" id="accordion1">
							@foreach($faqs->take(5) as $index => $faq)
								<div class="card card-default">
									<div class="card-header" id="collapse{{ $index + 1 }}Heading">
										<h4 class="card-title m-0">
											<a class="accordion-toggle text-color-dark font-weight-semibold collapsed" data-bs-toggle="collapse" data-bs-target="#collapse{{ $index + 1 }}" aria-expanded="false" aria-controls="collapse{{ $index + 1 }}">
												{{ $index + 1 }} - {{ $faq->question }}
											</a>
										</h4>
									</div>
									<div id="collapse{{ $index + 1 }}" class="collapse" aria-labelledby="collapse{{ $index + 1 }}Heading" data-bs-parent="#accordion1">
										<div class="card-body">
											<p class="mb-0">{{ $faq->answer }}</p>
										</div>
									</div>
								</div>
							@endforeach
							<a href="{{ route('front.contact') }}" class="btn btn-secondary btn-rounded border-0 font-weight-bold text-3 btn-px-5 py-3 mt-5-5">{{ __('CONTACTANOS') }}</a>
						</div>
					@else
						{{-- Fallback FAQ content --}}
						<div class="accordion custom-accordion-style-1 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100" id="accordion1">
							<div class="card card-default">
								<div class="card-header" id="collapse1HeadingOne">
									<h4 class="card-title m-0">
										<a class="accordion-toggle text-color-dark font-weight-semibold collapsed" data-bs-toggle="collapse" data-bs-target="#collapse1One" aria-expanded="false" aria-controls="collapse1One">
											1 - {{ __('¿Por qué elegir') }} {{ config('site.name') }}?
										</a>
									</h4>
								</div>
								<div id="collapse1One" class="collapse" aria-labelledby="collapse1HeadingOne" data-bs-parent="#accordion1">
									<div class="card-body">
										<p class="mb-0">{{ __('Una empresa que combina tecnología, previsión y compromiso humano para brindar un plan de cobertura de sepelio 100% digital con servicio premium.') }}</p>
									</div>
								</div>
							</div>
							<div class="card card-default">
								<div class="card-header" id="collapse1HeadingTwo">
									<h4 class="card-title m-0">
										<a class="accordion-toggle text-color-dark font-weight-semibold collapsed" data-bs-toggle="collapse" data-bs-target="#collapse1Two" aria-expanded="false" aria-controls="collapse1Two">
											2 - {{ __('¿Dónde aplica la cobertura?') }}
										</a>
									</h4>
								</div>
								<div id="collapse1Two" class="collapse" aria-labelledby="collapse1HeadingTwo" data-bs-parent="#accordion1">
									<div class="card-body">
										<p class="mb-0">{{ __('Actualmente, en la provincia de Tucumán, con San Agustín como prestador exclusivo. Exclusivo para afiliados en San Miguel de Tucumán y alrededores.') }}</p>
									</div>
								</div>
							</div>
							<div class="card card-default">
								<div class="card-header" id="collapse1HeadingThree">
									<h4 class="card-title m-0">
										<a class="accordion-toggle text-color-dark font-weight-semibold collapsed" data-bs-toggle="collapse" data-bs-target="#collapse1Three" aria-expanded="false" aria-controls="collapse1Three">
											3 - {{ __('¿Cómo puedo afiliarme?') }}
										</a>
									</h4>
								</div>
								<div id="collapse1Three" class="collapse" aria-labelledby="collapse1HeadingThree" data-bs-parent="#accordion1">
									<div class="card-body">
										<p class="mb-0">{{ __('Cualquier persona mayor de 18 años puede afiliarse ingresando al formulario digital. El proceso es 100% online y toma solo unos minutos.') }}</p>
									</div>
								</div>
							</div>
							<div class="card card-default">
								<div class="card-header" id="collapse1HeadingFour">
									<h4 class="card-title m-0">
										<a class="accordion-toggle text-color-dark font-weight-semibold collapsed" data-bs-toggle="collapse" data-bs-target="#collapse1Four" aria-expanded="false" aria-controls="collapse1Four">
											4 - {{ __('¿Qué incluye la cobertura?') }}
										</a>
									</h4>
								</div>
								<div id="collapse1Four" class="collapse" aria-labelledby="collapse1HeadingFour" data-bs-parent="#accordion1">
									<div class="card-body">
										<p class="mb-0">{{ __('Traslado, ataúd, velatorio (sala o domicilio), ceremonia y trámites administrativos básicos. Todo coordinado con delicadeza y respeto.') }}</p>
									</div>
								</div>
							</div>
							<div class="card card-default">
								<div class="card-header" id="collapse1HeadingFive">
									<h4 class="card-title m-0">
										<a class="accordion-toggle text-color-dark font-weight-semibold collapsed" data-bs-toggle="collapse" data-bs-target="#collapse1Five" aria-expanded="false" aria-controls="collapse1Five">
											5 - {{ __('¿Cómo me contacto si tengo dudas?') }}
										</a>
									</h4>
								</div>
								<div id="collapse1Five" class="collapse" aria-labelledby="collapse1HeadingFive" data-bs-parent="#accordion1">
									<div class="card-body">
										<p class="mb-0">{{ __('Nuestro equipo está disponible por WhatsApp o correo electrónico para acompañarte en el proceso. Podés contactarnos en cualquier momento.') }}</p>
									</div>
								</div>
							</div>
							<a href="{{ route('front.contact') }}" class="btn btn-secondary btn-rounded border-0 font-weight-bold text-3 btn-px-5 py-3 mt-5-5">{{ __('CONTACTANOS') }}</a>
						</div>
					@endif
				</div>
				<div class="col-lg-6 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="100">
					@if(isset($testimonials) && $testimonials->count() > 0)
						@php $testimonial = $testimonials->first(); @endphp
						<figure class="custom-testimonial-style-1 mb-5-5">
							<blockquote class="ps-5-5 mb-0">
								<p class="text-4-5 line-height-7 mb-3">{{ $testimonial->content }}</p>
							</blockquote>
							<figcaption class="font-weight-bold text-color-dark positive-ls-2 ps-5-5 mb-3">{{ $testimonial->author }} - {{ $testimonial->position }}</figcaption>
							@if($testimonial->signature)
								<img src="{{ asset($testimonial->signature) }}" class="img-fluid ps-5-5" alt="{{ $testimonial->author }}" />
							@endif
						</figure>
					@else
						<figure class="custom-testimonial-style-1 mb-5-5">
							<blockquote class="ps-5-5 mb-0">
								<p class="text-4-5 line-height-7 mb-3">{{ __('En momentos difíciles, contar con un servicio que se preocupa por vos y tu familia hace toda la diferencia. La tranquilidad de saber que todo está cubierto es invaluable.') }}</p>
							</blockquote>
							<figcaption class="font-weight-bold text-color-dark positive-ls-2 ps-5-5 mb-3">{{ __('FAMILIA AFILIADA') }}</figcaption>
						</figure>
					@endif

					@if(isset($kpis))
						<div class="row counters text-dark ps-lg-4">
							<div class="col-sm-6 mb-5-5">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="{{ $kpis['years_experience'] ?? 5 }}" data-append="+" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Años de Experiencia') }}</label>
								</div>
							</div>
							<div class="col-sm-6 mb-5-5">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="{{ $kpis['happy_customers'] ?? 500 }}" data-append="+" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Familias Protegidas') }}</label>
								</div>
							</div>
							<div class="col-sm-6 mb-4 mb-sm-0">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="{{ $kpis['coverage_area'] ?? 1 }}" data-append="" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Provincia Cubierta') }}</label>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="24" data-append="/7" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Atención Disponible') }}</label>
								</div>
							</div>
						</div>
					@else
						<div class="row counters text-dark ps-lg-4">
							<div class="col-sm-6 mb-5-5">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="5" data-append="+" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Años de Experiencia') }}</label>
								</div>
							</div>
							<div class="col-sm-6 mb-5-5">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="500" data-append="+" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Familias Protegidas') }}</label>
								</div>
							</div>
							<div class="col-sm-6 mb-4 mb-sm-0">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="1" data-append="" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Provincia Cubierta') }}</label>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="counter text-center text-sm-start">
									<strong class="text-color-primary text-13 line-height-5" data-to="24" data-append="/7" data-plugin-options="{'speed': 5000}">0</strong>
									<label class="font-weight-semibold text-5">{{ __('Atención Disponible') }}</label>
								</div>
							</div>
						</div>
					@endif
				</div>
			</div>
		</div>
	</section>

	{{-- Blog Section - Si está activo --}}
	@if(is_module_active('blog') || is_module_active('news'))
		@if(isset($recentPosts) && $recentPosts->count() > 0)
			<section class="section section-height-3 border-0 m-0">
				<div class="container">
					<div class="row">
						<div class="col text-center">
							<h2 class="text-color-dark font-weight-medium text-8 mb-4">{{ __('Nuestro') }} <strong>{{ __('Blog') }}</strong></h2>
						</div>
					</div>
					<div class="row justify-content-center">
						@foreach($recentPosts->take(3) as $index => $post)
							<div class="col-9 col-md-6 col-lg-4 mb-4 mb-lg-0">
								<a href="{{ route('blog.post', $post->slug) }}" class="custom-link-hover-effects text-decoration-none">
									<div class="card border-0 bg-transparent">
										<div class="card-img-top position-relative overlay">
											<div class="position-absolute bottom-10 right-0 d-flex justify-content-end w-100 py-3 px-4 z-index-3">
												<span class="custom-date-style-1 text-center bg-primary text-color-light font-weight-semibold line-height-2 px-3 py-2">
													<span class="position-relative text-6 z-index-2">
														{{ $post->created_at->format('d') }}
														<span class="d-block text-0 positive-ls-2 px-1">{{ strtoupper($post->created_at->format('M')) }}</span>
													</span>
												</span>
											</div>
											@if($post->header)
												<img src="{{ filter_var($post->header, FILTER_VALIDATE_URL) ? $post->header : asset($post->header) }}" class="img-fluid" alt="{{ $post->title }}" />
											@else
												<img src="{{ asset('cd-project/img/demos/insurance/blog/post-thumb-' . (($index % 3) + 1) . '.jpg') }}" class="img-fluid" alt="{{ $post->title }}" />
											@endif
										</div>
										<div class="card-body py-4 px-0">
											<span class="d-block text-color-grey font-weight-semibold positive-ls-2 text-2">{{ __('POR ADMIN') }}</span>
											<h4 class="font-weight-bold text-5 text-color-hover-primary mb-2">{{ $post->title }}</h4>
											<p class="text-3-5 mb-3">{{ \Illuminate\Support\Str::limit($post->description ?? $post->content, 100, '...') }}</p>
											<span class="custom-view-more d-inline-flex font-weight-semibold text-color-primary">
												{{ __('Ver Más') }}
												<img width="27" height="27" src="{{ asset('cd-project/img/demos/insurance/icons/arrow-right.svg') }}" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-fill-color-primary ms-2'}" style="width: 27px;" />
											</span>
										</div>
									</div>
								</a>
							</div>
						@endforeach
					</div>
				</div>
			</section>
		@endif
	@endif

	{{-- CTA Final Section - Estructura Original Porto --}}
	<section class="section section-height-3 bg-primary position-relative z-index-1 border-0 m-0">
		<div class="container">
			<div class="row align-items-center gy-5">
				<div class="col-xl-7 text-center text-xl-start">
					<h3 class="text-color-light font-weight-medium text-4 mb-1">{{ __('¿Buscás tranquilidad para tu familia?') }}</h3>
					<h2 class="text-color-light font-weight-bold mb-1">{{ __('Afiliate hoy y quedate tranquilo') }}</h2>
					<p class="text-color-light font-weight-semibold opacity-8 text-4 mb-0">{{ __('Plan de cobertura 100% digital. Previsión, simpleza y acompañamiento humano.') }}</p>
				</div>
				<div class="col-xl-5">
					<div class="d-flex flex-column flex-sm-row align-items-center justify-content-center justify-content-xl-end">
						<div class="d-inline-flex align-items-center mb-4 mb-sm-0">
							<i class="icons icon-phone text-7 text-color-light position-relative bottom-2"></i>
							<div class="ps-2">
								<span class="d-block text-2 font-weight-medium text-color-light line-height-1">{{ __('LLAMANOS AHORA') }}</span>
								<strong class="text-4"><a href="tel:{{ str_replace([' ', '-', '(', ')'], '', config('site.contact.phone')) }}" class="text-color-light text-decoration-none">{{ config('site.contact.phone') }}</a></strong>
							</div>
						</div>
						<div class="custom-divider px-3 me-3 ms-5-5 d-none d-sm-block"></div>
						<a href="{{ route('front.contact') }}" class="btn btn-light btn-rounded font-weight-bold border-0 text-color-dark text-3 px-5 btn-py-3">{{ __('COMENZAR AHORA') }}</a>
					</div>
				</div>
			</div>
		</div>
	</section>

</div>

@endsection