/home/u336066629/websites/AmAL87tCa/public_html/wp-content/themes/shf/contact.php
<?php get_header();
/*
* Template Name: Contact Page
*/
?>
<section class="w-full h-[100vh] bg-[#343434] flex items-center justify-center">
<div class="mouse-circles">
<div class="glow-circle"></div>
<div class="glow-circle"></div>
<div class="glow-circle"></div>
</div>
<div class="container max-w-2xl mx-auto text-white px-6">
<div class="w-full">
<from>
<?php echo do_shortcode('[contact-form-7 id="ab469e9" title="Contact form"]'); ?>
</from>
</div>
</div>
</div>
</section>
<script>
document.addEventListener('mousemove', (e) => {
const circles = document.querySelectorAll('.glow-circle');
const radius = 150;
const viewportWidth = window.innerWidth;
const viewportHeight = window.innerHeight;
const oppositeX = viewportWidth - e.clientX;
const oppositeY = viewportHeight - e.clientY;
circles.forEach((circle, index) => {
const angle = (index * 120) * (Math.PI / 180);
let x = oppositeX + radius * Math.cos(angle) - circle.offsetWidth/4;
let y = oppositeY + radius * Math.sin(angle) - circle.offsetHeight/4;
x = Math.max(0, Math.min(x, viewportWidth - circle.offsetWidth));
y = Math.max(0, Math.min(y, viewportHeight - circle.offsetHeight));
circle.style.transform = `translate(${x}px, ${y}px)`;
});
});
</script>
<?php get_footer(); ?>