<?php
/**
 * Template name: HOME NEW
 *
 * @package far_loop
 */

get_header();

$fields = array_fill_keys( array(
	'dates',
	'subtitle',
	'hero_style',
	'featured_video',
	'custom_video',
	'custom_video_caption',
	'linked_image',
	'linked_image_link',
	'linked_image_caption',
	'sections',
), null );

foreach ( $fields as $field => $value ) {
	$fields[ $field ] = get_field( $field );
}

/**
 * Botón de acreditación. Lee los campos ACF de la página ACTUAL (no de un ID fijo):
 *   display_accreditation_button ('show' | 'hide'), link_accreditation_button, accreditation_image.
 * Si en esta página el campo nunca se ha guardado, usa como respaldo la portada del sitio.
 */
if ( ! function_exists( 'far_loop_accreditation_button' ) ) {
	function far_loop_accreditation_button() {
		$page_id = get_queried_object_id();
		if ( ! $page_id ) { $page_id = get_the_ID(); }

		$display_btn = get_field( 'display_accreditation_button', $page_id );

		// Respaldo: campo sin guardar en esta página -> valores de la portada
		if ( $display_btn === null || $display_btn === '' || $display_btn === false ) {
			$front_id = (int) get_option( 'page_on_front' );
			if ( $front_id && $front_id !== (int) $page_id ) {
				$page_id     = $front_id;
				$display_btn = get_field( 'display_accreditation_button', $page_id );
			}
		}

		if ( $display_btn !== 'show' ) { return; }

		$btn_url = get_field( 'link_accreditation_button', $page_id );
		$btn_img = get_field( 'accreditation_image', $page_id );
		if ( ! $btn_url ) { $btn_url = 'https://linktr.ee/loopbarcelona'; }
		if ( ! $btn_img ) { $btn_img = get_template_directory_uri() . '/img/acred-button.svg'; }
		?>
		<div class="acc-button-slide">
			<a href="<?php echo esc_url( $btn_url ); ?>" target="_blank" rel="noopener">
				<img src="<?php echo esc_url( $btn_img ); ?>" alt="<?php esc_attr_e( 'Accreditation', 'far_loop' ); ?>">
			</a>
		</div>
		<?php
	}
}

/**
 * Background Block: banda blanca centrada con las 4 fechas (dates_header_layout = 'block').
 * Orden: Loop Fair · Loop Festival · Loop Talks · Professional Days.
 */
if ( ! function_exists( 'far_loop_dates_block' ) ) {
	function far_loop_dates_block( $fair, $festival, $symposium, $pro ) {
		$items = array(
			array( __( 'Loop Fair', 'far_loop' ),         $fair ),
			array( __( 'Loop Festival', 'far_loop' ),     $festival ),
			array( __( 'Loop Talks', 'far_loop' ),        $symposium ),
			array( __( 'Professional Days', 'far_loop' ), $pro ),
		);
		echo '<div class="dates-block">';
		foreach ( $items as $it ) {
			if ( empty( $it[1] ) ) { continue; }
			echo '<div class="dates-block__item">';
			echo '<div class="dates-block__title">' . esc_html( $it[0] ) . '</div>';
			echo '<div class="dates-block__date">'  . esc_html( $it[1] ) . '</div>';
			echo '</div>';
		}
		echo '</div>';
	}
}
?>


<!--
<canvas id="bird-canvas"></canvas>
<div id="save-info"></div>
-->

<div class="u_pt-3 u_pt-md-6">






		<?php
		$header_display = get_field('home_header_layout');
		if ($header_display == 'image') { ?>

		<div class="home-hero home-hero-image">
			<!-- Image Home -->
			<div class="grid u_mt-4 header-home-image">
					<div class="header-home-video__wrapper">
						<figure class="cover-image"><img src="<?php the_field('home_header_image'); ?>"></figure>

							<?php
							$display_dates = get_field('display_dates'); // 'show' | 'hide'
							if ( $display_dates !== 'hide' ) :


							// Fechas (solo imprimimos las que existan)
							$dates_fair      = trim((string) get_field('date_fair'));
							$dates_festival  = trim((string) get_field('date_festival'));
							$dates_symposium = trim((string) get_field('dates_symposium'));
							$dates_pro = trim((string) get_field('dates_professional_days'));
							?>

							<?php
							// Recoge y normaliza el layout
							$dates_layout_raw = get_field('dates_header_layout'); // return format = value
							$dates_layout = strtolower( trim( (string) $dates_layout_raw ) );

							// Aceptamos sólo estos tres; por defecto 'row'
							$allowed = array( 'column', 'row', 'banner', 'block' );
							if ( ! in_array( $dates_layout, $allowed, true ) ) {
								$dates_layout = 'row';
							}
							?>
							<div class="festival-dates-header-home layout-<?php echo esc_attr( $dates_layout ); ?>">
							<?php switch ( $dates_layout ) :

								case 'banner': ?>

									<div class="container-scroll-dates">
									<div class="rail">
										<div class="text-banner">
										<span>
											<?php if ( !empty($dates_fair) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_festival) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_symposium) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_pro) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
										</span>
										<!-- duplicamos el mismo texto para efecto continuo -->
										<span>
											<?php if ( !empty($dates_fair) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_festival) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_symposium) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_pro) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
										</span>
										</div>
									</div>
									</div>

								<?php break;

								case 'block': ?>
									<!-- ===== Background Block: banda blanca centrada con las 4 fechas ===== -->
									<?php far_loop_dates_block( $dates_fair, $dates_festival, $dates_symposium, $dates_pro ); ?>
								<?php break;

								case 'column': ?>

								<!-- ===== Diseño en columnas (tabla vertical) ===== -->
								<table class="home-hero__dates">
									<tbody>
									<?php if ( !empty($dates_fair) ) : ?>
									<tr class="-fair">
										<th><span><?php esc_html_e('Fair', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_fair); ?></td>
									</tr>
									<?php endif; ?>

									<?php if ( !empty($dates_festival) ) : ?>
									<tr class="-festival">
										<th><span><?php esc_html_e('Festival', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_festival); ?></td>
									</tr>
									<?php endif; ?>

									<?php if ( !empty($dates_symposium) ) : ?>
									<tr class="-symposium">
										<th><span><?php esc_html_e('Talks', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_symposium); ?></td>
									</tr>
									<?php endif; ?>

									<?php if ( !empty($dates_pro) ) : ?>
									<tr class="-pro">
										<th><span><?php esc_html_e('Professional Days', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_pro); ?></td>
									</tr>
									<?php endif; ?>


									</tbody>
								</table>

								<?php break;

								case 'row':
								default: ?>
								<!-- ===== Diseño en filas (tres bloques alineados) ===== -->
								<div class="home-hero__dates-row">

								<?php if ( !empty($dates_pro) ) : ?>
									<div class="date-card -pro">
									<div class="date-card__title"><?php esc_html_e('Professional Days', 'far_loop'); ?></div>
									<div class="date-card__date"><?php echo esc_html($dates_pro); ?></div>
									</div>
								<?php endif; ?>


									<?php if ( !empty($dates_fair) ) : ?>
									<div class="date-card -fair">
									<div class="date-card__title"><?php esc_html_e('Fair', 'far_loop'); ?></div>
									<div class="date-card__date"><?php echo esc_html($dates_fair); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( !empty($dates_festival) ) : ?>
									<div class="date-card -festival">
									<div class="date-card__title"><?php esc_html_e('Festival', 'far_loop'); ?></div>
									<div class="date-card__date"><?php echo esc_html($dates_festival); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( !empty($dates_symposium) ) : ?>
									<div class="date-card -symposium">
									<div class="date-card__title"><?php esc_html_e('Talks', 'far_loop'); ?></div>
									<div class="date-card__date"><?php echo esc_html($dates_symposium); ?></div>
									</div>
									<?php endif; ?>




								</div>
								<?php break; ?>

							<?php endswitch; ?>
							</div>


							<?php endif; ?>



					</div>
			</div>
		</div>

		<?php } elseif ($header_display == 'video') { ?>

		<?php
		$video_url  = get_field('home_header_video'); // URL del archivo
		$video_text = get_field('home_header_text');
		?>

		<div class="home-hero home-hero-video">
		<?php if ( $video_url ) : ?>
			<div class="grid header-home-video">
				<div class="header-home-video__wrapper">
					<video autoplay muted loop playsinline class="header-home-video__video">
					<source src="<?php echo esc_url($video_url); ?>" type="video/mp4">
					<?php esc_html_e('Your browser does not support the video tag.', 'far_loop'); ?>
					</video>
					<?php if ( $video_text ) : ?>
					<div class="header-home-video__overlay">
						<?php echo $video_text; ?>
					</div>
					<?php endif; ?>


							<?php
							$display_dates = get_field('display_dates'); // 'show' | 'hide'
							if ( $display_dates !== 'hide' ) :

							// 'column' (por defecto) o 'row'
							$dates_layout = get_field('dates_header_layout');
							if ( ! in_array($dates_layout, array('column','row','banner','block'), true) ) {
								$dates_layout = 'column';
							}

							// Fechas (solo imprimimos las que existan)
							$dates_fair      = trim((string) get_field('date_fair'));
							$dates_festival  = trim((string) get_field('date_festival'));
							$dates_symposium = trim((string) get_field('dates_symposium'));
							$dates_pro = trim((string) get_field('dates_professional_days'));
							?>

							<div class="festival-dates-header-home layout-<?php echo esc_attr($dates_layout); ?>">

								<?php if ( $dates_layout === 'column' ) : ?>
								<!-- ===== Diseño en columnas (tabla vertical, como ahora) ===== -->
								<table class="home-hero__dates">
									<tbody>
									<?php if ( $dates_fair ) : ?>
										<tr class="-fair">
										<th><span><?php esc_html_e('Fair', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_fair); ?></td>
										</tr>
									<?php endif; ?>

									<?php if ( $dates_festival ) : ?>
										<tr class="-festival">
										<th><span><?php esc_html_e('Festival', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_festival); ?></td>
										</tr>
									<?php endif; ?>

									<?php if ( $dates_symposium ) : ?>
										<tr class="-symposium">
										<th><span><?php esc_html_e('Talks', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_symposium); ?></td>
										</tr>
									<?php endif; ?>

									<?php if ( !empty($dates_pro) ) : ?>
									<tr class="-pro">
										<th><span><?php esc_html_e('Professional Days', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_pro); ?></td>
									</tr>
									<?php endif; ?>

									</tbody>
								</table>


								<?php elseif ( $dates_layout === 'banner' ) : ?>

								<!-- ===== Diseño scroll/marquee ===== -->
								<div class="container-scroll-dates">
								<div class="rail">
									<div class="text-banner">
									<span>
										<?php if ( !empty($dates_fair) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
										<?php if ( !empty($dates_festival) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
										<?php if ( !empty($dates_symposium) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
										<?php if ( !empty($dates_pro) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
									</span>
									<!-- duplicamos el mismo texto para efecto continuo -->
									<span>
										<?php if ( !empty($dates_fair) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
										<?php if ( !empty($dates_festival) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
										<?php if ( !empty($dates_symposium) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
										<?php if ( !empty($dates_pro) ) : ?>
										<span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span>
										<span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span>
										<span class="date-scroll__separator">•</span>
										<?php endif; ?>
									</span>
									</div>
								</div>
								</div>

								<?php elseif ( $dates_layout === 'block' ) : ?>
								<!-- ===== Background Block: banda blanca centrada con las 4 fechas ===== -->
								<?php far_loop_dates_block( $dates_fair, $dates_festival, $dates_symposium, $dates_pro ); ?>

								<?php else : ?>
								<!-- ===== Diseño en filas (tres bloques alineados) ===== -->
								<div class="home-hero__dates-row">

									<?php if ( $dates_pro ) : ?>
									<div class="date-card -pro">
										<div class="date-card__title"><?php esc_html_e('Professional Days', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_pro); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( $dates_fair ) : ?>
									<div class="date-card -fair">
										<div class="date-card__title"><?php esc_html_e('Fair', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_fair); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( $dates_festival ) : ?>
									<div class="date-card -festival">
										<div class="date-card__title"><?php esc_html_e('Festival', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_festival); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( $dates_symposium ) : ?>
									<div class="date-card -symposium">
										<div class="date-card__title"><?php esc_html_e('Talks', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_symposium); ?></div>
									</div>
									<?php endif; ?>


								</div>
								<?php endif; ?>

							</div>
							<?php endif; ?>




				</div>
			</div>
		<?php endif; ?>
		</div>

		<?php } elseif ($header_display == 'multiplevideo') {

			// ==== NUEVA LAYOUT: Multiple Video (vídeo de fondo + bolsa SVG, ambos aleatorios en cada recarga) ====

			// URLs de los vídeos del repeater 'multiple_video_home' (sub campo 'video_slide')
			$mv_slides = get_field('multiple_video_home');
			$mv_urls   = array();
			if ( $mv_slides ) {
				foreach ( $mv_slides as $mv ) {
					$vf = isset($mv['video_slide']) ? $mv['video_slide'] : null;
					if ( is_array($vf) )       { $vurl = isset($vf['url']) ? $vf['url'] : ''; }
					elseif ( is_numeric($vf) ) { $vurl = wp_get_attachment_url($vf); }
					else                       { $vurl = $vf; }
					if ( $vurl ) { $mv_urls[] = esc_url($vurl); }
				}
			}

			// URLs de las bolsas (assets del tema: /assets/loop-bag/)
			$bag_base = get_stylesheet_directory_uri() . '/assets/loop-bag/';
			$bag_urls = array(
				$bag_base . 'loop-bag-1.json?v=4',
				$bag_base . 'loop-bag-2.json?v=4',
				$bag_base . 'loop-bag-3.json?v=4',
				$bag_base . 'loop-bag-4.json?v=4',
			);

			// Estilo de la animación de la bolsa:
			//   'raw' (POR DEFECTO) = stop-motion: corte seco, sin fundido y sin brisa
			//   'smooth'            = lenta, interpolada y con brisa
			// Se puede cambiar con el campo ACF opcional 'bag_animation_style' (valores: raw / smooth)
			// o forzar desde la URL:  ?bag=smooth   (y ?bag=raw para volver)
			$bag_style = get_field('bag_animation_style');
			if ( isset($_GET['bag']) ) { $bag_style = sanitize_key( wp_unslash($_GET['bag']) ); }
			if ( $bag_style !== 'smooth' ) { $bag_style = 'raw'; }

			$video_text = get_field('home_header_text');
		?>

		<div class="home-hero home-hero-video home-hero-multiplevideo">
			<div class="grid header-home-video">
				<div class="header-home-video__wrapper">

					<!-- Vídeo de fondo (aleatorio en cada recarga, vía JS) -->
					<video class="header-home-video__video loop-bg" autoplay muted loop playsinline preload="auto"></video>

					<!-- Bolsa SVG superpuesta (aleatoria en cada recarga) -->
					<div class="loop-bag"></div>

					<?php if ( $video_text ) : ?>
					<div class="header-home-video__overlay">
						<?php echo $video_text; ?>
					</div>
					<?php endif; ?>

					<?php
					// ===== Bloque de fechas (idéntico a la layout 'video') =====
					$display_dates = get_field('display_dates'); // 'show' | 'hide'
					if ( $display_dates !== 'hide' ) :

						$dates_layout = get_field('dates_header_layout');
						if ( ! in_array($dates_layout, array('column','row','banner','block'), true) ) {
							$dates_layout = 'column';
						}

						$dates_fair      = trim((string) get_field('date_fair'));
						$dates_festival  = trim((string) get_field('date_festival'));
						$dates_symposium = trim((string) get_field('dates_symposium'));
						$dates_pro       = trim((string) get_field('dates_professional_days'));
					?>

					<div class="festival-dates-header-home layout-<?php echo esc_attr($dates_layout); ?>">

						<?php if ( $dates_layout === 'column' ) : ?>
						<table class="home-hero__dates">
							<tbody>
							<?php if ( $dates_fair ) : ?>
								<tr class="-fair"><th><span><?php esc_html_e('Fair', 'far_loop'); ?></span></th><td><?php echo esc_html($dates_fair); ?></td></tr>
							<?php endif; ?>
							<?php if ( $dates_festival ) : ?>
								<tr class="-festival"><th><span><?php esc_html_e('Festival', 'far_loop'); ?></span></th><td><?php echo esc_html($dates_festival); ?></td></tr>
							<?php endif; ?>
							<?php if ( $dates_symposium ) : ?>
								<tr class="-symposium"><th><span><?php esc_html_e('Talks', 'far_loop'); ?></span></th><td><?php echo esc_html($dates_symposium); ?></td></tr>
							<?php endif; ?>
							<?php if ( $dates_pro ) : ?>
								<tr class="-pro"><th><span><?php esc_html_e('Professional Days', 'far_loop'); ?></span></th><td><?php echo esc_html($dates_pro); ?></td></tr>
							<?php endif; ?>
							</tbody>
						</table>

						<?php elseif ( $dates_layout === 'banner' ) : ?>
						<div class="container-scroll-dates">
						<div class="rail">
							<div class="text-banner">
							<?php for ( $i = 0; $i < 2; $i++ ) : ?>
							<span>
								<?php if ( !empty($dates_fair) ) : ?><span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span><span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span><span class="date-scroll__separator">•</span><?php endif; ?>
								<?php if ( !empty($dates_festival) ) : ?><span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span><span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span><span class="date-scroll__separator">•</span><?php endif; ?>
								<?php if ( !empty($dates_symposium) ) : ?><span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span><span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span><span class="date-scroll__separator">•</span><?php endif; ?>
								<?php if ( !empty($dates_pro) ) : ?><span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span><span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span><span class="date-scroll__separator">•</span><?php endif; ?>
							</span>
							<?php endfor; ?>
							</div>
						</div>
						</div>

						<?php elseif ( $dates_layout === 'block' ) : ?>
						<!-- ===== Background Block: banda blanca centrada con las 4 fechas ===== -->
						<?php far_loop_dates_block( $dates_fair, $dates_festival, $dates_symposium, $dates_pro ); ?>

						<?php else : ?>
						<div class="home-hero__dates-row">
							<?php if ( $dates_pro ) : ?>
							<div class="date-card -pro"><div class="date-card__title"><?php esc_html_e('Professional Days', 'far_loop'); ?></div><div class="date-card__date"><?php echo esc_html($dates_pro); ?></div></div>
							<?php endif; ?>
							<?php if ( $dates_fair ) : ?>
							<div class="date-card -fair"><div class="date-card__title"><?php esc_html_e('Fair', 'far_loop'); ?></div><div class="date-card__date"><?php echo esc_html($dates_fair); ?></div></div>
							<?php endif; ?>
							<?php if ( $dates_festival ) : ?>
							<div class="date-card -festival"><div class="date-card__title"><?php esc_html_e('Festival', 'far_loop'); ?></div><div class="date-card__date"><?php echo esc_html($dates_festival); ?></div></div>
							<?php endif; ?>
							<?php if ( $dates_symposium ) : ?>
							<div class="date-card -symposium"><div class="date-card__title"><?php esc_html_e('Talks', 'far_loop'); ?></div><div class="date-card__date"><?php echo esc_html($dates_symposium); ?></div></div>
							<?php endif; ?>
						</div>
						<?php endif; ?>

					</div>
					<?php endif; ?>

				</div>
			</div>

			<?php far_loop_accreditation_button(); // botón de acreditación (según los campos de ESTA página) ?>

			<!-- Reproductor de la bolsa + selección aleatoria de vídeo y bolsa -->
			<script src="<?php echo esc_url($bag_base . 'loop-bag.js?v=5'); ?>"></script>
			<script>
			(function(){
				var videos = <?php echo wp_json_encode($mv_urls); ?>;
				var bags   = <?php echo wp_json_encode($bag_urls); ?>;
				var hero = document.querySelector('.home-hero-multiplevideo');
				if (!hero) return;

				// Vídeo de fondo aleatorio
				var vid = hero.querySelector('.loop-bg');
				if (videos.length && vid) {
					var vu = videos[(Math.random() * videos.length) | 0];
					vid.muted = true;
					vid.src = vu;
					vid.load();
					vid.play().catch(function(){});
				}

				// Bolsa SVG aleatoria, con escala proporcional a la pantalla
				var bagEl = hero.querySelector('.loop-bag');
				if (bags.length && bagEl && window.LoopBag) {
					var bu = bags[(Math.random() * bags.length) | 0];

					// Modo de encaje según la proporción REAL del hero:
					//  - Pantalla ancha (desktop): 'cover' + overscan, con escala compensada (=> 0.5, valor aprobado).
					//  - Pantalla estrecha/vertical (tablet, móvil): 'width' sin overscan => el recorrido completo
					//    de la bolsa cabe en el ancho del viewport y queda centrado; la bolsa nunca sale de pantalla.
					// ===== TAMAÑO DE LA BOLSA (ajústalo aquí) =====
					var SCALE_DESKTOP = 0.5;   // pantallas anchas (desktop, tablet/móvil en horizontal)
					var SCALE_MOBILE  = 0.8;   // pantallas verticales/estrechas (móvil y tablet en vertical)

					var bagLayout = function(){
						var r = bagEl.getBoundingClientRect();
						var w = r.width  || window.innerWidth  || 1440;
						var h = r.height || window.innerHeight || 900;
						var cov = Math.min(1, (w / h) * 9 / 16);     // 1 = 'cover' no amplía el encuadre
						if (cov >= 0.85) {
							return { fit: 'cover', overscan: 1.3, scale: Math.max(0.12, Math.min(SCALE_DESKTOP, SCALE_DESKTOP * 1.112 * cov)) };
						}
						// 'stretch': el RECORRIDO de la bolsa se estira a todo el hero (ancho y alto) sin deformar
						// la bolsa: vuela por toda la pantalla y entra/sale por los bordes reales del hero.
						// (La bolsa va por encima de las franjas de texto, así que ya no hace falta confinarla.)
						return { fit: 'stretch', overscan: 1, scale: SCALE_MOBILE };
					};

					// Estilo de movimiento (elegido en PHP: campo ACF 'bag_animation_style' o ?bag=raw)
					var bagStyle = <?php echo wp_json_encode($bag_style); ?>;
					var S = (bagStyle === 'raw')
						// RAW / stop-motion: lenta (8 poses por segundo ≈ 0,32× de la velocidad original),
						// corte seco sin fundido y sin balanceo de brisa.
						// Más lenta => baja fps (p. ej. 6). Más "a saltos" => step: 2.
						? { fps: 8,   step: 1, hold: 1,   wind: 'off' }
						// SMOOTH (actual): lenta, interpolada y con brisa.
						: { fps: 9.5, step: 1, hold: 0.2, wind: 'on'  };

					// Ajustes propios del estilo RAW: bolsa un 20% más pequeña y animación desplazada
					// hacia la zona media-superior del hero. (El estilo smooth no se toca.)
					var RAW        = (bagStyle === 'raw');
					var RAW_SCALE  = 0.8;   // 0.8 = 20% más pequeña
					var RAW_SHIFT  = 5;    // % del alto del hero que sube la animación (pantallas anchas)
					var applyStyle = function(L){
						if (RAW) { L.scale = L.scale * RAW_SCALE; }
						// En vertical el CSS ya confina la animación a la zona superior: solo se sube en formato ancho.
						bagEl.style.transform = (RAW && L.fit === 'cover') ? 'translateY(-' + RAW_SHIFT + '%)' : '';
						return L;
					};

					var L = applyStyle(bagLayout());
					var bagInst = new LoopBag(bagEl, {
						src: bu,
						fps: S.fps, step: S.step, hold: S.hold, wind: S.wind,
						fit: L.fit, overscan: L.overscan, scale: L.scale
					});

					// Recalcular al redimensionar o girar el dispositivo
					var bagRT;
					window.addEventListener('resize', function(){
						clearTimeout(bagRT);
						bagRT = setTimeout(function(){
							var L2 = applyStyle(bagLayout());
							bagInst.setFit(L2.fit);
							bagInst.overscan = L2.overscan;
							bagInst.setScale(L2.scale);
						}, 150);
					});
				}
			})();
			</script>

		</div>

		<?php } else { ?>

		<div class="home-hero home-hero-slide">
			<!-- Slide Home -->
			<div class="slide-home-container">
				<div class="swiper-container">
					<div class="swiper-wrapper">
						<?php if( have_rows('slide_home') ):
								while( have_rows('slide_home') ): the_row();
									$image = get_sub_field('image_slide_home'); ?>

										<div class="swiper-slide">
											<?php if($image): ?>
												<img class="image-slide-home" src="<?php echo $image; ?>" />
											<?php endif; ?>
										</div>
									<?php endwhile; ?>




							<?php endif; ?>
					</div>

							<?php
							$display_dates = get_field('display_dates'); // 'show' | 'hide'
							if ( $display_dates !== 'hide' ) :

							// 'column' (por defecto) o 'row'
							$dates_layout = get_field('dates_header_layout');
							if ( ! in_array($dates_layout, array('column','row','banner','block'), true) ) {
								$dates_layout = 'column';
							}

							// Fechas (solo imprimimos las que existan)
							$dates_fair      = trim((string) get_field('date_fair'));
							$dates_festival  = trim((string) get_field('date_festival'));
							$dates_symposium = trim((string) get_field('dates_symposium'));
							$dates_pro = trim((string) get_field('dates_professional_days'));
							?>

							<div class="festival-dates-header-home layout-<?php echo esc_attr($dates_layout); ?>">

								<?php if ( $dates_layout === 'column' ) : ?>
								<!-- ===== Diseño en columnas (tabla vertical, como ahora) ===== -->
								<table class="home-hero__dates">
									<tbody>
									<?php if ( $dates_fair ) : ?>
										<tr class="-fair">
										<th><span><?php esc_html_e('Fair', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_fair); ?></td>
										</tr>
									<?php endif; ?>

									<?php if ( $dates_festival ) : ?>
										<tr class="-festival">
										<th><span><?php esc_html_e('Festival', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_festival); ?></td>
										</tr>
									<?php endif; ?>

									<?php if ( $dates_symposium ) : ?>
										<tr class="-symposium">
										<th><span><?php esc_html_e('Talks', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_symposium); ?></td>
										</tr>
									<?php endif; ?>

									<?php if ( $dates_pro ) : ?>
										<tr class="-pro">
										<th><span><?php esc_html_e('Professional Days', 'far_loop'); ?></span></th>
										<td><?php echo esc_html($dates_pro); ?></td>
										</tr>
									<?php endif; ?>
									</tbody>
								</table>

								<?php elseif ( $dates_layout === 'banner' ) : ?>

									<!-- ===== Diseño scroll/marquee ===== -->
									<div class="container-scroll-dates">
									<div class="rail">
										<div class="text-banner">
										<span>
											<?php if ( !empty($dates_fair) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_festival) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_symposium) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_pro) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
										</span>
										<!-- duplicamos el mismo texto para efecto continuo -->
										<span>
											<?php if ( !empty($dates_fair) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Fair', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_fair); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_festival) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Festival', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_festival); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_symposium) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Talks', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_symposium); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
											<?php if ( !empty($dates_pro) ) : ?>
											<span class="date-scroll__title"><?php esc_html_e('Professional Days', 'far_loop'); ?> </span>
											<span class="date-scroll__date"><?php echo esc_html($dates_pro); ?></span>
											<span class="date-scroll__separator">•</span>
											<?php endif; ?>
										</span>
										</div>
									</div>
									</div>

								<?php elseif ( $dates_layout === 'block' ) : ?>
								<!-- ===== Background Block: banda blanca centrada con las 4 fechas ===== -->
								<?php far_loop_dates_block( $dates_fair, $dates_festival, $dates_symposium, $dates_pro ); ?>

								<?php else : ?>
								<!-- ===== Diseño en filas (tres bloques alineados) ===== -->
								<div class="home-hero__dates-row">

									<?php if ( $dates_pro ) : ?>
									<div class="date-card -pro">
										<div class="date-card__title"><?php esc_html_e('Professional Days', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_pro); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( $dates_fair ) : ?>
									<div class="date-card -fair">
										<div class="date-card__title"><?php esc_html_e('Fair', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_fair); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( $dates_festival ) : ?>
									<div class="date-card -festival">
										<div class="date-card__title"><?php esc_html_e('Festival', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_festival); ?></div>
									</div>
									<?php endif; ?>

									<?php if ( $dates_symposium ) : ?>
									<div class="date-card -symposium">
										<div class="date-card__title"><?php esc_html_e('Talks', 'far_loop'); ?></div>
										<div class="date-card__date"><?php echo esc_html($dates_symposium); ?></div>
									</div>
									<?php endif; ?>


								</div>
								<?php endif; ?>

							</div>
							<?php endif; ?>
				</div>
			</div>

				<?php $slide_text = get_field('home_header_text');
				if ( $slide_text ) : ?>
					<div class="header-home-slide__overlay">
						<?php echo $slide_text; ?>
					</div>
				<?php endif; ?>




<?php far_loop_accreditation_button(); // botón de acreditación (según los campos de ESTA página) ?>




			<!--
			<div class="birds-button">
				<a href="https://loop-barcelona.com/birds-gallery/" target="_blank" class="birds-icon"></a>
			</div>
			-->





		</div>


	<?php } ?>







		<!-- BLOCK NEWS -->
		<div class="l_container u_pt-3">
			<?php $page_for_posts = get_option( 'page_for_posts' ); ?>
			<!--
				<div class="view-all-home-new">
					<a href="<?php echo esc_url( get_permalink( $page_for_posts ) ); ?>" class="home-pillar__cta">
						<span class="home-pillar__cta-text"><?php _e('View all news', 'far_loop');?></span>
					</a>
				</div>
			-->

			<?php
			$columns_class = get_field('columns_news_home'); // 'four', 'three' o 'mixed'
			if ( ! $columns_class ) {
			$columns_class = 'four'; // fallback por defecto si no está definido
			}
			?>
			<div class="<?php echo esc_attr( $columns_class ); ?>-cols-home-news">
				<?php get_template_part( 'template-parts/front-page-featured-new' ); ?>
			</div>
		</div>


		<?php
		$agenda_visibility = get_field('agenda_home_visibility'); // devuelve 'show' o 'hide'
		?>









		<?php if ( $agenda_visibility !== 'hide' ) : ?>
		<!-- BLOCK AGENDA -->
		<div class="l_container u_pt-2 block-agenda-home">

			<h3 class="section-heading delta"><span class="u_text-underline">Agenda</span></h3>

			<?php
				$featured_events = get_field('agenda_featured_activities'); // array de WP_Post
				if ( ! empty($featured_events) && is_array($featured_events) ) : ?>

				<!-- Vista Texto -->
				<div class="agenda-grid-text agenda-view-text">
					<?php
					global $post;
					$old_post = $post;

					foreach ( $featured_events as $event_post ) :
					// Normalizar a objeto
					$post = is_object($event_post) ? $event_post : get_post((int)$event_post);
					if ( ! $post ) { continue; }
					setup_postdata($post);

					// ======= Fecha / clase de fecha =======
					$dates            = get_field('dates', $post->ID); // repeater
					$event_start_date = '';
					if ( ! empty($dates) && is_array($dates) && ! empty($dates[0]['start_date']) ) {
						$event_start_date = $dates[0]['start_date']; // se asume ISO y/o strtotime-compatible
					}
					$date_class = '';
					if ( $event_start_date ) {
						$date_label = date_i18n( 'j M', strtotime( $event_start_date ) );
						$date_class = strtolower( str_replace( ' ', '-', $date_label ) );
					}

					// ======= Taxonomías / clases por categoría =======
					$terms            = get_the_terms( get_the_ID(), 'activity-type' );
					$category_classes = '';
					$parent_class     = 'festival'; // por defecto

					if ( $terms && ! is_wp_error( $terms ) ) {
						foreach ( $terms as $term ) {
						$slug              = $term->slug;
						$category_classes .= ' ' . sanitize_html_class( $slug );

						if ( in_array( $slug, array( 'panel', 'conference', 'talk' ), true ) ) {
							$parent_class = 'symposium';
						} elseif ( in_array( $slug, array( 'professional-meeting', 'professional-meetings' ), true ) ) {
							$parent_class = 'fair';
						}
						}
					}

					// ======= Output item (igual que ejemplo) =======
					echo '<div class="agenda-text-item agenda-list'
							. esc_attr( $category_classes )
							. ( $date_class ? ' ' . esc_attr( $date_class ) : '' )
							. ' ' . esc_attr( $parent_class )
							. '">';

					// Partial existente (si lo tienes). Si no, puedes reemplazar por markup inline.
					get_template_part( 'template-parts/content-agenda-text' );

					echo '</div>';

					endforeach;

					wp_reset_postdata();
					$post = $old_post;
					?>
				</div>

				<?php endif; ?>

		</div>
		<?php endif; ?>






		<?php
		$fair_video_home_visibility = get_field('fair_video_home_visibility'); // 'show' | 'hide'
		if ( $fair_video_home_visibility !== 'hide' ) : ?>
		<div class="l_container u_pt-2 block-videofair-home">
			<h3 class="section-heading delta section-heading-slide"><span class="u_text-underline">Loop Fair Video Selection</span></h3>
		<?php
		$videos_sel = get_field('fair_home_video_selection'); // array de posts/IDs
		if ( ! empty($videos_sel) && is_array($videos_sel) ) :

			// Normalizamos a posts
			$videos = [];
			foreach ( $videos_sel as $v ) {
			$videos[] = is_object($v) ? $v : get_post((int)$v);
			}
			$videos = array_filter($videos);

			if ( ! empty($videos) ) :
			// IDs únicos para esta instancia
			$root_id  = 'fair-home-vid-' . uniqid();
			$swiper_id= $root_id . '-swiper';
			$prev_id  = $root_id . '-prev';
			$next_id  = $root_id . '-next';
			$count    = count($videos);
		?>
			<!-- === FAIR HOME VIDEOS (SLIDE) === -->
			<div class="awards-past awards-past--slider" data-fair-videos-swiper-root="<?php echo esc_attr($root_id); ?>">
				<div class="swiper awards-past-swiper video-fair-home-swiper"
					id="<?php echo esc_attr($swiper_id); ?>"
					data-items-count="<?php echo esc_attr($count); ?>"
					style="opacity:0; transition:opacity .2s;">

				<!-- Controles -->
				<div class="swiper-nav">
					<button class="swiper-btn prev" id="<?php echo esc_attr($prev_id); ?>" aria-label="<?php esc_attr_e('Previous','far_loop'); ?>">&larr;</button>
					<button class="swiper-btn next" id="<?php echo esc_attr($next_id); ?>" aria-label="<?php esc_attr_e('Next','far_loop'); ?>">&rarr;</button>
				</div>

				<div class="swiper-wrapper">
					<?php foreach ( $videos as $video ) :
					$vid_id  = (int) $video->ID;
					$url     = get_permalink($vid_id);

					// Imagen de portada
					$cover   = get_field('cover_image', $vid_id);
					$src     = (!empty($cover) && !empty($cover['url'])) ? $cover['url'] : get_template_directory_uri().'/img/horizontal-placeholder.svg';

					// Año
					$year    = get_field('year', $vid_id);

					// Autores
					$authors = get_field('author', $vid_id);
					$authors_string = function_exists('get_authors_string') ? get_authors_string($authors) : '';

					// Gallery (nombre + ciudad)
					$gallery = get_field('gallery', $vid_id);
					$gallery_string = '';
					if ( $gallery ) {
						$gid     = is_object($gallery) ? $gallery->ID : (int)$gallery;
						$g_title = get_the_title($gid);
						$addr    = get_field('address', $gid);
						$g_city  = (!empty($addr[0]['city'])) ? $addr[0]['city'] : '';
						$gallery_string = trim( $g_title . ( $g_city ? " ($g_city)" : '' ) );
					}

					// Edición (si existe; aquí no hay $term->name)
					$editions = get_the_terms($vid_id, 'edition');
					$edition_label = (!empty($editions) && !is_wp_error($editions)) ? $editions[0]->name : '';
					?>
					<div class="swiper-slide">
						<div class="archive-item">
						<a href="<?php echo esc_url($url); ?>" class="archive-new-thumb">
							<div class="archive-thumb__image-container award">
							<img src="<?php echo esc_url($src); ?>" alt="<?php echo esc_attr(get_the_title($vid_id)); ?>">
							</div>
							<div class="archive-thumb__text">
							<h3 class="archive-thumb__title">
								<?php echo esc_html( get_the_title($vid_id) ); ?>
								<?php if ( !empty($year) ) echo ' (' . esc_html($year) . ')'; ?>
							</h3>

							<div class="archive-thumb__label">
								<?php if ( $authors_string ): ?>
								<div class="awards-past-thumb__title"><?php echo esc_html($authors_string); ?></div>
								<?php endif; ?>
								<?php if ( $gallery_string ): ?>
								<!-- <div class="awards-past-thumb__title awards-past-thumb__galery"><?php echo esc_html($gallery_string); ?></div>-->
								<?php endif; ?>
							</div>

							<?php if ( $edition_label ) : ?>
								<div class="archive-thumb__year"><?php echo esc_html($edition_label); ?></div>
							<?php endif; ?>
							</div>
						</a>
						</div>
					</div>
					<?php endforeach; ?>
				</div><!-- /.swiper-wrapper -->
				</div><!-- /.swiper -->
			</div><!-- /.awards-past -->





		<?php
			endif;
		endif;?>
		</div>
		<?php endif;?>












		<?php
$videocloop_home_visibility = get_field('videocloop_home_visibility'); // 'show' | 'hide'
if ( $videocloop_home_visibility !== 'hide' ) : ?>
  <div class="l_container u_pt-5 videocloop-home-wrapper">
    <h3 class="section-heading delta section-heading-slide">
      <span class="u_text-underline">VIDEOCLOOP Selection</span>
    </h3>
    <?php
    $videos_sel = get_field('videocloop_home_video_selection'); // array de posts/IDs
    if ( ! empty($videos_sel) && is_array($videos_sel) ) :

      // Normalizar a posts
      $videos = [];
      foreach ( $videos_sel as $v ) {
        $post_obj = is_object($v) ? $v : get_post((int)$v);
        if ( $post_obj ) $videos[] = $post_obj;
      }

      if ( ! empty($videos) ) :
        // IDs únicos para esta instancia
        $root_id   = 'videocloop-home-vid-' . uniqid();
        $swiper_id = $root_id . '-swiper';
        $prev_id   = $root_id . '-prev';
        $next_id   = $root_id . '-next';
        $count     = count($videos);
    ?>
      <!-- === VIDEOcloop HOME VIDEOS (SLIDE) === -->
      <div class="awards-past awards-past--slider" data-videocloop-videos-swiper-root="<?php echo esc_attr($root_id); ?>">
        <div class="swiper awards-past-swiper videocloop-home-swiper"
             id="<?php echo esc_attr($swiper_id); ?>"
             data-items-count="<?php echo esc_attr($count); ?>"
             style="opacity:0; transition:opacity .2s;">

			<!-- Controles -->
			<div class="swiper-nav">
				<button class="swiper-btn prev" id="<?php echo esc_attr($prev_id); ?>" aria-label="<?php esc_attr_e('Previous','far_loop'); ?>">&larr;</button>
				<button class="swiper-btn next" id="<?php echo esc_attr($next_id); ?>" aria-label="<?php esc_attr_e('Next','far_loop'); ?>">&rarr;</button>
			</div>

			<div class="swiper-wrapper">
				<?php foreach ( $videos as $video ) :
					$vid_id = (int) $video->ID;

					// Forzamos la URL al patrón /videocloop/video/{slug}/
					$slug = is_object($video) ? $video->post_name : get_post_field('post_name', $vid_id);
					$target_path = '/videocloop/video/' . $slug . '/';
					$url = home_url( $target_path );

					// Si usas WPML y quieres asegurar el idioma actual:
					if ( defined('ICL_LANGUAGE_CODE') && function_exists('apply_filters') ) {
						$url = apply_filters( 'wpml_permalink', $url, ICL_LANGUAGE_CODE );
					}

					// Imagen de portada
					$cover = get_field('cover_image', $vid_id);
					$src   = (!empty($cover['url'])) ? $cover['url'] : get_template_directory_uri().'/img/horizontal-placeholder.svg';

					// Año
					$year  = get_field('year', $vid_id);

					// Autores
					$authors = get_field('author', $vid_id);
					$authors_string = function_exists('get_authors_string') ? get_authors_string($authors) : '';

					// Edición
					$editions = get_the_terms($vid_id, 'edition');
					$edition_label = (!empty($editions) && !is_wp_error($editions)) ? $editions[0]->name : '';
				?>
					<div class="swiper-slide">
						<div class="archive-item">
							<a href="<?php echo esc_url($url); ?>" class="archive-new-thumb">
								<div class="archive-thumb__image-container award">
									<img src="<?php echo esc_url($src); ?>" alt="<?php echo esc_attr(get_the_title($vid_id)); ?>">
								</div>
								<div class="archive-thumb__text">
									<h3 class="archive-thumb__title">
										<?php echo esc_html( get_the_title($vid_id) ); ?>
										<?php if ( !empty($year) ) echo ' (' . esc_html($year) . ')'; ?>
									</h3>

									<div class="archive-thumb__label">
										<?php if ( $authors_string ): ?>
											<div class="awards-past-thumb__title"><?php echo esc_html($authors_string); ?></div>
										<?php endif; ?>
									</div>

									<?php if ( $edition_label ) : ?>
										<div class="archive-thumb__year"><?php echo esc_html($edition_label); ?></div>
									<?php endif; ?>
								</div>
							</a>
						</div>
					</div>
				<?php endforeach; ?>
			</div><!-- /.swiper-wrapper -->



        </div><!-- /.swiper -->
      </div><!-- /.awards-past -->



    <?php
      endif;
    endif; ?>
  </div>
<?php endif; ?>


















		<?php
		$video_channel_visibility = get_field('video_channel_visibility'); // 'show' | 'hide'
		$video_channel_display    = get_field('video_channel_display');    // 'slide' | 'col'

		if ( $video_channel_visibility !== 'hide' ) :

		// Detectar idioma actual (Polylang o WPML)
		$current_lang = null;
		if ( function_exists('pll_current_language') ) {
			$current_lang = pll_current_language('slug');
		} elseif ( function_exists('apply_filters') ) {
			$current_lang = apply_filters('wpml_current_language', null);
		}

		// Query SOLO en el idioma actual
		$query_args = array(
			'post_type'      => 'video-conference',
			'posts_per_page' => -1,
			'orderby'        => 'date',
			'order'          => 'DESC',
			// WPML: deja que aplique su filtro de idioma
			'suppress_filters' => false,
		);

		// Polylang: especifica idioma
		if ( $current_lang && function_exists('pll_current_language') ) {
			$query_args['lang'] = $current_lang;
		}

		$videos = get_posts( $query_args );

		if ( ! empty($videos) ) :

			// Normalizamos datos para reutilizar en ambas vistas
			$items   = [];
			foreach ( $videos as $video ) {
			$cover    = get_field('cover_image', $video->ID);
			$img      = !empty($cover['url']) ? $cover['url'] : get_template_directory_uri().'/img/horizontal-placeholder.svg';
			$speakers = get_field('speakers', $video->ID);
			$items[] = [
				'url'      => get_permalink($video->ID),
				'img'      => $img,
				'title'    => get_the_title($video->ID),
				'speakers' => $speakers ? get_authors_string($speakers) : '',
			];
			}
			$count   = count($items);
			$root_id = 'video-channel-' . uniqid();
			?>

			<!-- VIDEO CHANNEL -->
			<div class="l_container u_pt-3 videochannel-home-wrapper">
			<h3 class="section-heading delta section-heading-slide"><span class="u_text-underline"><?php esc_html_e('Video Channel', 'far_loop'); ?></span></h3>

			<?php if ( $video_channel_display === 'col' ) : ?>
				<!-- ====== GRID (solo 3 primeros) ====== -->
				<div class="archive-grid">
				<?php
				$max = min(3, $count);
				for ( $i = 0; $i < $max; $i++ ) :
					$it = $items[$i];
				?>
					<div class="archive-item archive-item-channel-home">
					<a class="archive-new-thumb" href="<?php echo esc_url($it['url']); ?>">
						<div class="archive-thumb__image-container video-conference">
						<img src="<?php echo esc_url($it['img']); ?>" alt="<?php echo esc_attr($it['title']); ?>">
						</div>
						<div class="archive-thumb__text">
						<div class="archive-thumb__title">
							<a href="<?php echo esc_url($it['url']); ?>"><?php echo esc_html($it['title']); ?></a>
						</div>
						<?php if ( !empty($it['speakers']) ) : ?>
							<div class="archive-thumb__year"><?php echo esc_html($it['speakers']); ?></div>
						<?php endif; ?>
						</div>
					</a>
					</div>
				<?php endfor; ?>
				</div>

			<?php else : ?>
				<!-- ====== SLIDE (por defecto) ====== -->
				<div class="video-channel-swiper-outer" data-video-channel-root="<?php echo esc_attr($root_id); ?>">
				<div class="swiper video-channel-swiper video-channel-home-swiper"
					id="<?php echo esc_attr($root_id); ?>-swiper"
					data-swiper-video-channel
					data-items-count="<?php echo esc_attr($count); ?>"
					style="opacity:0; transition:opacity .2s;">

					<div class="video-channel-swiper__controls u_mt-1">
					<button class="video-channel-swiper__prev" id="<?php echo esc_attr($root_id); ?>-prev" type="button" aria-label="<?php esc_attr_e('Previous', 'far_loop'); ?>">&larr;</button>
					<button class="video-channel-swiper__next" id="<?php echo esc_attr($root_id); ?>-next" type="button" aria-label="<?php esc_attr_e('Next', 'far_loop'); ?>">&rarr;</button>
					</div>

					<div class="swiper-wrapper">
					<?php foreach ( $items as $it ) : ?>
						<div class="swiper-slide archive-grid">
						<article class="committee-card">
							<a class="videochannel-card__thumb archive-new-thumb" href="<?php echo esc_url($it['url']); ?>">
							<div class="archive-thumb__image-container video-conference">
								<img src="<?php echo esc_url($it['img']); ?>" alt="<?php echo esc_attr($it['title']); ?>">
							</div>
							</a>
							<div class="archive-thumb__text">
							<div class="archive-thumb__title">
								<a href="<?php echo esc_url($it['url']); ?>"><?php echo esc_html($it['title']); ?></a>
							</div>
							<?php if ( !empty($it['speakers']) ) : ?>
								<div class="archive-thumb__year"><?php echo esc_html($it['speakers']); ?></div>
							<?php endif; ?>
							</div>
						</article>
						</div>
					<?php endforeach; ?>
					</div>
				</div>
				</div>


			<?php endif; // slide/col ?>
			</div><!-- /.l_container -->
		<?php endif; // !empty videos ?>
		<?php endif; // visibility ?>













		<?php
		 $partners_visibility = get_field('partners_slide_visibility');
		 ?>
		<?php if ( $partners_visibility !== 'hide' ) : ?>
		<!-- BLOCK PARTNERS -->
		<div class="l_container u_pt-0">
		<div class="wrapper-about-partners-slide">
			<?php
			//get_template_part( 'template-parts/partners-mini' ); // Slide
			get_template_part( 'template-parts/partners-mini-grid' );
			?>
		</div>
		</div>
		<?php endif; ?>





	<!--

	<div class="newsletter-container-home-new">
		<h2 class="newsletter-title">Stay in touch?<br>Subscribe to our newsletter!</h2>

		<form class="newsletter-form">
			<div class="form-group">
			<input type="text" name="name" placeholder="Name" required>
			</div>
			<div class="form-group">
			<input type="email" name="email" placeholder="Your e-mail" required>
			</div>
			<div class="form-submit">
			<button type="submit">Send!</button>
			</div>
		</form>
	</div>

	-->





</div>



<!--

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/5.3.0/fabric.min.js"></script>

<script>
	const isMobile = window.innerWidth < 640;

	// ⏱ clave para el bloqueo temporal
	const LS_KEY = 'birdCanvasBlockedUntil';
	const now = Date.now();
	const blockedUntil = parseInt(localStorage.getItem(LS_KEY), 10) || 0;

	// ✅ si está bloqueado, ocultamos y no cargamos nada
	if (now < blockedUntil) {
		const el = document.getElementById('bird-canvas');
		if (el) el.style.display = 'none';
		console.log('Canvas bloqueado hasta:', new Date(blockedUntil));
	} else {
		// === Inicia canvas solo si no está bloqueado ===
		const canvas = new fabric.Canvas('bird-canvas', {
			isDrawingMode: false,
			selection: false,
			backgroundColor: null
		});

		function resizeCanvas() {
			canvas.setWidth(window.innerWidth);
			canvas.setHeight(window.innerHeight);
			canvas.renderAll();
		}
		window.addEventListener('resize', resizeCanvas);
		resizeCanvas();

		let idleTimeout;
		let userInteracted = false;

		idleTimeout = setTimeout(() => {
			if (!userInteracted && !drawStarted) {
				canvas.dispose();
				document.getElementById('bird-canvas').style.display = 'none';
				window.removeEventListener('resize', resizeCanvas);
			}
		}, 2000);

		function cancelIdleTimeout() {
			if (!userInteracted) {
				userInteracted = true;
				clearTimeout(idleTimeout);
			}
		}
		window.addEventListener('mousemove', cancelIdleTimeout, { once: true });
		if (canvas && canvas.upperCanvasEl) {
			canvas.upperCanvasEl.addEventListener('mousemove', cancelIdleTimeout, { once: true });
		}

		const container = document.querySelector('.canvas-container');
		if (container) {
			container.style.position = 'fixed';
			container.style.top = '0';
			container.style.left = '0';
			container.style.width = '100vw';
			container.style.height = '100vh';
			container.style.backgroundColor = 'transparent';
			container.style.zIndex = '99999999';
			container.style.pointerEvents = 'auto';
		}

		let isDrawing = false;
		let drawStarted = false;
		let lastX = 0, lastY = 0, angle = 0, index = 0;

		const birdSVGs = [];
		<?php
		$bird_dir = get_template_directory() . '/birds/';
		$bird_files = glob($bird_dir . '*.svg');
		foreach ($bird_files as $file) {
			$contents = file_get_contents($file);
			echo "birdSVGs.push(`" . addslashes($contents) . "`);\n";
		}
		?>

		function getAngle(x1, y1, x2, y2) {
			return Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI;
		}

		function addSVG(x, y, angle) {
			const svgStr = birdSVGs[index % birdSVGs.length];
			index++;
			fabric.loadSVGFromString(svgStr, (objects, options) => {
				const obj = fabric.util.groupSVGElements(objects, options);
				obj.set({
					left: x, top: y, angle: angle,
					originX: 'center', originY: 'center',
					scaleX: 0.08, scaleY: 0.08,
					selectable: false, hasBorders: false,
					hasControls: false, evented: false
				});
				canvas.add(obj);
			});
		}

		canvas.on('mouse:move', function(opt) {
			const pointer = canvas.getPointer(opt.e);

			if (!drawStarted) {
				drawStarted = true;
				isDrawing = true;
				lastX = pointer.x;
				lastY = pointer.y;

				setTimeout(() => {
					isDrawing = false;
					saveDrawingAsCroppedSVG();
				}, 1000);
			}

			if (!isDrawing) return;

			const dx = pointer.x - lastX;
			const dy = pointer.y - lastY;
			const distance = Math.sqrt(dx * dx + dy * dy);
			if (distance > 60) {
				angle = getAngle(lastX, lastY, pointer.x, pointer.y);
				addSVG(pointer.x, pointer.y, angle);
				lastX = pointer.x;
				lastY = pointer.y;
			}
		});

		function saveDrawingAsCroppedSVG() {
			canvas.discardActiveObject();
			const objects = canvas.getObjects();
			if (objects.length === 0) return;

			let bounds = objects.reduce((acc, obj) => {
				const rect = obj.getBoundingRect(true);
				acc.left = Math.min(acc.left, rect.left);
				acc.top = Math.min(acc.top, rect.top);
				acc.right = Math.max(acc.right, rect.left + rect.width);
				acc.bottom = Math.max(acc.bottom, rect.top + rect.height);
				return acc;
			}, { left: Infinity, top: Infinity, right: -Infinity, bottom: -Infinity });

			const padding = 20;
			const width = bounds.right - bounds.left + padding * 2;
			const height = bounds.bottom - bounds.top + padding * 2;

			const tempCanvas = new fabric.StaticCanvas(null, {
				width: width,
				height: height,
				backgroundColor: null
			});

			const clonePromises = objects.map(obj => {
				return new Promise(resolve => {
					obj.clone(cloned => {
						cloned.set({
							left: obj.left - bounds.left + padding,
							top: obj.top - bounds.top + padding,
							angle: obj.angle,
							scaleX: obj.scaleX,
							scaleY: obj.scaleY,
							originX: obj.originX,
							originY: obj.originY,
							selectable: false,
							evented: false
						});
						tempCanvas.add(cloned);
						resolve();
					});
				});
			});

			Promise.all(clonePromises).then(() => {
				const svg = tempCanvas.toSVG();

				fetch('https://loop-barcelona.com/save-drawing', {
					method: 'POST',
					body: JSON.stringify({ svg: svg }),
					headers: { 'Content-Type': 'application/json' }
				}).then(res => res.text()).then(result => {
					// ⏱ Guardar bloqueo durante 3 horas
					const threeHoursLater = Date.now() + 3 * 60 * 60 * 1000;
					localStorage.setItem(LS_KEY, threeHoursLater);

					if (isMobile) {
						canvas.dispose();
						document.getElementById('bird-canvas').style.display = 'none';
						window.removeEventListener('resize', resizeCanvas);
						return;
					}
					setTimeout(() => { fadeOutBirdsInReverse(); }, 2000);
				}).catch(err => {
					console.error(err);
				});
			});
		}

		function fadeOutBirdsInReverse() {
			const objects = canvas.getObjects();
			objects.slice().reverse().forEach((obj, i) => {
				setTimeout(() => {
					obj.animate('opacity', 0, {
						duration: 20,
						onChange: canvas.renderAll.bind(canvas),
						onComplete: () => {
							if (i === objects.length - 1) {
								setTimeout(() => {
									canvas.dispose();
									document.getElementById('bird-canvas').style.display = 'none';
									window.removeEventListener('resize', resizeCanvas);
								}, 200);
							}
						}
					});
				}, i * 20);
			});
		}
	}
</script>


-->





<script>
(function () {
  "use strict";

  /* ============= 1) Loader único Swiper ============= */
  window.__ensureSwiper = window.__ensureSwiper || (function(){
    var p;
    return function ensureSwiper(){
      if (window.Swiper) return Promise.resolve();
      if (p) return p;
      p = new Promise(function(resolve){
        if (!document.getElementById('swiper-css-cdn')) {
          var link = document.createElement('link');
          link.id = 'swiper-css-cdn';
          link.rel = 'stylesheet';
          link.href = 'https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.css';
          document.head.appendChild(link);
        }
        if (!document.getElementById('swiper-js-cdn')) {
          var script = document.createElement('script');
          script.id  = 'swiper-js-cdn';
          script.src = 'https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.js';
          script.defer = true;
          script.onload = function(){ resolve(); };
          document.head.appendChild(script);
        } else {
          var i = setInterval(function(){
            if (window.Swiper) { clearInterval(i); resolve(); }
          }, 30);
        }
      });
      return p;
    };
  })();

  /* ============= 2) Utilidades comunes ============= */
  var inited = new WeakSet();

  function setOnce(el) {
    if (!el || inited.has(el)) return false;
    inited.add(el);
    return true;
  }

  function show(el){ if (el && el.style) el.style.opacity = '1'; }

  // devuelve PV actual según ancho
  function currentPv(pvBase, pv640, pv768, pv1024, pvDesktop) {
    var w = window.innerWidth || document.documentElement.clientWidth || 1366;
    if (w >= 1366) return pvDesktop;
    if (w >= 1024) return pv1024;
    if (w >= 768)  return pv768;
    if (w >= 640)  return pv640;
    return pvBase;
  }

  // muestra/oculta flechas/paginación con defensas
  function toggleNavSafe(sw, need) {
    if (!sw) return;

    // Navigation (Swiper transforma a elementos tras init)
    var nextEl = sw.navigation && sw.navigation.nextEl instanceof HTMLElement ? sw.navigation.nextEl : null;
    var prevEl = sw.navigation && sw.navigation.prevEl  instanceof HTMLElement ? sw.navigation.prevEl  : null;

    if (nextEl) nextEl.style.display = need ? '' : 'none';
    if (prevEl) prevEl.style.display = need ? '' : 'none';

    // Pagination
    var pagEl = (sw.pagination && sw.pagination.el) ? sw.pagination.el : null;
    if (pagEl) pagEl.style.display = need ? '' : 'none';
  }

  function finalUpdates(sw, needFn) {
    if (!sw) return;
    sw.update();
    sw.updateSlides && sw.updateSlides();
    sw.updateSize && sw.updateSize();
    if (typeof needFn === 'function') {
      toggleNavSafe(sw, needFn());
    }
  }

  /* ============= 3) FAIR HOME (data-fair-videos-swiper-root) ============= */
  function initFairHome() {
    document.querySelectorAll('[data-fair-videos-swiper-root]').forEach(function(root){
      var rootId = root.getAttribute('data-fair-videos-swiper-root');
      if (!rootId) return;

      var el = document.getElementById(rootId + '-swiper');
      if (!setOnce(el)) return;

      var nextEl = document.getElementById(rootId + '-next');
      var prevEl = document.getElementById(rootId + '-prev');

      var total  = parseInt(el.getAttribute('data-items-count') || '0', 10);

      // PV por nº de slides
      var pvDesktop = (total <= 3) ? 3 : (total === 4 ? 4 : 4.2);
      var pv1024    = (total <= 3) ? 3 : 3.2;
      var pv768     = 2.2;
      var pv640     = 1.2;
      var pvBase    = 1.2;

      var params = {
        slidesPerView: pvBase,
        spaceBetween: 15,
        watchSlidesProgress: true,
        observer: true,
        observeParents: true,
        preloadImages: false,
        lazy: { loadOnTransitionStart: true },
        breakpoints: {
          640:  { slidesPerView: pv640,  spaceBetween: 15 },
          768:  { slidesPerView: pv768,  spaceBetween: 15 },
          1366: { slidesPerView: 3.2,   spaceBetween: 32 },
          1367: { slidesPerView: pvDesktop, spaceBetween: 32 }
        },
        on: {
          init: function() {
            show(el);
            var need = function(){
              var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
              var count = (this && this.slides) ? this.slides.length : total;
              return count > pvNow;
            }.bind(this);
            toggleNavSafe(this, need());
          },
          resize: function() {
            var need = function(){
              var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
              var count = (this && this.slides) ? this.slides.length : total;
              return count > pvNow;
            }.bind(this);
            toggleNavSafe(this, need());
          }
        }
      };

      // Solo añadimos navigation si existen botones
      if (nextEl && prevEl) {
        params.navigation = { nextEl: nextEl, prevEl: prevEl };
      }

      var sw = new Swiper(el, params);

      // Refrescos
      var needFn = function(){
        var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
        var count = (sw && sw.slides) ? sw.slides.length : total;
        return count > pvNow;
      };

      el.querySelectorAll('img').forEach(function(img){
        var upd = function(){ finalUpdates(sw, needFn); };
        if (img.complete) upd();
        img.addEventListener('load',  upd, { once:true });
        img.addEventListener('error', upd, { once:true });
      });

      if (document.fonts && document.fonts.ready) {
        document.fonts.ready.then(function(){ finalUpdates(sw, needFn); });
      }
      window.addEventListener('load', function(){ finalUpdates(sw, needFn); });
      setTimeout(function(){ finalUpdates(sw, needFn); }, 600);
      setTimeout(function(){ finalUpdates(sw, needFn); }, 1200);
    });
  }

  /* ============= 4) VIDEOCLoop HOME (data-videocloop-videos-swiper-root) ============= */
  function initVideocloopHome() {
    document.querySelectorAll('[data-videocloop-videos-swiper-root]').forEach(function(root){
      var rootId = root.getAttribute('data-videocloop-videos-swiper-root');
      if (!rootId) return;

      var el = document.getElementById(rootId + '-swiper');
      if (!setOnce(el)) return;

      var nextEl = document.getElementById(rootId + '-next');
      var prevEl = document.getElementById(rootId + '-prev');

      var total  = parseInt(el.getAttribute('data-items-count') || '0', 10);

      var pvDesktop = (total <= 3) ? 3 : (total === 4 ? 4 : 4.2);
      var pv1024    = (total <= 3) ? 3 : 3.2;
      var pv768     = 2.2;
      var pv640     = 1.2;
      var pvBase    = 1.2;

      var params = {
        slidesPerView: pvBase,
        spaceBetween: 15,
        watchSlidesProgress: true,
        observer: true,
        observeParents: true,
        preloadImages: false,
        lazy: { loadOnTransitionStart: true },
        breakpoints: {
          640:  { slidesPerView: pv640,  spaceBetween: 15 },
          768:  { slidesPerView: pv768,  spaceBetween: 15 },
          1366: { slidesPerView: 3.2,   spaceBetween: 32 },
          1367: { slidesPerView: pvDesktop, spaceBetween: 32 }
        },
        on: {
          init: function() {
            show(el);
            var need = function(){
              var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
              var count = (this && this.slides) ? this.slides.length : total;
              return count > pvNow;
            }.bind(this);
            toggleNavSafe(this, need());
          },
          resize: function() {
            var need = function(){
              var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
              var count = (this && this.slides) ? this.slides.length : total;
              return count > pvNow;
            }.bind(this);
            toggleNavSafe(this, need());
          }
        }
      };

      if (nextEl && prevEl) {
        params.navigation = { nextEl: nextEl, prevEl: prevEl };
      }

      var sw = new Swiper(el, params);

      var needFn = function(){
        var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
        var count = (sw && sw.slides) ? sw.slides.length : total;
        return count > pvNow;
      };

      el.querySelectorAll('img').forEach(function(img){
        var upd = function(){ finalUpdates(sw, needFn); };
        if (img.complete) upd();
        img.addEventListener('load',  upd, { once:true });
        img.addEventListener('error', upd, { once:true });
      });

      if (document.fonts && document.fonts.ready) {
        document.fonts.ready.then(function(){ finalUpdates(sw, needFn); });
      }
      window.addEventListener('load', function(){ finalUpdates(sw, needFn); });
      setTimeout(function(){ finalUpdates(sw, needFn); }, 600);
      setTimeout(function(){ finalUpdates(sw, needFn); }, 1200);
    });
  }

  /* ============= 5) VIDEO CHANNEL (.video-channel-swiper) ============= */
  function initVideoChannel() {
    document.querySelectorAll('.video-channel-swiper').forEach(function(el){
      if (!setOnce(el)) return;

      var wrapper = el.closest('.video-channel-swiper-outer') || document;
      var nextEl  = wrapper.querySelector('.video-channel-swiper__next');
      var prevEl  = wrapper.querySelector('.video-channel-swiper__prev');

      var total   = parseInt(el.getAttribute('data-items-count') || '0', 10);
      var pvDesktop = (total <= 3) ? 3 : (total === 4 ? 4 : 4.2);
      var pv1024    = (total <= 3) ? 3 : 3.2;
      var pv768     = 2.2;
      var pv640     = 1.2;
      var pvBase    = 1.2;

      var params = {
        slidesPerView: pvBase,
        spaceBetween: 15,
        watchOverflow: true,
        watchSlidesProgress: true,
        observer: true,
        observeParents: true,
        preloadImages: false,
        lazy: { loadOnTransitionStart: true },
        breakpoints: {
          480:  { slidesPerView: pvBase, spaceBetween: 15 },
          640:  { slidesPerView: pv640,  spaceBetween: 15 },
          768:  { slidesPerView: pv768,  spaceBetween: 32 },
          1366: { slidesPerView: pv1024, spaceBetween: 32 },
          1367: { slidesPerView: pvDesktop, spaceBetween: 32 }
        },
        on: {
          init: function() {
            show(el);
            var need = function(){
              var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
              var count = (this && this.slides) ? this.slides.length : total;
              return count > pvNow;
            }.bind(this);
            toggleNavSafe(this, need());
          },
          resize: function() {
            var need = function(){
              var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
              var count = (this && this.slides) ? this.slides.length : total;
              return count > pvNow;
            }.bind(this);
            toggleNavSafe(this, need());
          }
        }
      };

      if (nextEl && prevEl) {
        params.navigation = { nextEl: nextEl, prevEl: prevEl };
      }

      var sw = new Swiper(el, params);

      var needFn = function(){
        var pvNow = currentPv(pvBase, pv640, pv768, pv1024, pvDesktop);
        var count = (sw && sw.slides) ? sw.slides.length : total;
        return count > pvNow;
      };

      el.querySelectorAll('img').forEach(function(img){
        var upd = function(){ finalUpdates(sw, needFn); };
        if (img.complete) upd();
        img.addEventListener('load',  upd, { once:true });
        img.addEventListener('error', upd, { once:true });
      });

      if (document.fonts && document.fonts.ready) {
        document.fonts.ready.then(function(){ finalUpdates(sw, needFn); });
      }
      window.addEventListener('load', function(){ finalUpdates(sw, needFn); });
      setTimeout(function(){ finalUpdates(sw, needFn); }, 600);
      setTimeout(function(){ finalUpdates(sw, needFn); }, 1200);
    });
  }

  /* ============= 6) Orquestador ============= */
  function initAllSwipers() {
    try { initFairHome(); } catch(e) { console.error(e); }
    try { initVideocloopHome(); } catch(e) { console.error(e); }
    try { initVideoChannel(); } catch(e) { console.error(e); }
  }

  function boot() { window.__ensureSwiper().then(function(){ requestAnimationFrame(initAllSwipers); }); }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', boot);
  } else {
    boot();
  }

  // reforzadores
  window.addEventListener('load', boot);
  setTimeout(boot, 500);
  setTimeout(boot, 1500);

  // por si inyectas contenido dinámico
  var moTimer = null;
  var mo = new MutationObserver(function(){
    clearTimeout(moTimer);
    moTimer = setTimeout(boot, 200);
  });
  mo.observe(document.body, { childList: true, subtree: true });

})();
</script>



<script>
(function () {
  function setAppHeight() {
    const h = window.visualViewport ? window.visualViewport.height : window.innerHeight;
    document.documentElement.style.setProperty('--app-height', `${h}px`);
  }

  setAppHeight();
  window.addEventListener('resize', setAppHeight);
  window.addEventListener('orientationchange', setAppHeight);

  if (window.visualViewport) {
    window.visualViewport.addEventListener('resize', setAppHeight);
  }
})();
</script>



<?php
get_footer();
