/* ═══════════════════════════════════════════════
   ZONA TRAUMÁTICA — Desktop-Only Styles
   Three.js + GSAP states + premium hover effects
   ═══════════════════════════════════════════════ */
@media (min-width: 769px) {
  #heroCanvas {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 0; pointer-events: none;
  }
  .hero { position: relative; overflow: hidden; }
  .hero-inner { position: relative; z-index: 1; }

  /* GSAP initial states */
  .gsap-hero-text { opacity: 0; transform: translateX(-60px); }
  .gsap-hero-visual { opacity: 0; transform: scale(0.85) translateY(30px); }
  .gsap-fade-up { opacity: 0; transform: translateY(40px); }

  /* Scroll progress */
  .scroll-progress {
    position: fixed; top: 0; left: 0;
    height: 3px; width: 100%;
    background: linear-gradient(90deg, var(--primary), var(--accent));
    z-index: 9999; transform-origin: left; transform: scaleX(0);
  }

  /* Product grid 4 columns */
  .products-grid { grid-template-columns: repeat(4, 1fr); }

  /* Premium hover effects */
  .product-card {
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .product-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 0 30px rgba(var(--primary-rgb), 0.15),
                0 20px 40px rgba(0,0,0,0.3);
  }

  /* Why cards stagger */
  .why-card {
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .why-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.3);
  }

  /* Step cards */
  .step-card:hover {
    transform: translateY(-4px);
    border-color: rgba(var(--primary-rgb), 0.3);
  }

  /* Testimonial cards */
  .testimonial-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.3);
  }

  /* Magnetic buttons (GSAP handles the animation) */
  .btn-primary, .btn-urgency, .nav-cta {
    position: relative;
  }

  /* Archetype cards desktop sizing */
  .archetype-card { min-width: 110px; padding: 16px 14px; }
}