.site-title.show,
.copyright.show {
    display: none !important;
}

.wpcf7-response-output {
    color: #ffffff;
    text-align: center !important;
    margin: 12px auto 0 !important;
    max-width: 600px !important;
}
/* ===================================================================
   CF7 – FORMULARIO "SOLICITA TU COTIZACIÓN"  |  Benme Productions
   Pega esto en: Apariencia › Personalizar › CSS Adicional
   (o en el panel de CSS personalizado de la Sección/Columna de
   Elementor que contiene el widget "Shortcode" con [contact-form-7])
=================================================================== */

/* ── Variables de color (scoped al wrapper para no chocar con
      otros estilos globales del tema) ─────────────────────────── */
.cf7-cotizacion-wrapper {
  --purple:     #522D6D;
  --purple-mid: #5B2D8E;
  --purple-lt:  #8B5CC8;
  --purple-xs:  #1A0640;
  --gold:       #C9A84C;
  --gold-lt:    #E8C96A;
  --gold-dim:   #8A6B28;
  --white:      #FFFFFF;

  display: block !important;
  max-width: 1560px !important;
  margin: 0 auto !important;
  padding: 60px 250px 60px 250px !important;
  background: linear-gradient(135deg, var(--purple-xs) 0%, var(--purple) 50%, var(--purple-xs) 100%) !important;
  position: relative !important;
  overflow: hidden !important;
  font-family: 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Cuadrícula de fondo (idéntica al ::before de la referencia) */
.cf7-cotizacion-wrapper::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image:
    linear-gradient(rgba(201,168,76,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,168,76,0.03) 1px, transparent 1px) !important;
  background-size: 60px 60px !important;
  pointer-events: none !important;
}

/* Todo el contenido va sobre la cuadrícula de fondo */
.cf7-cotizacion-wrapper > * {
  position: relative !important;
  z-index: 2 !important;
}

/* ── Encabezado ───────────────────────────────────────────────── */
.cf7-form-header {
  display: block !important;
  text-align: center !important;
  margin-bottom: 48px !important;
}

.cf7-form-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;
  color: var(--gold-lt) !important;
  margin-bottom: 18px !important;
}

.cf7-eyebrow-line {
  width: 28px !important;
  height: 1px !important;
  background: var(--gold-lt) !important;
  display: inline-block !important;
}

.cf7-form-title {
  display: block !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 300 !important;
  color: var(--white) !important;
  line-height: 1.15 !important;
  margin-bottom: 16px !important;
}

.cf7-form-title em {
  font-weight: 700 !important;
  font-style: italic !important;
  color: var(--gold) !important;
}

.cf7-form-subtitle {
  display: block !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  color: #C0B0DC !important;
  line-height: 1.8 !important;
}

/* ── Grid de campos (2 columnas) ─────────────────────────────── */
.cf7-form-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important;
  margin-bottom: 8px !important;
}

.cf7-form-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.cf7-form-group.full {
  grid-column: span 2 !important;
}

.cf7-form-label {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  color: var(--gold) !important;
  text-transform: uppercase !important;
}

/* ── Inputs / select / textarea ──────────────────────────────── */
.cf7-cotizacion-wrapper input[type="text"],
.cf7-cotizacion-wrapper input[type="email"],
.cf7-cotizacion-wrapper input[type="tel"],
.cf7-cotizacion-wrapper input[type="date"],
.cf7-cotizacion-wrapper select,
.cf7-cotizacion-wrapper textarea {
  width: 100% !important;
  padding: 14px 20px !important;
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(201,168,76,0.2) !important;
  color: var(--white) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  outline: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  box-sizing: border-box !important;
  transition: border-color .3s, background .3s !important;
  /* Esquina cortada característica del diseño de referencia */
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%) !important;
}

.cf7-cotizacion-wrapper input::placeholder,
.cf7-cotizacion-wrapper textarea::placeholder {
  color: rgba(255,255,255,0.25) !important;
}

.cf7-cotizacion-wrapper input:focus,
.cf7-cotizacion-wrapper select:focus,
.cf7-cotizacion-wrapper textarea:focus {
  border-color: var(--gold) !important;
  background: rgba(201,168,76,0.05) !important;
}

.cf7-cotizacion-wrapper select {
  cursor: pointer !important;
  color: var(--white) !important;
  background-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="%23C9A84C"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"/></svg>') !important;
  background-repeat: no-repeat !important;
  background-position: right 18px center !important;
  background-size: 16px !important;
  padding-right: 44px !important;
}

.cf7-cotizacion-wrapper select option {
  background: var(--purple) !important;
  color: var(--white) !important;
}

.cf7-cotizacion-wrapper textarea {
  resize: vertical !important;
  min-height: 120px !important;
  line-height: 1.6 !important;
  clip-path: none !important; /* el clip-path en textareas altos corta texto, se omite */
}

/* ── Radios "Servicio de Interés" (estilo pill) ──────────────── */
/* CF7 genera: .wpcf7-form-control.wpcf7-radio > .wpcf7-list-item > label > input + span */
.cf7-cotizacion-wrapper .wpcf7-form-control.wpcf7-radio {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item {
  margin: 0 !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  padding: 10px 18px !important;
  border: 1px solid rgba(201,168,76,0.2) !important;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%) !important;
  transition: all .3s !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item label:hover {
  border-color: var(--gold) !important;
  background: rgba(201,168,76,0.06) !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item input[type="radio"] {
  /* Oculto visualmente pero accesible; el estado se refleja en el label */
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item-label {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,0.6) !important;
  transition: color .3s !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item input[type="radio"]:checked ~ .wpcf7-list-item-label {
  color: var(--gold) !important;
}

.cf7-cotizacion-wrapper .wpcf7-list-item:has(input[type="radio"]:checked) label {
  border-color: var(--gold) !important;
  background: rgba(201,168,76,0.1) !important;
}

/* ── Fila de envío: nota + botón ──────────────────────────────── */
.cf7-form-submit {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-top: 24px !important;
}

.cf7-form-note {
  font-size: 14px !important;
  color: #9B7FCC !important;
  font-weight: 300 !important;
  margin: 0 !important;
}

.cf7-cotizacion-wrapper .wpcf7-submit,
.cf7-cotizacion-wrapper input[type="submit"] {
  padding: 18px 52px !important;
  background: var(--gold) !important;
  color: var(--purple-xs) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  border: none !important;
  cursor: pointer !important;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px)) !important;
  transition: all .3s !important;
  white-space: nowrap !important;
}

.cf7-cotizacion-wrapper .wpcf7-submit:hover,
.cf7-cotizacion-wrapper input[type="submit"]:hover {
  background: var(--gold-lt) !important;
  transform: translateY(-2px) !important;
}

/* Spinner de carga de CF7, recoloreado a dorado */
.cf7-cotizacion-wrapper .wpcf7-spinner {
  background-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"><circle cx="25" cy="25" r="20" fill="none" stroke="%23C9A84C" stroke-width="4" stroke-dasharray="31.4" stroke-linecap="round"><animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 25 25" to="360 25 25" dur="1s" repeatCount="indefinite"/></circle></svg>') !important;
  background-color: transparent !important;
  border: none !important;
}

/* ── Validación y mensajes de respuesta ──────────────────────── */
.cf7-cotizacion-wrapper .wpcf7-not-valid-tip {
  color: #F4B4B4 !important;
  font-size: 13px !important;
  margin-top: 2px !important;
  display: block !important;
}

.cf7-cotizacion-wrapper .wpcf7-response-output {
  margin: 20px 0 0 !important;
  padding: 14px 20px !important;
  border-radius: 2px !important;
  font-size: 15px !important;
  text-align: center !important;
}

.cf7-cotizacion-wrapper .wpcf7-mail-sent-ok {
  background: rgba(201,168,76,0.1) !important;
  color: var(--gold-lt) !important;
  border: 1px solid rgba(201,168,76,0.3) !important;
}

.cf7-cotizacion-wrapper .wpcf7-mail-sent-ng,
.cf7-cotizacion-wrapper .wpcf7-validation-errors,
.cf7-cotizacion-wrapper .wpcf7-acceptance-missing {
  background: rgba(239,68,68,0.12) !important;
  color: #F4B4B4 !important;
  border: 1px solid rgba(239,68,68,0.28) !important;
}

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 900px) {
  .cf7-cotizacion-wrapper { padding: 48px 28px !important; }
}

@media (max-width: 640px) {
  .cf7-cotizacion-wrapper { padding: 40px 20px !important; }

  .cf7-form-grid { grid-template-columns: 1fr !important; }

  .cf7-form-group.full { grid-column: span 1 !important; }

  .cf7-form-submit {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .cf7-cotizacion-wrapper .wpcf7-submit,
  .cf7-cotizacion-wrapper input[type="submit"] {
    width: 100% !important;
    text-align: center !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
     GUÍA RÁPIDA DE NAVEGACIÓN DE ESTE ARCHIVO
     Usa Ctrl+F / Cmd+F y busca "SECCIÓN:" para saltar entre bloques.
     El CSS está agrupado por sección de la página (Header, Hero,
     Quiénes Somos, Propósito, Lo Que Nos Mueve, Por Qué Nosotros,
     La Oportunidad, Lo Que Hacemos, Nuestro Claim en Dos Idiomas,
     Nuestro Trabajo, Cómo Trabajamos, Solicita tu Cotización, Footer).
     Algunos bloques de una misma sección aparecen en más de un lugar
     del stylesheet (por ejemplo "Lo Que Hacemos" tiene el encabezado
     general y, más abajo, las tarjetas de precios); ambos llevan el
     mismo rótulo de SECCIÓN para que sea fácil ubicarlos. #AE95DA
  ══════════════════════════════════════════════════════════════════ */
  :root {
    --purple:     #522D6D;
    --purple-mid: #5B2D8E;
    --purple-lt:  #8B5CC8;
    --purple-xs:  #1A0640;
    --gold:       #C9A84C;
    --gold-lt:    #E8C96A;
    --gold-dim:   #8A6B28;
    --cream:      #FAF6EE;
    --ink:        #0E0520;
    --smoke:      #F4F0FA;
    --mist:       #EDE6F8;
    --white:      #FFFFFF;
    --grey:       #8A8099;
  }

  *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

  html { scroll-behavior: smooth; }

  body {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    background: var(--ink);
    color: var(--white);
    overflow-x: hidden;
    cursor: none;
  }

  .cursor {
    position: fixed; top:0; left:0; pointer-events:none; z-index:9999;
    mix-blend-mode: difference;
  }
  .cursor-dot {
    width:8px; height:8px; background:var(--gold);
    border-radius:50%; position:absolute;
    transform: translate(-50%,-50%);
    transition: transform 0.1s ease;
  }
  .cursor-ring {
    width:36px; height:36px; border:1.5px solid var(--gold-lt);
    border-radius:50%; position:absolute;
    transform: translate(-50%,-50%);
    transition: transform 0.15s ease, width 0.3s ease, height 0.3s ease, opacity 0.3s;
  }
  body:has(a:hover) .cursor-ring,
  body:has(button:hover) .cursor-ring { width:56px; height:56px; opacity:.6; }

 

  

  @keyframes fadeUp {
    from { opacity:0; transform:translateY(30px); }
    to   { opacity:1; transform:translateY(0); }
  }
  @keyframes marquee {
    from { transform:translateX(0); }
    to   { transform:translateX(-50%); }
  }
  @keyframes rotateBadge {
    from { transform:rotate(0deg); }
    to   { transform:rotate(360deg); }
  }
  @keyframes scrollPulse {
    0%,100% { opacity:.3; transform:scaleY(1); }
    50%      { opacity:1; transform:scaleY(1.1); }
  }

  /* Scroll reveal */
  .reveal {
    opacity:0; transform:translateY(40px);
    transition:opacity 0.8s ease, transform 0.8s ease;
  }
  .reveal.visible { opacity:1; transform:translateY(0); }
  .reveal-delay-1 { transition-delay:0.1s; }
  .reveal-delay-2 { transition-delay:0.2s; }
  .reveal-delay-3 { transition-delay:0.3s; }
  .reveal-delay-4 { transition-delay:0.4s; }

  

  @media (max-width: 900px) {
    nav { padding:20px 24px; }
    nav.scrolled { padding:14px 24px; }
    .nav-links { display:none; }
    #hero { padding:120px 24px 60px; }
    .hero-scroll, .hero-badge { display:none; }
    #about { grid-template-columns:1fr; padding:80px 24px; gap:48px; }
    .about-number { display:none; }
    .products-header { padding:60px 24px 48px; flex-direction:column; gap:16px; align-items:flex-start; }
    .products-grid { grid-template-columns:1fr; }
    .product-card { border-right:none; border-bottom:1px solid rgba(91,45,142,0.15); }
    .lang-strip { padding:80px 24px; }
    #launch { padding:80px 24px; }
    .launch-details { grid-template-columns:1fr 1fr; }
    #process { padding:80px 24px; }
    .process-steps { grid-template-columns:1fr 1fr; gap:32px; }
    .process-steps::before { display:none; }
    #contact { padding:80px 24px; }
    .form-grid { grid-template-columns:1fr; }
    .form-group.full { grid-column:span 1; }
    .form-submit { flex-direction:column; gap:20px; align-items:stretch; }
    .btn-submit { justify-content:center; }
    footer { flex-direction:column; gap:32px; text-align:center; padding:40px 24px; }
  }

// CURSOR PERSONALIZADO — hace que el cursor a medida siga el mouse
const cursor = document.getElementById('cursor');
const dot    = document.getElementById('cursorDot');
const ring   = document.getElementById('cursorRing');
let mx=0, my=0, rx=0, ry=0;

document.addEventListener('mousemove', e => { mx=e.clientX; my=e.clientY; });

function animateCursor() {
  rx += (mx - rx) * 0.18;
  ry += (my - ry) * 0.18;
  dot.style.left  = mx + 'px';
  dot.style.top   = my + 'px';
  ring.style.left = rx + 'px';
  ring.style.top  = ry + 'px';
  requestAnimationFrame(animateCursor);
}
animateCursor();

// ANIMACIÓN "REVEAL" AL HACER SCROLL — utilidad usada por casi todas las secciones
const reveals = document.querySelectorAll('.reveal');
const observer = new IntersectionObserver((entries) => {
  entries.forEach(e => { if (e.isIntersecting) { e.target.classList.add('visible'); } });
}, { threshold: 0.12 });
reveals.forEach(el => observer.observe(el));

// SCROLL SUAVE al hacer clic en enlaces internos (#anchors)
document.querySelectorAll('a[href^="#"]').forEach(a => {
  a.addEventListener('click', e => {
    const target = document.querySelector(a.getAttribute('href'));
    if (target) { e.preventDefault(); target.scrollIntoView({ behavior:'smooth', block:'start' }); }
  });
});