/* =============================================================
   Habla – Visual Effects (interactive particle background)
   Respects existing color palette. No dark theme.
   El visual de onda (waveform) vive en waveform.css (sin enlazar).
   ============================================================= */

/* ── Full-page canvas stacking ─────────────────────────────── */
/*
   html keeps the white background; body goes transparent so the
   fixed canvas (z-index:-1) shows through. Content needs no
   z-index changes: anything in the normal flow paints above a
   negative z-index layer. Sections with their own opaque
   background simply cover the particles.
*/
html { background: #ffffff; }
body { background: transparent; }

#habla-bg-canvas {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: -1;
}

/* ── Hero: ensure inner content sits above canvas ──────────── */
.hero-inner { position: relative; z-index: 1; }