<?php
/**
 * Template Name: Our Story
 *
 * Theatre history, mission, team, and press quotes.
 *
 * @package Northfield_Theatre
 * @since 1.0.0
 */

get_header();

$timeline = array(
	array(
		'year'  => '1932',
		'title' => __( 'A theatre for Yorkshire', 'northfield-theatre' ),
		'body'  => __( 'Northfield Theatre opened its doors on 8 October 1932 with a touring production of "The Yeomen of the Guard". Designed by architect Edwin Hargreaves in a restrained Art Deco style, the 1,200-seat house was paid for by public subscription.', 'northfield-theatre' ),
	),
	array(
		'year'  => '1954',
		'title' => __( 'Founding of the Resident Company', 'northfield-theatre' ),
		'body'  => __( 'Under Artistic Director Esme Halliday, the first resident repertory company is formed. A young Albert Finney spends a single season here before heading to the RSC.', 'northfield-theatre' ),
	),
	array(
		'year'  => '1978',
		'title' => __( 'The Studio is built', 'northfield-theatre' ),
		'body'  => __( 'A 120-seat studio space is added at the rear of the building, hosting early work by the now-legendary Northfield Writers\' Group.', 'northfield-theatre' ),
	),
	array(
		'year'  => '1996',
		'title' => __( 'A new front of house', 'northfield-theatre' ),
		'body'  => __( 'The foyer and Foyer Bar are redesigned by architects Holtham & Slate, opening the building up to the square outside for the first time.', 'northfield-theatre' ),
	),
	array(
		'year'  => '2019',
		'title' => __( 'Major access refurbishment', 'northfield-theatre' ),
		'body'  => __( 'A £3.4m programme adds lifts to every level, six stalls wheelchair spaces, an infrared hearing loop throughout, and a new accessible box office counter.', 'northfield-theatre' ),
	),
	array(
		'year'  => '2024',
		'title' => __( 'The Moorside partnership', 'northfield-theatre' ),
		'body'  => __( 'Northfield Theatre takes on the programming of Moorside Town Hall as a second venue — a new chapter for both organisations.', 'northfield-theatre' ),
	),
);

$values = array(
	array(
		'title' => __( 'Bold, not safe', 'northfield-theatre' ),
		'body'  => __( 'We back productions that take artistic risks — new writing, recontextualised classics, work that starts conversations.', 'northfield-theatre' ),
	),
	array(
		'title' => __( 'For everyone', 'northfield-theatre' ),
		'body'  => __( 'Every show has at least one access-adapted performance. Under-26 tickets start at £12. We mean it when we say the theatre is for everyone.', 'northfield-theatre' ),
	),
	array(
		'title' => __( 'Made in Yorkshire', 'northfield-theatre' ),
		'body'  => __( 'We commission and co-produce work with artists, writers, and companies who live and make here.', 'northfield-theatre' ),
	),
	array(
		'title' => __( 'A good night out', 'northfield-theatre' ),
		'body'  => __( 'We never forget that people come here for pleasure. A proper drink, a comfortable seat, and a show worth talking about on the walk home.', 'northfield-theatre' ),
	),
);

$team = array(
	array(
		'name'  => __( 'Davinia Okonkwo', 'northfield-theatre' ),
		'role'  => __( 'Artistic Director', 'northfield-theatre' ),
		'bio'   => __( 'Formerly Associate Director at Sheffield Theatres. Joined Northfield in 2021.', 'northfield-theatre' ),
	),
	array(
		'name'  => __( 'Peter Whitelock', 'northfield-theatre' ),
		'role'  => __( 'Executive Director', 'northfield-theatre' ),
		'bio'   => __( 'Thirty years in theatre administration. Leads on buildings, fundraising, and partnerships.', 'northfield-theatre' ),
	),
	array(
		'name'  => __( 'Sarah Halstead', 'northfield-theatre' ),
		'role'  => __( 'Head of Audiences', 'northfield-theatre' ),
		'bio'   => __( 'Oversees marketing, box office, and the subscriber programme.', 'northfield-theatre' ),
	),
	array(
		'name'  => __( 'Tomás Riera', 'northfield-theatre' ),
		'role'  => __( 'Producer, Studio', 'northfield-theatre' ),
		'bio'   => __( 'Commissions and produces the Studio programme, with a focus on new writing.', 'northfield-theatre' ),
	),
);

$press = array(
	array(
		'quote' => __( 'Bold, unshowy, and quietly essential — a regional theatre doing its best work in decades.', 'northfield-theatre' ),
		'cite'  => __( 'The Guardian, 2025', 'northfield-theatre' ),
	),
	array(
		'quote' => __( 'Northfield\'s Hamlet is the most thrilling I\'ve seen this side of the Barbican.', 'northfield-theatre' ),
		'cite'  => __( 'The Stage, 2026', 'northfield-theatre' ),
	),
	array(
		'quote' => __( 'A model of what a receiving house can be when it puts audiences first.', 'northfield-theatre' ),
		'cite'  => __( 'WhatsOnStage, 2025', 'northfield-theatre' ),
	),
);
?>

<article class="story-page">

	<header class="story-hero section--dark">
		<div class="container story-hero__inner">
			<p class="story-hero__eyebrow"><?php esc_html_e( 'Our Story', 'northfield-theatre' ); ?></p>
			<h1 class="story-hero__title"><?php esc_html_e( 'Ninety-four years of bold theatre in West Yorkshire.', 'northfield-theatre' ); ?></h1>
			<p class="story-hero__lead">
				<?php esc_html_e( 'From a subscription-funded Art Deco house to a 21st-century receiving theatre, Northfield has always been built by — and built for — its town.', 'northfield-theatre' ); ?>
			</p>
		</div>
	</header>

	<!-- Numbers section -->
	<section class="story-numbers section--cream">
		<div class="container story-numbers__grid">
			<div class="story-numbers__item">
				<span class="story-numbers__value">94</span>
				<span class="story-numbers__label"><?php esc_html_e( 'Years of programming', 'northfield-theatre' ); ?></span>
			</div>
			<div class="story-numbers__item">
				<span class="story-numbers__value">1,200</span>
				<span class="story-numbers__label"><?php esc_html_e( 'Seats across two houses', 'northfield-theatre' ); ?></span>
			</div>
			<div class="story-numbers__item">
				<span class="story-numbers__value">180+</span>
				<span class="story-numbers__label"><?php esc_html_e( 'Performances each year', 'northfield-theatre' ); ?></span>
			</div>
			<div class="story-numbers__item">
				<span class="story-numbers__value">45,000</span>
				<span class="story-numbers__label"><?php esc_html_e( 'Annual audience members', 'northfield-theatre' ); ?></span>
			</div>
		</div>
	</section>

	<!-- Mission -->
	<section class="story-mission section">
		<div class="container story-mission__grid">
			<div>
				<p class="story-mission__eyebrow"><?php esc_html_e( 'What we believe', 'northfield-theatre' ); ?></p>
				<h2 class="story-mission__heading"><?php esc_html_e( 'A theatre is nothing without its town.', 'northfield-theatre' ); ?></h2>
			</div>
			<div class="story-mission__body">
				<p>
					<?php esc_html_e( 'We are a charity and a receiving house. We don\'t make every show ourselves — most of our programme is brought in from touring companies across the UK — but we curate it with the people of Northfield squarely in mind.', 'northfield-theatre' ); ?>
				</p>
				<p>
					<?php esc_html_e( 'That means asking ourselves, every time we pencil a booking: will this be a good night out for someone in Northfield, Moorside, Halifax, or Hebden Bridge? Can they get home afterwards? Will they feel welcome in the foyer? Can they afford a pair of tickets and a drink without having to think twice? If the answer is anything other than yes, we\'ll find a way to fix it.', 'northfield-theatre' ); ?>
				</p>
			</div>
		</div>
	</section>

	<!-- Values -->
	<section class="story-values section--dark">
		<div class="container">
			<h2 class="story-values__heading"><?php esc_html_e( 'Four commitments', 'northfield-theatre' ); ?></h2>
			<div class="story-values__grid">
				<?php foreach ( $values as $index => $value ) : ?>
					<div class="story-values__card fade-in-up">
						<span class="story-values__num"><?php printf( '%02d', $index + 1 ); ?></span>
						<h3 class="story-values__title"><?php echo esc_html( $value['title'] ); ?></h3>
						<p class="story-values__body"><?php echo esc_html( $value['body'] ); ?></p>
					</div>
				<?php endforeach; ?>
			</div>
		</div>
	</section>

	<!-- Timeline -->
	<section class="story-timeline section">
		<div class="container">
			<div class="story-timeline__header">
				<p class="story-timeline__eyebrow"><?php esc_html_e( 'A short history', 'northfield-theatre' ); ?></p>
				<h2 class="story-timeline__heading"><?php esc_html_e( 'How we got here.', 'northfield-theatre' ); ?></h2>
			</div>
			<ol class="story-timeline__list" role="list">
				<?php foreach ( $timeline as $item ) : ?>
					<li class="story-timeline__item fade-in-up">
						<span class="story-timeline__year"><?php echo esc_html( $item['year'] ); ?></span>
						<div class="story-timeline__body">
							<h3 class="story-timeline__title"><?php echo esc_html( $item['title'] ); ?></h3>
							<p><?php echo esc_html( $item['body'] ); ?></p>
						</div>
					</li>
				<?php endforeach; ?>
			</ol>
		</div>
	</section>

	<!-- Press quotes -->
	<section class="story-press section--cream">
		<div class="container">
			<h2 class="story-press__heading"><?php esc_html_e( 'In the press', 'northfield-theatre' ); ?></h2>
			<div class="story-press__grid">
				<?php foreach ( $press as $quote ) : ?>
					<figure class="story-press__card fade-in-up">
						<blockquote class="story-press__quote">
							<?php echo esc_html( $quote['quote'] ); ?>
						</blockquote>
						<figcaption class="story-press__cite">— <?php echo esc_html( $quote['cite'] ); ?></figcaption>
					</figure>
				<?php endforeach; ?>
			</div>
		</div>
	</section>

	<!-- Team -->
	<section class="story-team section">
		<div class="container">
			<div class="story-team__header">
				<p class="story-team__eyebrow"><?php esc_html_e( 'Who runs the place', 'northfield-theatre' ); ?></p>
				<h2 class="story-team__heading"><?php esc_html_e( 'The leadership team', 'northfield-theatre' ); ?></h2>
			</div>
			<div class="story-team__grid">
				<?php foreach ( $team as $person ) : ?>
					<div class="story-team__card fade-in-up">
						<div class="story-team__photo" aria-hidden="true">
							<span><?php echo esc_html( strtoupper( substr( $person['name'], 0, 1 ) . substr( strstr( $person['name'], ' ' ), 1, 1 ) ) ); ?></span>
						</div>
						<h3 class="story-team__name"><?php echo esc_html( $person['name'] ); ?></h3>
						<p class="story-team__role"><?php echo esc_html( $person['role'] ); ?></p>
						<p class="story-team__bio"><?php echo esc_html( $person['bio'] ); ?></p>
					</div>
				<?php endforeach; ?>
			</div>
		</div>
	</section>

	<!-- CTA -->
	<section class="story-cta section--dark">
		<div class="container story-cta__inner">
			<h2 class="story-cta__heading"><?php esc_html_e( 'Be part of the next ninety-four years.', 'northfield-theatre' ); ?></h2>
			<p class="story-cta__body">
				<?php esc_html_e( 'Membership keeps the house lights on. Members get priority booking, £5 off every ticket, and an invitation to our annual season launch.', 'northfield-theatre' ); ?>
			</p>
			<div class="story-cta__actions">
				<a href="<?php echo esc_url( home_url( '/support/membership/' ) ); ?>" class="btn btn--primary btn--lg">
					<?php esc_html_e( 'Become a member', 'northfield-theatre' ); ?>
				</a>
				<a href="<?php echo esc_url( home_url( '/support/donate/' ) ); ?>" class="btn btn--outline-light btn--lg">
					<?php esc_html_e( 'Support our work', 'northfield-theatre' ); ?>
				</a>
			</div>
		</div>
	</section>

</article>

<?php
get_footer();
