/* Página de manutenção da Central do Cliente */
.maint-body { min-height: 100vh; display: flex; flex-direction: column; }
.maint-body > main { flex: 1; display: flex; flex-direction: column; }
.maint { position: relative; flex: 1; display: grid; place-items: center; overflow: hidden; padding: clamp(48px, 9vw, 110px) 0; text-align: center; }
.maint-glow {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(50% 45% at 50% 30%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 70%),
    radial-gradient(60% 50% at 50% 0%, rgba(2, 61, 83, .55), transparent 70%);
}
:root[data-theme="light"] .maint-glow {
  background:
    radial-gradient(50% 45% at 50% 30%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%),
    radial-gradient(60% 50% at 50% 0%, rgba(2, 61, 83, .08), transparent 70%);
}
.maint-inner { position: relative; display: flex; flex-direction: column; align-items: center; }

.maint-art { position: relative; width: 190px; height: 190px; display: grid; place-items: center; margin-bottom: 36px; }
.ring { position: absolute; inset: 0; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent); animation: pulse 3.6s var(--ease) infinite; }
.ring.r2 { animation-delay: 1.2s; } .ring.r3 { animation-delay: 2.4s; }
.maint-core {
  position: relative; width: 104px; height: 104px; border-radius: 30px; display: grid; place-items: center; color: var(--accent);
  background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow);
}
.maint-core svg { animation: spin 14s linear infinite; }

.status-chip { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); font-size: 14px; font-weight: 600; color: var(--accent-text); }
.status-chip .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: blink 1.6s ease-in-out infinite; }
.maint h1 { margin-top: 22px; font-size: clamp(34px, 6vw, 68px); line-height: 1.05; letter-spacing: -.035em; font-weight: 600; }
.maint-lead { margin-top: 22px; max-width: 52ch; color: var(--muted); font-size: clamp(17px, 2vw, 20px); }
.maint-actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.maint-note { margin-top: 30px; max-width: 46ch; color: var(--muted); font-size: 15px; }

@keyframes pulse { 0% { transform: scale(.55); opacity: .9; } 100% { transform: scale(1.15); opacity: 0; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes blink { 50% { opacity: .3; } }

@media (max-width: 560px) {
  .maint-actions .btn { width: 100%; }
  .maint-art { width: 160px; height: 160px; }
}
