<?php
/**
 * Template Name: Contact Us
 *
 * @package GoAskAuntie
 * @since 1.0.0
 */

namespace BasicWP;

get_header();

$sperm_img = get_theme_file_uri( '/static/img/sperm.png' );
$frog_img  = get_theme_file_uri( '/static/img/frog.png' );
?>

<section class="w-full pb-24 bg-navy relative">
	<div class="prose prose-sm md:prose-lg lg:prose-xl max-w-5xl md:mx-6 lg:mx-auto pt-12 lg:pt-32 text-gray relative">
		<h1 class="text-4xl font-bold md:text-6xl lg:text-7xl tracking-wide uppercase text-red mb-16 mx-auto text-left">Contact Us</h1>

		<div class="grid md:grid-cols-2 grid-cols-1 md:grid-rows-1 grid-rows-2 justify-center items-center gap-6 relative">
			<div class="h-full">
				<?php
				// Gravity Forms shortcode - replace '1' with the actual form ID after setup
				echo do_shortcode( '[gravityform id="1" title="false" description="false" ajax="true"]' );
				?>
			</div>
			<div class="h-full bg-purple rounded-[45px] relative overflow-visible z-10">
				<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2569.629393890589!2d-97.13510668444954!3d49.90576077940403!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x52ea71696f6fa0d3%3A0x37221bb00bc1836f!2s765%20Main%20St%2C%20Winnipeg%2C%20MB%20R2W%203N5!5e0!3m2!1sen!2sca!4v1647622605321!5m2!1sen!2sca" class="w-full h-full rounded-[45px] opacity-80" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
			</div>
		</div>

	</div>

	<!-- Decorative images -->
	<img src="<?php echo esc_url( $sperm_img ); ?>" alt="" class="object-contain absolute top-24 hidden md:block right-10 h-64 m-0 z-0">
	<img src="<?php echo esc_url( $frog_img ); ?>" alt="" class="object-contain absolute bottom-0 right-10 h-64 !-mb-40 z-20">
</section>

<!-- Get Social Section -->
<section class="bg-white py-8">
	<div class="h-auto mx-6 lg:mx-auto max-w-5xl bg-white">
		<div class="flex flex-row justify-between items-end">
			<h2 class="uppercase text-purple text-3xl">Get social with <span class="text-red">Go Ask Auntie</span></h2>
			<?php get_template_part( 'views/partials/social-media' ); ?>
		</div>
	</div>
</section>

<?php get_footer(); ?>