amoryroma/scripts.js

// ===== MENU =====
function toggleMenu() {
  document.getElementById('sheet').classList.toggle('open');
  document.getElementById('overlay').classList.toggle('open');
}

// ===== TABS =====
function showTab(i, el) {
  document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
  document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
  el.classList.add('active');
  document.querySelector('.panel[data-panel="' + i + '"]').classList.add('active');
}

// ===== ACCORDION =====
function toggleAcc(head) {
  const item = head.parentElement;
  document.querySelectorAll('.acc-item').forEach(i => { if (i !== item) i.classList.remove('open'); });
  item.classList.toggle('open');
}

// ===== FAQ =====
function toggleFaq(head) {
  const item = head.parentElement;
  const isOpen = item.classList.contains('open');
  document.querySelectorAll('.faq-item').forEach(i => {
    i.classList.remove('open');
    const t = i.querySelector('.faq-toggle');
    if (t) t.textContent = '+';
  });
  if (!isOpen) {
    item.classList.add('open');
    const toggle = item.querySelector('.faq-toggle');
    if (toggle) toggle.textContent = '−';
  }
}

// ===== COTIZADOR =====
const answers = [null, null, null];
let current = 0;

document.querySelectorAll('.opt').forEach(opt => {
  opt.addEventListener('click', function() {
    const group = this.parentElement;
    const q = parseInt(group.dataset.q);
    group.querySelectorAll('.opt').forEach(o => o.classList.remove('selected'));
    this.classList.add('selected');
    answers[q] = parseInt(this.dataset.val);
    document.getElementById('next' + q).disabled = false;
    const step = this.closest('.step');
    const qNum = step.querySelector('.q-num');
    if (qNum) qNum.classList.add('active');
  });
});

function updateProgress() {
  for (let i = 0; i < 3; i++) {
    document.getElementById('p' + (i + 1)).style.width = i <= current ? '100%' : '0%';
  }
}

function next() {
  document.querySelector('.step[data-step="' + current + '"]').classList.remove('active');
  current++;
  document.querySelector('.step[data-step="' + current + '"]').classList.add('active');
  updateProgress();
}

function prev() {
  document.querySelector('.step[data-step="' + current + '"]').classList.remove('active');
  current--;
  document.querySelector('.step[data-step="' + current + '"]').classList.add('active');
  updateProgress();
}

const plans = [
  { name: 'Esencial', price: '$250.000 ARS', desc: 'Ideal para arrancar con presencia digital profesional y consistente, sin sobre-invertir todavía.' },
  { name: 'Impulso', price: '$420.000 ARS', desc: 'Pensado para marcas en crecimiento que necesitan más alcance, leads y una primera campaña de publicidad.' },
  { name: 'Premium', price: '$650.000 ARS + pauta', desc: 'Nuestro plan más recomendado: gestión integral de contenido, publicidad y estrategia para consolidar y expandir.' },
  { name: 'Elite', price: '$1.000.000 ARS', desc: 'Máximo posicionamiento y gestión de marca completa, para negocios listos para escalar en serio.' }
];

function showResult() {
  document.querySelector('.step[data-step="2"]').classList.remove('active');
  const avg = Math.round((answers[0] + answers[1] + answers[2]) / 3);
  const idx = Math.min(Math.max(avg - 1, 0), 3);
  document.getElementById('rp-name').textContent = plans[idx].name;
  document.getElementById('rp-price').innerHTML = plans[idx].price + ' <small>/ mes</small>';
  document.getElementById('rp-desc').textContent = plans[idx].desc;
  document.getElementById('result').classList.add('active');
}

function restart() {
  answers[0] = answers[1] = answers[2] = null;
  current = 0;
  document.querySelectorAll('.opt').forEach(o => o.classList.remove('selected'));
  document.querySelectorAll('[id^="next"]').forEach(b => b.disabled = true);
  document.querySelectorAll('.q-num').forEach(q => q.classList.remove('active'));
  document.getElementById('result').classList.remove('active');
  document.querySelectorAll('.step').forEach(s => s.classList.remove('active'));
  document.querySelector('.step[data-step="0"]').classList.add('active');
  updateProgress();
}

// ===== FILTRO DE SERVICIOS EN CONTACTO =====
function selectFilter(event) {
  const el = event.currentTarget;
  const container = el.parentElement;
  container.querySelectorAll('.filter-tag').forEach(t => t.classList.remove('active'));
  el.classList.add('active');
  const value = el.dataset.value;
  document.getElementById('servicioSeleccionado').value = value;
  const otroInput = document.getElementById('servicioOtro');
  if (value === 'otro') {
    otroInput.style.display = 'block';
    otroInput.required = true;
  } else {
    otroInput.style.display = 'none';
    otroInput.required = false;
    otroInput.value = '';
  }
}

// ===== FORMULARIO =====
function handleSubmit(e) {
  e.preventDefault();
  const form = document.getElementById('contactForm');
  const data = new FormData(form);
  const nombre = data.get('nombre');
  const email = data.get('email');
  const mensaje = data.get('mensaje');
  if (!nombre || !email || !mensaje) {
    alert('Por favor, completá todos los campos obligatorios.');
    return false;
  }
  const btn = form.querySelector('button[type="submit"]');
  const originalText = btn.textContent;
  btn.textContent = 'Enviando...';
  btn.disabled = true;
  setTimeout(() => {
    alert('¡Mensaje enviado con éxito! Te responderemos a la brevedad.');
    form.reset();
    btn.textContent = originalText;
    btn.disabled = false;
    document.querySelectorAll('.filter-tag').forEach(t => t.classList.remove('active'));
    document.querySelector('.filter-tag[data-value="todos"]').classList.add('active');
    document.getElementById('servicioOtro').style.display = 'none';
  }, 1500);
  return false;
}