/* ===== Particle Animation Styles ===== */
.particle-1 { --delay: 0s; --x: 10%; --y: 20%; }
.particle-2 { --delay: 2s; --x: 80%; --y: 10%; }
.particle-3 { --delay: 4s; --x: 50%; --y: 60%; }
.particle-4 { --delay: 1s; --x: 90%; --y: 80%; }
.particle-5 { --delay: 3s; --x: 20%; --y: 70%; }
.particle-6 { --delay: 5s; --x: 60%; --y: 30%; }

.particle {
    animation-delay: var(--delay);
    left: var(--x);
    top: var(--y);
}

/* ===== Feature Cards Animation Delays ===== */
.feature-card:nth-child(1) { --delay: 0.1s; }
.feature-card:nth-child(2) { --delay: 0.2s; }
.feature-card:nth-child(3) { --delay: 0.3s; }
.feature-card:nth-child(4) { --delay: 0.4s; }
.feature-card:nth-child(5) { --delay: 0.5s; }
.feature-card:nth-child(6) { --delay: 0.6s; }

/* ===== Steps Animation Delays ===== */
.steps-container .step:nth-child(3) { --delay: 0.1s; }
.steps-container .step:nth-child(4) { --delay: 0.3s; }
.steps-container .step:nth-child(5) { --delay: 0.5s; }

/* ===== Use Case Cards Animation Delays ===== */
.use-case-card:nth-child(1) { --delay: 0.1s; }
.use-case-card:nth-child(2) { --delay: 0.2s; }
.use-case-card:nth-child(3) { --delay: 0.3s; }
.use-case-card:nth-child(4) { --delay: 0.4s; }
.use-case-card:nth-child(5) { --delay: 0.5s; }