/* =============================================================
   NM-Fitness — Custom Styles
   Complements Tailwind CSS utility classes defined in index.html
   ============================================================= */

/* --- Glassmorphism panel --- */
.glass-panel {
    background-color: rgb(15 23 42 / 0.4); /* slate-900/40 */
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgb(51 65 85 / 0.5); /* slate-700/50 */
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
}

/* --- Orange CTA glow --- */
.glow-primary {
    box-shadow: 0 0 20px rgba(249, 115, 22, 0.3);
    transition: box-shadow 0.3s ease;
}
.glow-primary:hover {
    box-shadow: 0 0 30px rgba(249, 115, 22, 0.5);
}

/* --- White-to-slate text gradient --- */
.text-gradient {
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(to right, #ffffff, #94a3b8);
}

/* --- Instagram gradient ring --- */
.insta-ring {
    padding: 3px;
    border-radius: 9999px;
    background-image: linear-gradient(to top right, #f09433, #dc2743, #bc1888);
}

/* --- Button shine animation --- */
@keyframes shine {
    100% {
        transform: translateX(100%);
    }
}

/* --- Arrow bounce animation --- */
@keyframes bounce-right {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(6px);
    }
}

.arrow-bounce {
    animation: bounce-right 0.8s linear infinite alternate;
}

/* --- FAQ accordion (native <details>/<summary>) --- */
.faq-item summary {
    list-style: none;
}
.faq-item summary::-webkit-details-marker {
    display: none;
}