/* CC-02b Wave 1 - extracted from FRONTEND/02_profiles/profile-optimization-tips.html */
.gradient-astro {
            background: linear-gradient(135deg, #8B5CF6 0%, #A855F7 100%);
        }
        
        .gradient-modern {
            background: linear-gradient(135deg, #EC4899 0%, #F472B6 100%);
        }
        
        .gradient-success {
            background: linear-gradient(135deg, #10B981 0%, #34D399 100%);
        }
        
        .progress-bar::after {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
            animation: shimmer 2s infinite;
        }
        .completion-circle {
            position: relative;
            width: 4rem;
            height: 4rem;
        }
        
        .completion-circle svg {
            transform: rotate(-90deg);
        }
        
        .completion-circle
        
        .completion-circle .progress-ring-fill {
            fill: none;
            stroke-width: 4;
            stroke: url(#gradient);
            stroke-linecap: round;
            stroke-dasharray: 188.5;
            stroke-dashoffset: 188.5;
            animation: progress-animation 2s ease-out forwards;
        }
        
        @keyframes progress-animation {
            to {
                stroke-dashoffset: 47.1;
            }
        }
