<?php
/**
 * Landing Page Footer - Template landing_v1
 * Contém: <footer>, scripts JS e fechamento </body></html>
 */
?>

<style>
/* Footer Styles */
.footer{background:var(--bg-darker);padding:4rem 2rem 2rem;border-top:1px solid var(--border)}
.footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
.footer-brand .logo{margin-bottom:1rem}
.footer-brand p{color:var(--text-muted);font-size:.95rem;max-width:300px}
.footer-title{font-size:1rem;font-weight:700;margin-bottom:1.25rem;color:var(--text-primary)}
.footer-links{list-style:none}
.footer-links li{margin-bottom:.75rem}
.footer-links a{color:var(--text-muted);text-decoration:none;transition:color .2s;font-size:.95rem}
.footer-links a:hover{color:var(--gold)}
.footer-bottom{max-width:1200px;margin:0 auto;padding-top:2rem;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.footer-bottom span{color:var(--text-muted);font-size:.875rem}
.social-links{display:flex;gap:1rem}
.social-links a{color:var(--text-muted);font-size:1.25rem;transition:color .2s}
.social-links a:hover{color:var(--gold)}

/* Footer Responsive */
@media(max-width:767px){
.footer{padding:3rem 1rem 1.5rem}
.footer-grid{grid-template-columns:1fr;gap:2rem;text-align:center}
.footer-brand{text-align:center}
.footer-brand p{margin:1rem auto 0}
.footer-bottom{flex-direction:column;gap:1rem;text-align:center}
}
</style>

<footer class="footer">
<div class="footer-grid">
<div class="footer-brand">
<a href="/" class="logo">
<?php if ($siteLogoType === 'image' && !empty($siteLogo)): ?>
    <img src="<?php echo htmlspecialchars($siteLogo); ?>" alt="<?php echo htmlspecialchars($siteName); ?>" class="logo-img" style="max-height: 40px; width: auto;">
<?php else: ?>
    <iconify-icon icon="mdi:store"></iconify-icon>
    <?php echo htmlspecialchars($siteName); ?>
<?php endif; ?>
</a>
<p><?php echo htmlspecialchars($siteDescription); ?></p>
</div>
<div>
<h4 class="footer-title">Produto</h4>
<ul class="footer-links">
<li><a href="/#recursos">Recursos</a></li>
<li><a href="/#precos">Precos</a></li>
<li><a href="/#depoimentos">Depoimentos</a></li>
</ul>
</div>
<div>
<h4 class="footer-title">Empresa</h4>
<ul class="footer-links">
<li><a href="#">Sobre nos</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contato</a></li>
</ul>
</div>
<div>
<h4 class="footer-title">Legal</h4>
<ul class="footer-links">
<li><a href="#">Termos de Uso</a></li>
<li><a href="#">Privacidade</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<span>&copy; <?php echo date('Y'); ?> <?php echo htmlspecialchars($siteName); ?>. Todos os direitos reservados.</span>
<div class="social-links">
<a href="#" aria-label="Instagram"><iconify-icon icon="mdi:instagram"></iconify-icon></a>
<a href="#" aria-label="Facebook"><iconify-icon icon="mdi:facebook"></iconify-icon></a>
<a href="#" aria-label="YouTube"><iconify-icon icon="mdi:youtube"></iconify-icon></a>
</div>
</div>
</footer>
<script>
function toggleMobileMenu(){
const nav=document.getElementById('mobileNav');
const footer=document.getElementById('mobileFooter');
const overlay=document.querySelector('.nav-overlay');
const btn=document.querySelector('.mobile-menu-toggle');
const closeBtn=document.querySelector('.menu-close');
nav.classList.toggle('active');
footer.classList.toggle('active');
overlay.classList.toggle('active');
btn.classList.toggle('active');
closeBtn.classList.toggle('active');
document.body.style.overflow=nav.classList.contains('active')?'hidden':'';
const header=document.querySelector('.header');
if(header){header.style.zIndex=nav.classList.contains('active')?'1':'1';}
}
document.querySelectorAll('.nav-links a, .mobile-menu-footer a').forEach(a=>{
a.addEventListener('click',function(){
if(window.innerWidth<=767){
toggleMobileMenu();
}
});
});
document.querySelectorAll('a[href^="#"]').forEach(a=>a.addEventListener('click',function(e){
e.preventDefault();
const t=document.querySelector(this.getAttribute('href'));
if(t){
const offset=80;
const bodyRect=document.body.getBoundingClientRect().top;
const elementRect=t.getBoundingClientRect().top;
const elementPosition=elementRect-bodyRect;
const offsetPosition=elementPosition-offset;
window.scrollTo({top:offsetPosition,behavior:'smooth'});
}
}));
window.addEventListener('resize',function(){
if(window.innerWidth>767){
document.getElementById('mobileNav').classList.remove('active');
document.getElementById('mobileFooter').classList.remove('active');
document.querySelector('.nav-overlay').classList.remove('active');
document.querySelector('.mobile-menu-toggle').classList.remove('active');
document.querySelector('.menu-close').classList.remove('active');
document.body.style.overflow='';
}
});
</script>
</body>
</html>
