html[data-customer-maintenance-pending='true'] body { visibility: hidden; }

html[data-customer-maintenance='true'] body > :not(.customer-maintenance) {
  pointer-events: none;
  user-select: none;
  opacity: 0.62;
  filter: blur(1.5px) saturate(0.88);
  transform: scale(1.004);
  transform-origin: center;
}

.customer-maintenance {
  position: fixed;
  z-index: 2147483647;
  inset: 0;
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 24px;
  color: #173a35;
  background: radial-gradient(circle at 82% 12%, rgba(82, 145, 130, 0.12), transparent 28rem), rgba(242, 246, 240, 0.12);
  backdrop-filter: blur(0.5px);
  font-family: var(--font-body, Manrope, sans-serif);
}

.customer-maintenance-card {
  width: min(100%, 520px);
  box-sizing: border-box;
  padding: clamp(32px, 8vw, 56px);
  border: 1px solid rgba(23, 58, 53, 0.16);
  border-radius: 28px;
  background: rgba(255, 253, 248, 0.94);
  box-shadow: 0 24px 64px rgba(27, 54, 47, 0.12);
  text-align: center;
}

.customer-maintenance-mark {
  display: grid;
  width: 42px;
  height: 42px;
  margin: 0 auto 20px;
  place-items: center;
  border-radius: 50%;
  color: #f8f5ed;
  background: #1a6256;
  font-family: var(--font-display, Spectral, serif);
  font-size: 24px;
}

.customer-maintenance-kicker { margin: 0 0 10px; color: #397266; font-size: 12px; font-weight: 800; letter-spacing: 0.14em; }
.customer-maintenance h1 { margin: 0 0 14px; color: #183c36; font-family: var(--font-display, Spectral, serif); font-size: clamp(32px, 7vw, 46px); line-height: 1.05; }
.customer-maintenance p { margin: 0; color: #31544e; font-size: 16px; line-height: 1.65; }
.customer-maintenance-note { margin-top: 18px !important; color: #71837e !important; font-size: 13px !important; }

.customer-maintenance-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: 22px;
  padding: 8px 16px;
  border: 1px solid currentColor;
  border-radius: 999px;
  color: #173a35;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.customer-maintenance-contact:hover { background: #e7eee8; }
.customer-maintenance-contact:focus-visible { outline: 3px solid #9b7337; outline-offset: 3px; }
