.under-dev { 
                            position: relative; 
                            padding: 60px 20px 50px; 
                            margin: 30px 0 45px; 
                            background: linear-gradient(135deg,#f8f9fa,#e9ecef); 
                            border: 2px dashed #b9bfc5; 
                            border-radius: 16px; 
                            text-align: center; 
                            overflow: hidden;
                        }
                        .under-dev:before, .under-dev:after { 
                            content:""; 
                            position: absolute; 
                            width: 140px; 
                            height: 140px; 
                            background: radial-gradient(circle at 30% 30%, rgba(0,123,255,.25), rgba(0,123,255,0)); 
                            animation: floatBg 9s linear infinite; 
                            z-index:0; 
                        }
                        .under-dev:before { top:-40px; left:-40px; }
                        .under-dev:after { bottom:-40px; right:-40px; animation-delay: -4.5s; }
                        @keyframes floatBg { 0%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(18px) rotate(180deg);}100%{transform:translateY(0) rotate(360deg);} }

                        .under-dev .dev-inner { position:relative; z-index:2; }
                        .gears { display:inline-flex; align-items:center; gap:32px; }
                        .gear { width:90px; height:90px; position:relative; filter:drop-shadow(0 4px 6px rgba(0,0,0,.15)); }
                        .gear:before, .gear:after { content:""; position:absolute; inset:0; border-radius:50%; }
                        .gear:before { background:conic-gradient(from 0deg,#007bff,#0d6efd,#0d6efd,#007bff); mask:radial-gradient(circle at 50% 50%, transparent 34%, black 35%); }
                        .gear:after { background: repeating-linear-gradient(0deg, transparent 0 6px, rgba(255,255,255,.85) 6px 7px),
                            linear-gradient(135deg,#0d6efd,#4dabf7); mix-blend-mode:overlay; opacity:.7; border-radius:50%; }
                        .gear-small { width:60px; height:60px; animation: spinReverse 10s linear infinite; }
                        .gear-large { animation: spinForward 12s linear infinite; }
                        @keyframes spinForward { from{ transform:rotate(0deg);} to{ transform:rotate(360deg);} }
                        @keyframes spinReverse { from{ transform:rotate(0deg);} to{ transform:rotate(-360deg);} }

                        /* Notches */
                        .gear:before { box-shadow: 0 0 0 6px rgba(255,255,255,.2), 0 0 0 3px rgba(13,110,253,.6); }

                        .progress-wrapper { margin:30px auto 10px; max-width:420px; }
                        .progress-bar { background:#dee2e6; border-radius:30px; height:16px; position:relative; overflow:hidden; }
                        .progress-fill { position:absolute; top:0; left:0; height:100%; width:38%; background:linear-gradient(90deg,#0d6efd,#7ab8ff); animation: progressAnim 3.5s ease-in-out infinite; }
                        @keyframes progressAnim { 0%{width:5%;}50%{width:85%;}100%{width:5%;} }

                        .dots { display:flex; justify-content:center; gap:9px; margin-top:14px; }
                        .dots span { width:12px; height:12px; border-radius:50%; background:#0d6efd; animation: pulse 1.2s ease-in-out infinite; }
                        .dots span:nth-child(2){ animation-delay:.4s; }
                        .dots span:nth-child(3){ animation-delay:.8s; }
                        @keyframes pulse { 0%,100%{ transform:scale(.5); opacity:.4;} 50%{ transform:scale(1); opacity:1;} }

                        .dev-text { font-size:36px; margin:35px 0 5px; font-weight:600; letter-spacing:.5px; color:#212529; text-shadow:0 1px 0 #fff; }
                        .dev-sub { font-size:16px; color:#555; margin-bottom:0; }
                        .status-label { display:inline-block; background:#ffc107; color:#212529; padding:4px 14px; font-size:14px; border-radius:20px; font-weight:500; box-shadow:0 1px 3px rgba(0,0,0,.2); }
                        .under-dev .assistive { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }

                        /* Reduced motion preference */
                        @media (prefers-reduced-motion: reduce) {
                            .gear-large, .gear-small, .progress-fill, .dots span, .under-dev:before, .under-dev:after { animation: none !important; }
                            .progress-fill { width:70%; }
                        }
                        @media (max-width: 575.98px){
                            .gear { width:70px; height:70px; }
                            .gear-small { width:50px; height:50px; }
                            .dev-text { font-size:30px; }
                        }
                        @media print { .under-dev { display:none !important; } }