<?php
/**
 * Template part for displaying page content in page.php
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
 *
 * @package worktech
 */

?>
<style>
.entry-content{padding-top:90px}.wpcf7{width:90%;margin:10vh auto 10vh auto;overflow:hidden;max-width:480px}.wpcf7 input,.wpcf7 textarea{padding:10px 5px;margin:5px 0;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:"ITC Officina Sans Std", "Roboto", sans-serif;border:1px solid #999;padding:15px;-webkit-appearance:none}.wpcf7 p{padding:15px 0 0 0;margin:0;font-family:"ITC Officina Sans Std", "Roboto", sans-serif}.wpcf7 button,.wpcf7 input[type="button"],.wpcf7 input[type="reset"],.wpcf7 input[type="submit"],.wpcf7 body:not(.wp-customizer) input[type="submit"],.wpcf7 body input[type="submit"]{-webkit-appearance:none;padding:20px;border-radius:5px !important;background:var(--color-city) !important;color:#fff;border:none;font-weight:700 !important;font-size:18px;font-family:"ITC Officina Sans Std", "Roboto", sans-serif}.wpcf7 input[type="submit"]:hover{background-color:var(--color-city) !important}
</style>
 
<header class="header">
  <div class="header__wrapper">
    <div class="header__logo">
      <a><img src="<?php echo site_url(); ?>/static/images/logo-w22.svg" alt="Worktech 22"></a>
    </div>
    <nav class="header__links">
      <a class="nav__close">
        <span></span>
      </a>
      <div class="subnav__links">Ver eventos WORKTECH 22
        <ul>
          <li><a href="https://contractworkplaces.com/worktech/buenosaires/" target="_blank">Buenos Aires</a></li>
          <li><a href="https://contractworkplaces.com/worktech/lima/" target="_blank">Lima</a></li>
          <li><a href="https://contractworkplaces.com/worktech/santiago/" target="_blank">Santiago</a></li>
          <li><a href="https://contractworkplaces.com/worktech/quito/" target="_blank">Quito</a></li>
        </ul>
      </div> 
    </nav>
    <div class="nav__trigger"></div>
  </div>
</header>

<!-- JS -->
<script>
  const body = document.querySelector('body');
  function handleNavigation() {
    const navTrigger = document.querySelector('.nav__trigger');
    const navLinks = document.querySelectorAll('.nav__links');
    const navClose = document.querySelector('.nav__close');
    function openMenu(e) {
      e.preventDefault();
      body.classList.add('is--nav-open');
    }
    function closeMenu(e) { 
      body.classList.remove('is--nav-open');
    }
    navTrigger.addEventListener('click', openMenu);
    navClose.addEventListener('click', closeMenu);
    navLinks.forEach(
      link => link.addEventListener('click', closeMenu)
    );
  }
  handleNavigation(); 
</script> 

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
  <!-- Hero -->
  <section class="hero" data-section="hero"
    style="background: url(<?php echo site_url(); ?>/static/images/hero-event-city.jpg) center center/cover;">
    <img src="/worktech/shared/images/hero-logo.svg" alt="CW" class="hero__logo">
    <img src="<?php echo site_url(); ?>/static/images/hero-event-text.svg" alt="Worktech 22" class="hero__event">
    <p style="color: #fff;">JUEVES 27 DE OCTUBRE | 8.30 AM</p>
    <p style="color: #fff;">ESPACIO DARWIN PALERMO</p>
  </section>

	<div class="entry-content">
		<?php
		the_content();

		wp_link_pages(
			array(
				'before' => '<div class="page-links">' . esc_html__( 'Pages:', 'worktech' ),
				'after'  => '</div>',
			)
		);
		?>
	</div><!-- .entry-content -->

</article><!-- #post-<?php the_ID(); ?> -->

<hr class="wp-block-separator has-alpha-channel-opacity"/>

<style>
.wpcf7 p { position: relative;}
.wpcf7-spinner { position: absolute; z-index: 99; left: 0; top: 50%; transform: translateY(-6px);}
.wpcf7 form .wpcf7-response-output {
    margin: 0 auto;
    padding: 1.5em 1.5em;
    font-size: 18px;
    text-align: center;
    line-height: 1.25;
    font-weight: bold;
    letter-spacing: -.02em;
}
</style>